How To Change "Older Posts", "Newer Posts", And "Home" With Icon

H, friend! Now i will teach you about how to change "Older Posts", "Newer Posts", and "Home" with an icon. Usually "Older Posts", "Newer Posts", and "Home" located under our blog. The function is direct us to go to another page, either older posts page or newer posts page. Usually, the commands ("Older Posts", "Newer Posts", "Home") are only a word, therefore we will change the word into an icon. Now, if you want this trick, just follow the steps.

1. Log in to your blogger icon
2. Go to Design>>>Edit HTML
3. Thick "Expand Widget Templates"
4. Then find this code :

<b:includable id='nextprev'>
<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 + "_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>


</div>



5. Change the blue words with image script

<img border='0' src='ICON URL'/>


Examples :
<img border='0' src='http://robots1996.fileave.com/Beranda.png'/>


<img border='0' src='http://robots1996.fileave.com/Posting_lama.gif'/>


<img border='0' src='http://robots1996.fileave.com/Posting_lebih_baru.gif'/>


So like this :

<b:includable id='nextprev'>
<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 + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><img border='0' src='http://robots1996.fileave.com/Posting_lebih_baru.gif'/></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'><img border='0' src='http://robots1996.fileave.com/Posting_lama.gif'/></a>
</span>
</b:if>

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><img border='0' src='http://robots1996.fileave.com/Beranda.png'/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><img border='0' src='http://robots1996.fileave.com/Beranda.png'/></a>
</b:if>
</b:if>

</div>

6. If you finish, save it
NOTE : You can change the URL, with your own icon

16 comments:

I was excited to uncover this website. I wanted to thank you for
your time due to this fantastic read!! I definitely savored every
part of it and i also have you saved as a favorite to see new things on your site.


my web-site :: what should i weigh

Reply
Anonymous
15/4/13

Post a Comment

:) :( :)) :D =))