Grow your CSS skills. Land your dream job.

WordPress Older Posts Link with Icon Font

  • # June 18, 2013 at 1:28 pm

    Hi Guys,

    Hopefully you can help me. I’ve been staring at code all day so I need a break but I just can’t figure how to do this.

    I want a previous posts / next posts link in WordPress in my Single.php but I want to include a little arrow next to the text which I’m using an icon font for rather than an image.

    I don’t think I can just use the standard wordpress next_post_link(‘%link’, ‘Next post’); because I need to add a class name to this link and I also need some span tags for the icon font.

    This being the case I created my own links using a div and the necessary span tags with the data attribute etc,

    [The code I'm using is here](http://cdpn.io/nwGjk “My Code Pen”)

    This does work fine, the only problem is when I’m on the most recent post. The text next post disappears as WordPress is controlling this but my span tags still remain. I could use JS to sort this but it just seems like there should be a better way.

    I’m new to WP theming and icon fonts so if anyone can help I’d be very grateful.

    Thanks

    Richard

    # June 18, 2013 at 2:16 pm

    I’m not sure if this still works, but here ya go: http://css-tricks.com/snippets/wordpress/add-class-to-links-generated-by-next_posts_link-and-previous_posts_link/

    # June 18, 2013 at 5:06 pm

    Thanks mate. I think I might I’ve been over complicating this. WordPress does actually provide a rel attribute so I can use that for my CSS hook.

    Cheers

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".