2013 August 15 Archive - EXEIdeas – Let's Your Mind Rock

However, we have seen many WordPress as well as HTML based sites that used Keyboard navigation. You all can see your Previous/Next post via using there button but will it not awesome if we will change it to keyboard keys to navigate through your blogger posts? We all know that keyboard shortcuts are faster than mouse movements. What if you can add keyboard shortcuts to your Blogger blog like arrow key navigation? It would be great isn’t it. With keyboard shortcuts active on your blog you don’t have to look for next and previous links. It’s very easy to implement this feature on Blogger blog. You just have to add widget to your blog.Navigating through a website using the keyboard arrow keys is really useful as you don’t have to look around the page for the Newer or Older page links. You might have already seen this feature on many top blogs.It’s really easy to implement this feature on your Blogger Blog.You just have to add the arrow key navigation widget to your blogger blog. You can use the right and left arrow keys on your keyboard to navigate to previous and next posts on your blog. The arrow key navigation will be disabled when you are typing something into a text box.How This Code Works?This method works with JavaScript, so it makes it a lot easier to apply and made it safely. However, it would stop working if someone would turn off JavaScript, but don’t worry because your next previous button will be still working. It works well on Homepage, Archive pages and even post pages. If you want to navigate to the next page, you will press the “Right Arrow Key” and when you want to navigate to the previous page, you will press the “Left Arrow Key” located on your keyboard.Why You Should This Code?Our first priority is to make our visitor comfortable for that we add some related posts links in article body, add related post widget, sdd random post widgets, design our 404 page and other a lot of things too. Now after using this code we can make our visitor more comfortable because now they don’t have to use there mouse to click on the Next/Previous post button to move forward on other post and click on scrollbar up and down button to scroll up and down our post. Through this code, we can allow them to do all things via keyboard only like up and down is default in all browsers but this code will allow your visitor to check your Next/Previous post via keyboard click too. It mean that now he can use keyboard ←↓↑→ to check your blog all around.Features:1.) Awesome And Stylish Code.2.) Pure JavaScript.3.) Will Not Conflict With Any Other Code.4.) Fully Optimized.5.) Quick To Load And Easy To Install.6.) Will Not Effect Your Blog Loading Time.7.) Cross Browser Support.8.) Left Keyboard Arrow Will Leads Your Visitor To Newer Posts.9.) Right Keyboard Arrow Will Leads Your Visitor To Older Posts.10.) Up And Down Will Work As It Is Doing In All Blogs, Ups And Downs.11.) Your Next/Previous Post Button Will Also Work Too.12.) This Code Will Work On All Pages/Posts.13.) Disabled When You Type Text In Input/TextArea.14.) Will Stop If Your Visitor Used JavaScript Blocker.15.) Your Next/Previous Button Still Remain Working.How To Add In Blogspot?1.) Go To Your www.blogger.com2.) Open Your Desire “Blog“.3.) Go To “Template“.4.) Click “Edit HTML“.5.) Now Click Within Code Box.6.) Press [CTRL+F] To Search Code.7.) Now Copy The Below Code And Paste It After Code..8.) Click “Save Template” And Done. window.onload = function(){document.onkeyup = function(event){if (document.activeElement.nodeName == 'TEXTAREA' || document.activeElement.nodeName == 'INPUT') return;event = event || window.event;switch(event.keyCode){case 37:var newerLink = document.getElementById('Blog1_blog-pager-newer-link');if(newerLink !=null) window.location.href = newerLink.href;break;case 39:var olderLink = document.getElementById('Blog1_blog-pager-older-link');if(olderLink!=null) window.location.href = olderLink.href;}};}; Customization:There Is No Need Of Customization. Save And Enjoy...Notify Your Visitors Too.As you know that this feature is new in blogger and many newbies don't know about it so it's your responsibility to make them know about this by showing some awesome text or image about it that we are using and allowing this features because we have enabled it on our blog. You can use any image or text like "Use ← ↓ ↑ → Keys To Navigate Through Posts" or what you want.Last Words:WoW: That's all, Done. Now visit your blog and Press either “Left" or “Right" arrow keys to see how perfectly everything works. It is extremely responsive and works pretty well. Now how you feel about this, Let us know your views about this via comment and don't forget to share this too. If you have any query, feel free to ask us freely. We will reply you too.