-
Customize Default Links
Customize your “Next Post” and “Older Post” links
By default a series of links is displayed at the bottom of your blog template, these links are
“Next Post”, “Home”, and “Oldest Post” (or “Previous Post”)
These links don't add any value to your blog simply because the anchor text doesn't represent the content or topic of your blog.
Example: if you have a blog about “SEO Tools” it would be better to have a link called "Previous SEO Tools" instead of "Oldest post"
To change this
Go to Design > Edit HTML > Download Full template > Click to save the copy just in case something goes wrong.
Now click on Expand Widget Templates and find the code below
<b:includable id="nextprev">
</b:includable></code><div class="blog-pager" id="blog-pager">
<b:if cond="data:newerPageUrl">
<span id="blog-pager-newer-link">
<a class="blog-pager-newer-link" href="data:newerPageUrl" id="data:widget.instanceId + "_blog-pager-newer-link"" title="data:newerPageTitle"><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" href="data:olderPageUrl" id="data:widget.instanceId + "_blog-pager-older-link"" title="data:olderPageTitle"><data:olderpagetitle></data:olderpagetitle></a>
</span>
</b:if>
<a class="home-link" href="data:blog.homepageUrl"><data:homemsg></data:homemsg></a>
</div>
<div class="clear">
Now replace the code with this new 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"' title='Next SEO TIP'>Next SEO TIP</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"' title='Previous SEO TIP'>Previous SEO TIP</a>
</span>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl' title='List of SEO Tips'>List of SEO Tips</a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'>Next SEO Tip</a>
</b:if>
</b:if>
</div>
Now you can replace the text "SEO Tip" with something that represents the content of your blog, something related to the main topic of your blog. Remember be creative.
How this works
The idea behind this little change is that your links will be:
More SEO friendly - the anchor text and the title tag of the links (title="") represents the content of the blog.
More User Friendly - All users can now have a better idea of what is behind these links (if the link is called Next SEO Tip - What do you think it will open?)
Professional - These customized links will give a better and more professional look to your blog.
Parts of the code
If you are not so familiar with the code used on blogger templates take a look at this to understand a bit more about how they work:<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' title='Next SEO Tip'>Next SEO Tip</a>
expr:href='data:newerPageUrl' - this piece of code is the one that includes a link to your latest post
title='Next SEO Tip' - this gives to the link the title tag - if you move the mouse over the link, you will see the text included on the tag - on this example it will show "Next SEO Tip"
Next SEO Tip - anchor text of your link
If you follow this example your links at the very end of your post will be changed from:
‘Oldest Post’ to ‘Previous SEO Tip’
‘Home’ to ‘SEO Tips’
‘New Post’ to ‘Next SEO Tip’
Just remember now to change “SEO Tips” in the code to something that better describes your blog
Related links to Customize “Next Post” and “Older Post” links
How to detect hidden links
How to build a correct link
Subscribe to:
Post Comments (Atom)
0 comments: