WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Replace text navigation with image buttons?? (4 posts)

  1. septemous
    Member
    Posted 4 years ago #

    Hi - thanks in advance.

    I would like to replace the text versions of the previous/next page links to image buttons.

    Our URL is: http://www.ablogvoyage.com/

    the code I have is:

    <div class="navigation">
       <div class="alignleft"><?php next_posts_link('&laquo; Next page') ?></div>
       <div class="alignright"><?php previous_posts_link('Previous page &raquo;') ?></div>
    </div>

    I would like to have /images/next.png & /images/previous.png instead of the « Next page & Previous page »

    Is this possible?

    thanks again for your time
    S_

  2. ClaytonJames
    Member
    Posted 4 years ago #

    Define classes in your style sheet for "previous" and next". Of course, apply whatever styling you need. This is very general;

    .previous a {
    background:url(images/previous.png);
    float:left;
    }
    .previous a:hover {
    background:url(images/previous.png);
    float:left;
    }
    .next a {
    background:url(images/next.png);
    float:right;
    }
    .next a:hover {
    background:url(images/next.png);
    float:right;
    }

    Then assign a "next" and "previous" class to the navigation in your template.

    <div class="navigation"><div class="next"><?php next_posts_link('&laquo; Next page') ?></div>
    <div class="previous"><?php previous_posts_link('Previous page &raquo;') ?></div>

    I think that does it. Does that look right? Anyone?

  3. ClaytonJames
    Member
    Posted 4 years ago #

  4. septemous
    Member
    Posted 4 years ago #

    thank you :)

Topic Closed

This topic has been closed to new replies.

About this Topic