Smooth scroll is the animated effect when navigating trough various positions on a single page using anchor links. Without this function you would just jump instantly from one position on the page to another. Smooth scrolling function enhances the user experience significantly by gradually transferring your focus to the target location. In case your theme doesn’t have this function integrated, you can easily enable it using a smooth scroll WordPress plugin.
How does a smooth scroll WordPress plugin work and how we tested them?
Each smooth scroll WordPress plugin is based on a jQuery script that will create an animated transition when a link leading to another position on the same page is clicked. Those positions can be defined by HTML element’s id or by anchor links, depending on the used plugin. Anchor links are blank HTML links containing only the name attribute, for example <a name=”anchor_name”></a>. Smooth scroll plugins can have more or less customizable settings, allowing you to define parameters such as scrolling speed, animation style, scroll offset etc.
There’s a wide choice of smooth scrolling plugins available in WP Plugins Repository. For our test and review we picked the most popular and best rated ones. We tested each smooth scroll WordPress plugin by the following criteria:
- ease of setting up
- features and customizing possibilities
- plugin performance
- weight and impact on loading speed
Every smooth scroll WordPress plugin we tested performed correctly and did it’s job well. Since each plugin has some specific features of it’s own, read our reviews carefully before choosing the right one for your project.
Smooth scrolling animation is a nice visual enhancment for websites that use links from one position on a single page to another.
Page scroll to id WordPress plugin
Page scroll to id by malihu is by far the most popular smooth scroll WordPress plugin. It has impressive 100.000+ active installations and its voted 5.0 by over 160 developers. The plugin is frequently updated and compatible with the latest version of WordPress. So, let’s see what makes it so popular.
It’s a good thing that the Page scroll to id plugin works out of the box without the need for any settings adjustments. That’s because a less experienced user could easily get scared by the wide quantity of preferences in the plugin’s Settings page. On the other hand, control freaks and experienced developers will love the amount of control they have over the behavior of this smooth scroll WordPress plugin. For most users, the most useful preferences are scrolling speed adjustment, 40+ scroll animations and offset adjustment to mention a few. It is also possible to smoothly scroll to positions on other pages. Another great thing about this plugin is that it’s extremely lightweight. With only one generated server request it won’t significantly affect your website’s loading speed.
The only downside of Page scroll to id is that it doesn’t support anchor links using name attributes by default. As the plugin’s name say, it animates scroll to HTML elements with a defined id attribute only. This could be a problem if your website already uses anchors with name attributes.
Pros
- works out of the box
- scrolling speed adjustment
- scroll animation selection
- offset adjustment
- scroll to other pages
- many advanced features for experienced users
- extremely lightweight
Cons
- doesn’t support name attributes in anchors
- a bit too many preferences for most regular users
Easy Smooth Scroll Links plugin for WordPress
Easy Smooth Scroll Links – Smooth Scrolling Anchor by Webfactory Ltd. / Pandasilk is the second most used free smooth scroll WordPress plugin with over 50.000 active installations. It scores a very high 4.5 average vote. The plugin is regularly updated and compatible with the latest WP version.
Upon installation you quickly can customize a couple of simple settings. You can adjust the scrolling speed, set the offset and choose between around 30 scroll animations. There’s also the possibility to disable smooth scrolling for certain anchors. You can even skip customizing preferences, the plugin will work out of the box just fine. The scroll animation will trigger by links both to name and id attributes. This smooth scroll WordPress plugin is blazing fast and very lightweight. It generates only 1 server request, which won’t impact website loading speed significantly.
We haven’t noticed any downsides while testing this plugin. The only thing we noticed is that the plugin gets in conflict with the <scroll-behavior: smooth> CSS property if your website uses it. In that case you’ll notice the scrolling animation is not as smooth as it should be. If you can, disable that CSS property, otherwise you should consider using another smooth scroll WordPress plugin.
Pros
- works out of the box
- quick and simple customization
- adjustable scroll animation speed
- scroll animation selection
- offset adjustment
- can scroll both to name and id anchor attributes
- scroll to other pages (experimental)
- extremely lightweight
Cons
- in some cases conflicts with the scroll-behavior CSS property
jQuery Smooth Scroll plugin
jQuery Smooth Scroll by Digital Liberation made it to the top three most popular smooth scrolling plugins for WordPress with over 30.000 active installations and a nice 4.5 average vote. The plugin is compatible with the latest version of WordPress.
We already reviewed jQuery Smooth Scroll in our Back To Top Button Plugins article, now let’s see how it performs as a smooth scroll WordPress plugin. Upon installation, this super simple plugin will add the smooth scrolling function to your website, but it will also add a Back To Top Button to the lower right corner of your website. No need to look for the plugin settings, because there are no preferences to customize. It’s a good thing for less experienced users in need for a simple solution without the need for additional customization. It’s also one item less in usuall crowded WP Dashboard menus. The plugin works well both for a smooth scrolling trough the page and for jumping back to top using the built in button. Smooth scrolling works both with name and id anchor attributes.
If you’re looking for a simple install and go solution and you’re fine with the no settings concept, this plugin has no significant downsides. The only downside we could mention is that it generates 3 server requests, which makes it less lightweight than competitive smooth scroll WordPress plugins. In the other hand, its a two-in-one plugin and from that perspective it’s quite lightweight. The plugin might get in conflict with the <scroll-behavior: smooth> CSS property if your website uses it. If you notice glitches in the scroll animation, try disabling that property.
Pros
- works fine out of the box
- no settings concept
- works with both name and id attributes
- includes the Back To Top Button
Cons
- less lightweight than competitive plugins
- possible conflicts with the scroll-behavior CSS property
Smoothscroller smooth scroll WordPress plugin
Apart from the most popular, there’s a bunch of less used scrolling plugins that are worth a try. Some of them offer unique features not found among the most popular plugins. An example of a such smooth scroll WordPress plugin is Smoothscroller by Neil Gee. With just under 1000 active installations and a 5.0 average vote, this plugin is not to be scratched at all.
Unlike most others, this plugin won’t work out of the box. Upon installation, you need to open the plugin settings page, and quickly customize a couple of preferences.Smoothscroller allows you to selectively enable smooth scrolling for all pages and posts, the homepage or only on certain pages or posts which you define by entering their id’s. For some projects, this could be a quite useful feature. The plugin also offers you to set the scrolling animation speed but there are no animations to choose or offset to adjust. Scrolling to both name and id anchor attributes is supported.
This smooth scroll WordPress plugin generates 3 server requests, which is considered quite lightweight, but not as lightweight as some competitive plugins. In case the scrolling animation is not as smooth as expected check if your website uses the <scroll-behavior: smooth> and try to disable it.
Pros
- scrolling speed adjustment
- filtering options allowing to selectively use smooth scrolling on predefined pages and posts
- works with both name and id attributes
Cons
- no offset adjustment and animation type selection
- not as lightweight as competitive plugins
- possible conflicts with the scroll-behavior CSS property
Which plugin is the best for your project?
It’s quite obvious that whichever smooth scroll WordPress plugin you choose, you’ll have a fully functional animated scrolling effect on your website. However, each plugin has some unique features that differentiates it from the others. To make your choice easier, here’s a short guide on how to choose the best plugin for your specific project:
- Page scroll to id: Very lightweight plugin with plenty of features and customization possibilities, for those who want complete control over smooth scroll behavior
- Easy Smooth Scroll Links: best all around plugin suitable for most projects, also very lightweight
- Easy Smooth Scroll Links: simple but good no settings plugin, comes with integrated Back To Top Button
- Smoothscroller: for those who need the possibility to enable or disable smooth scrolling for specific pages or posts
Looking for a no plugin solution? Enable smooth scrolling using a simple jQuery script or even only CSS…
Are you not completely satisfied with any smooth scroll WordPress plugin available or you’re trying to use as less plugins as possible? If so, the solution is adding a simple jQuery script to your website. There’s an even simpler solution based on CSS only. We’ll show you how to do it in our next Smooth Scroll Tutorial.
Featured Tutorial
- Install WordPress in cPanel – Detailed step by step tutorial
The creation of any WP based website, from simple personal blogs over popular web magazines to sophisticated web shops start ...