Circles on pages behave differently from main page.

  • ShaiRoelud

    (@shairoelud)


    11 years, 1 month ago

    Hello,

    I hope my question will be clear, because I cannot link you to the site because right now I’m developing it on a local server. But here it goes… 🙂

    So I’ve changed the theme (using a child theme) so that I can use pages to generate the circles instead of posts. The homepage is currently filled with circles that link to only parent pages (not child pages). I’m basically using the circles as the main menu and have hidden the menu in the right upper corner.

    Two of the parent pages should be displaying another circles (sub)menu which will subsequently link to its child pages.

    The good news
    I managed to make a submenu of circles on a parent page, making use of a custom template for the parent pages that is basically a copy of the template of the main page (index.php). And it does make a circles menu (yeay! :-)).

    The bad news
    The spacing of the circles on these pages is different from the spacing on the main page (they are further apart).
    And when I do add a featured picture, the circle turns into a big square and I basically lose my circle all together.

    Can anyone give me some pointers where to look, because I’ve been trying all sorts of things in different files, but I cannot seem to figure it out? All help is appreciated.

    Thanks,
    Roel

Viewing 4 replies - 1 through 4 (of 4 total)
  • Theme Author Caroline Moore

    (@sixhours)

    11 years, 1 month ago

    Where you’re working with a child theme, it’s almost impossible to say because we can’t see the code in action.

    It’s likely a CSS conflict — changing the posts to pages may have triggered extra styles that normally target pages or page thumbnails but not posts. I would use a browser addon like Firebug to look for errant padding/margins affecting the display of the circles, and ensure any styles applied to the original theme’s post thumbnails are applied to your new post thumbnails.

    Good luck!

    Thread Starter ShaiRoelud

    (@shairoelud)

    11 years, 1 month ago

    Thanks Caroline for the quick response, I kinda expected that it would be hard to tell. I’m using Firebug to see what happens and why it happens. Didn’t figure it out yet, but I did find that line 766 of the CSS is not listed for the submenus. This is the code:

    .blog .hentry a .attachment-post-thumbnail,
.archive .hentry a .attachment-post-thumbnail,
.search .hentry a .attachment-post-thumbnail {
	border-radius: 180px;
	filter: grayscale(100%);
	-webkit-filter: grayscale(100%);
	-webkit-filter: grayscale(1); /* Older versions of webkit */
	-moz-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	-ms-filter: grayscale(100%); /* IE 10 */
	filter: gray; /* IE 9 */
	filter: url('inc/desaturate.svg#greyscale'); /* Firefox */
	opacity: .8;
	-webkit-opacity: .8;
	-moz-opacity: .8;
	transition: all .3s ease-in-out;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	width: 100%;
	height: 100%;
	z-index: 1;
}

    I’m thinking that the solution might be that I somehow make a class for the submenu pages and add that class here or am I completely off?

    Theme Author Caroline Moore

    (@sixhours)

    11 years, 1 month ago

    Give it a shot, see if it works — the worst that happens is you have to Ctrl+Z. 🙂

    Thread Starter ShaiRoelud

    (@shairoelud)

    11 years, 1 month ago

    The magic key combo. 😉 I’ll try to find out how to do that (at this moment I have no clue), so far I could find a lot using Google. I’ll let you know if I got it to work.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Circles on pages behave differently from main page.’ is closed to new replies.