Last month I posted an article describing our free Magento extension: Magento product list AJAX scroll. It enables your customers to view more products at less effort, hence having a positive influence on conversion. After some positive reactions to this extension we decided to enhance it with a new functionality; a scroll to top button.
More and more customers find us to optimize their Magento hosting infrastructure. This enables them to serve thousands of products in categories at lightning speed (< 100ms serverside response time). And this was what inspired us to apply AJAX scrolling in the first place. It however, does have a downside, in these very large product listings... After five minutes of downwards scrolling, the user might find himself lost from the essential navigational features Magento offers...
So after some time this visitor might decide to actually use one of Magento's navigational features, like the header menu, the layered navigation or the quick search widget. 99% of the Magento design packages out there will place these features at the top of the page. By now your visitor will start panicking, kicking and screaming out of pure frustration. The way to the top seems to long... The visitors' index finger, completely worn out by scrolling down, will now fail. Leaving the visitor with no other option then to sue you...
Hit the button and fly back up
To solve this the problem, a scroll to top button will now magically appear in this all new version. It will do so in the right bottom corner of the screen, after the visitor does some scrolling. Clicking the scroll to top button will return the pages’ focus back on to the start of the page. It will add a nice easing animation effect to the mix, giving your shop a classy look and feel. Check out the demo here. When you’re done, you can download the drop-in extension for Magento here, should work for Magento 1.4, 1.5, 1.6 and 1.7, taking into account the conditions described in the previous article.
Clik here to view.
Magento Scroll to top
Reinventing the (scroll)wheel is pointless, so to make this button appear we included the UItoTop jQuery Plugin. This nice little plug-in was created by Matias Varone . Again, like the Ajax Infinite Scroll plugin, this one requires jQuery (which is included in the extension). So the same story described in the previous post applies.
The same 10 step basic installation and upgrade instruction apply. To summarize once more;
1. Download the zip, version 1.1 (DUH!)
2. Extract it’s contents to the root of your Magento installation. You can use FTP to do that. It’s the directory containing index.php [App] [Skin] [Media] among others
3. Log in to your Magento backend
4. Go to System -> Cache Management, select all options, and in the action dropdown select “Refresh”. Then click Submit.
5. Log out/in to your backend
6. Go to System -> Configuration -> Catalog and drop down the “Front-end” selection
7. The extension adds a new option here; “Use jQuery Infinite Ajax Scroll” and this new version adds the option “Use jQuery UItoTop”.
8. Set both “Use jQuery Infinite Ajax Scroll” and “Use jQuery UItoTop” to “Yes”
9. Click save config.
10. All done!
Gimme! Gimme!
You can download the Magento Ajaxscroll Extension here. You can check out the demo here.
Like this free extension?
Let us know, and like our Facebook page!
