Post Footer Links Images for Next-Home-Previous in Blogger

In this post you will know How to Use Custom Images for Home, Previous and Next Post Links while using blogger and customize your template and design. Blogger is providing link to home page, previous page and next page from any given specific post page. If you want to use custom images these home, previous and next post instead of using links,you need to use following trick in your blog.

At first Log in to your Blogger Dashboard and Navigate to Layout > Edit HTML and checked the Expand Widget Templates Check box.
The Find below highlighted code in your template:
<div class='blog-pager' id='blog-pager'>
< 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 + &quot;_blog-pager-newer-link&quot;' 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 + &quot;_blog-pager-older-link&quot;' 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
</div>
After finding above code replace it with this code:

• Replace <data:newerPageTitle/> for Next Post with <img src='YOUR-IMAGE-LINK' alt='Next Post' />
• Replace <data:olderPageTitle/> for Older Post with <img src='YOUR-IMAGE-LINK' alt='Previous Post'/>
• Replace <data:homeMsg/> for Homepage with <img src='YOUR-IMAGE-LINK' alt='Home' />

Click On Save to save yours Work, if everything works fine then Save template and done!.
Now you will see like a  following picture in the footer of your blog post.