The Scroller is a beautiful scrollbar for WordPress website, any element on, or a whole WordPress page. The Scroller is explicitly designed to customize the scrollbar on your WordPress site. This WordPress plugin turns an ordinary annoying browser scrollbar into a lovely stylized scrolling control.
The Scroller may not be compatible with other scroll control plugins. If your WordPress website has a smooth scrolling plugin or another custom scrollbar plugin installed, they may not work together.
The installation process is typical for WordPress plugins. It is simple and easy. If you need help installing the plugin, read about Installing WordPress plugin.
Click on the Scroller in the WordPress side-menu, to open the plugin settings page:
In the plugin settings page, there are several tabs responsible for various groups of plugin settings:
All the basic and important settings of the scrollbar are on the general tab. By default, Scroller works to scroll the entire page. However, the Scroller can work for any child container on the page. In order to activate the scroll for any child container, use the CSS class
Styles for Window
This setting enables and disables the styling of the scroll for browser window.
Enable for Touch Devices
The Scroller does not control scrolling on touch devices, but the Scroller can stylize the scroll bar for touch devices in Webkit browsers. This setting enables and disables the styling of the scroll bar on touch devices.
Switch to turn on the gradient. The additional field for choosing the second color will be available after turning on this switch.
The border-radius of the scroll bar. You can make the scrollbar completely rectangular with this setting, or select another rounding.
Light color scheme/Dark color scheme
The scrollbar design automatically adapts to the light/dark mode of your browser. You can manage the display styles separately for each of the modes.
- Background color – this setting allows setting the background color of the scrolling bar. The background is not visible in the default state but will be shown about the click or when hovering on the scrollbar.
- Scrollbar color – the color of the scroll slider. It has 50% transparency in the default state, but it becomes completely not transparent when hovering or clicking.
The option to enable/disable the scrollbar size animation on hover.
Min Scrollbar length
Depending on the size of the content and the size of the container, the scroll slider can have different lengths. This setting controls the minimal possible scrolling slider length.
Max Scrollbar length
Depending on the size of the content and the size of the container, the scroll slider can have different lengths. This setting controls the maximum possible scrolling slider length.
This setting sets the width of the scroll bar in pixels. You can choose between 10 and 100 pixels
This setting adjusts the free space to the right and left of the scrollbar slider. You can choose from 0 to 50 pixels.
Animate on hover
With this, then you can turn off the animation when hovering on the scrollbar
Scrolling speed is configured using this setting. The default value is 1. Scrolling will be faster if the value is greater than 1, or less – if the speed is set to less than 1. To completely disable scrolling, set to 0.
If this option is on, when the scroll reaches the end of the side, the mouse wheel event will be propagated to the parent element.
Blocks the display of the horizontal scrollbar.
Blocks the display of the vertical scrollbar.
Do not forget to click Save Changes after changing plugin settings. After clicking this button, the settings will be saved and applied to all pages of the website.
Fast and reliable hosting is significant for any WordPress site. We recommend all our customers use SiteGround WordPress Hosting. Many unique settings and features make this hosting the number 1 for WordPress: Free Website Transfer, Staging Tools, Free SSL, CDN, and much more for 3.95/mo.