Change older post and newer post icon

. Sign in Blogger

2. Layout

3. Edit HTML

4. Do not forget to give a check in the Expand Widget Templates

5. Find the code below:

<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class = 'blog-pager-newer-link' expr: href = 'data: newerPageUrl'
expr: id = 'data: widget.instanceId + "_blog-pager-newer-link"'
expr: title = 'data: newerPageTitle'> <data:newerPageTitle/> </ a>
</ span>
</ b: if>

6. Replace any posts over the blue with the code below:

<img src="http://alien.keren.googlepages.com/first.gif"/>

7. Then find this code:

<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class = 'blog-pager-older-link' expr: href = 'data: olderPageUrl'
expr: id = 'data: widget.instanceId + "_blog-pager-older-link"'
expr: title = 'data: olderPageTitle'> <data:olderPageTitle/> </ a>
</ span>
</ b: if>

8. Change the text color blue with the code below:

<img src="http://alien.keren.googlepages.com/last.gif"/>

9. Then find this code:

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'> <data:homeMsg/> </ a>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'> <data:homeMsg/> </ a>
</ b: if>
</ b: if>

10. Replace any posts over the red with the code below:

<img src="http://alien.keren.googlepages.com/home.gif"/>

11. Save and see the results.


  1. Thanks, This is awesome. I was lookink fow hours to find this :D Also, it would be nice to have that kind of a menu at the top of the blog page :)

    Thanks :)

  2. Welcome to Technology Buzz: http://you-tek.com
    Updated hitech events over the world, you-tek for your life !

  3. Buy consoles from MWgames.com.au. MWgames is an Australian wholesaler & retailer specializing in
    nintendo dsi xl, DSi XL,3DS,Wii;PS3,XBOX 360 games and tablets etc.Quality products;Best Price;Satisfactory Service!

  4. thank u
    i try it in my blog


Total Pageviews