WordPress.org

1. septemous
   Member
   Posted 2 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 2 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 2 years ago #

   http://wordpress.org/support/topic/296010?replies=3

4. septemous
   Member
   Posted 2 years ago #

   thank you :)

Topic Closed

This topic has been closed to new replies.