Buffer

Change/Replace Newer, Older And Home Navigation Links With Image Button On Blogger

By Durodola Ridwan | Wednesday, July 11, 2012 | | Be the first to comment!

This is another awesome way of replacing the newer, older and home links with an image button,in my previous post, i have discuss on how how to replace older and newer posts with posts title links but today tutorial is base on how to replace it with an image button, you can surf the web for different types of icons that can be use to replace newer, older and home links or you create an icon that best suit your blog, example of this can be found at the bottom of this blog posts.

This navigation icon will appear at the button of your every post, which will allow readers to navigate through your older and newer posts. By default the links are represented with text, but today it became history, because you are going to learn how to replace those links with an image button, which will makes your blog to look more professional.

How To Replace The Navigation Links With Image Button
  • Go to your blogger dashboard
  • Click on "Design" > "Edit HTML" > back up your template
  • Mark/Tick "Expand Widget Templates"
  • Use ctrl F to find <data:newerPageTitle/> and replace it with the code below.
<img src='http://4.bp.blogspot.com/-6-l6Y6-eymo/T_3M2NWhbMI/AAAAAAAAAn0/mWFZJTn2LTI/s1600/RB+Newer+Posts.jpg' alt='Next Post'/>
  • Now find <data:olderPageTitle/> and replace it with the code below.
<img src='http://3.bp.blogspot.com/-uDlzs-PAsDE/T_3L7eiQ_xI/AAAAAAAAAns/dPzeechZZ9k/s1600/RB+Older+Posts.jpg' alt='Previous Post'/>
  • Now search for <data:homeMsg/> and replace it with the code below.
<img src='http://3.bp.blogspot.com/-XDLKWPtlpjE/T_3JRwy78gI/AAAAAAAAAnc/cH4WZK8Zy84/s1600/Home.jpg' alt='Home'/>
  • Replace all highlighted portion with your image button url or leave it as it is, if you want the image button below this blog posts, and click "SAVE TEMPLATE"
That's all, if you like this article, take few seconds to share it and we like to hear from you, what you feel about this awesome changes.

Enjoyed This Post? Subscribe For More Update!

Related Posts Plugin for WordPress, Blogger...

0 comments:

Confused? Feel free to ask

Your feedback is always appreciated. We will try to reply to your queries as soon as time allows.

Note:
1. To add HTML code in comments then please use our HTML Encoder
2. For perfect customization of our tutorials, use our HTML Editor
3. If you want to be notified on follow up comments or replies, click on "Subscribe by email" below the comment box.
4. Please do not spam, Spam comments will be deleted immediately upon our review.

Regards,
Ridwan

Next Post Previous Post Home

About Me

My Photo
Durodola Ridwan is a blogger enthusiast and founder of www.realcombiz.com. He love writing about Blogging tips, SEO, SocialMedia strategies, and Tech news in general. You can hook him up on facebook, twitter @realcombiz, and Google+.

Recent Posts

Copyright © 2013. All Rights Reserved | Home | Contact | Privacy Policy
Powered by Blogger