treehouse : what would you like to learn today?
Web Design Web Development iOS Development

[Solved] Styling the links in my blog

  • Hi everyone, I have made a website but I'm unable to find where to style the links in my blog. Links like "older posts" "x comments" "continue reading" (in the archive and category sections) etc.

    Can anyone help me out a little. My blog is over here.
  • I suggest getting the Firebug plug-in for Firefox. It makes this (and nearly every other part of development) super easy.

    Firstly, you could add classes to each type of link, but assuming you can't...

    The first could be targeted with:
    #blog a { }

    The second with:
    #blog p a { }

    The third with:
    #blog p a span { }

    The problem of course will be that these could target other links in the post, so you'll need to have higher specificity on those. For instance, instead of a.post { }, you may need #blog a.post { } or #blog p a.post { }
  • Thank you very much for your reply wolfcry. I already have firebug installed, but the problem is that according to firebug it's an automatically generated link with no class or id assigned to it. And I can't find it in functions-file as well.

    Any further suggestions are very welcome.
  • In the meanwhile I managed to find the read further links in the functions-file and assigned a class sto it but I still can't seem to find the "older posts" and "newer posts" links.
  • when you use the inspector in Firebug, under the style tab (to the right) it will show you what css has been applied to the element, either directly or inherited and from which stylesheet. The links you point out have no direct selector, so you may need to add them to one the stylesheets.

    I think it may be better to look into the blogging system and have it add a class in this case.
  • Do you by any chance know where to find them in the blogging system?
  • what are using?
  • a child theme of starkers wordpress
  • Open your index.php (Or loop.php if your theme has that) file and search for "Older posts". That should find the anchor link.
  • Thanks a lot jamie, is it possible to assign a class to them by any chance?


    <?php if ( $wp_query->max_num_pages > 1 ) : ?>
    <?php next_posts_link( __( 'Oudere artikelen', 'twentyten' ) ); ?>
    <?php previous_posts_link( __( 'Nieuwere artikelen', 'twentyten' ) ); ?>
    <?php endif; ?>


    What does the 'twentyten' thing do?
  • Never mind, i wrapped a div around it
  • All that's left is that I would like to lower the comments (post comment, 1 comment, %comments) etc. to a new line (or create a space down)
  • done, thanks for all the help guys.