Replace an image instead of Newer posts, Older posts and Home text link

If you have read most of my posts you would have seen or read my article on how to remove older posts and newer posts links. So today we will discuss how to replace an image instead of older posts and newer posts links. This hack is about replacing an image with the hyperlink instead of just the text link alone.


How to replace an image instead of Newer Posts, Older posts and Home

Replace an image instead of Newer posts, Older posts and Home text link


If you have noticed under my blog post i have added this hack and before you implement this hack make sure that you have created the necessary image for each links (Newer Post, Older Post and Home) and have uploaded in a web host. Now let us see how we can replace an image instead of Newer Posts, Older posts and Home link.

  1. Login to your Blogger Account

  2. Click on Layout

  3. Click on Edit HTML

  4. Tick on Expand widget

  5. And now search for this piece of code

  6. <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>

    <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>

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

  7. Now replace the image with code that is market with red

    <data:newerPageTitle/> : <img alt='Newer Posts' src='http://NewerPostImageURL'/>
    <data:olderPageTitle/> : <img alt='Older Posts' src='http://OlderPostImageURL'/>
    <data:homeMsg/> : <img alt='Home' src='http://HomeImageURL'/>

    Remember to change the NewerPostImageURL with the image source of Newer post image URL, OlderPostImageURL with the image source of Older post image URL and HomeImageURL with the Home image URL that you have uploaded.

  8. Now save your template and youd done.



Hope you like this post of ours, to read more post of similar and many more on blogging, enter your email and subscribe with us to recieve updates of this blog via email or subscribe to as a reader.
Subscribe in a reader


Bookmark this post:
StumpleUpon Ma.gnolia DiggIt! Del.icio.us Blinklist Yahoo Furl Technorati Simpy Spurl Reddit Google



Do you think this post is worth reading and would you like to help our work, if so please bookmark this post for us and lets share it with others.

Link to this post:

People who read this post, also read:



Comments :

1
مدونة الأحرار said...
on 

nice hack ;)

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Post a Comment

What do you think of this post ?

Newer Post Links Older Post Links Go To Home