Add Keyboard Navigation In Your Blog For Next/Prev Functions

Add keyboard navigation to blogger posts
Blogger's default template has a next and previous post links at the end of the post.We have already seen different ways to customize this links by either replacing it with an image or give it some styles.In this post you can learn how to add a keyboard functionality to your blog.Once you added this functionality a user can easily jump on to the next or the previous post using the keyboard's right and left navigation buttons.This will make you blog interface more ease.This works with the help of a script that you will see below.

How To Add Keyboard Navigation In Your Blog For Next/Prev Functions?

  1. Go to your Blogger Dashboard > Template > Edit HTML
  2. Search for </body>
  3. Copy-Paste the following code before the above code.
  4. Save the template.
<script type='text/javascript'>
window.onload = function()
{
document.onkeyup = function(event)
{
if (document.activeElement.nodeName == &#39;TEXTAREA&#39; || document.activeElement.nodeName == &#39;INPUT&#39;) return;
event = event || window.event;
switch(event.keyCode)
{
case 37:
var newerLink = document.getElementById(&#39;Blog1_blog-pager-newer-link&#39;);
if(newerLink !=null) window.location.href = newerLink.href;
break;
case 39:
var olderLink = document.getElementById(&#39;Blog1_blog-pager-older-link&#39;);
if(olderLink!=null) window.location.href = olderLink.href;
}
};
};
</script>
  
Once added notify your users about this new feature so that your regular readers know about it.
Will you add this script to your site?Leave you comment below!
SHARE

About Shan Eapen Koshy

    Blogger Comment
    Facebook Comment