Wordpress Custom Scrollbar

v3.0


Thank you for purchasing my plugin. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!

Worpdress Custom Scrollbar is highly customizable wordpress plugin. Features include vertical and/or horizontal scrollbar(s), adjustable scrolling momentum, mouse-wheel, keyboard and touch support, ready-to-use themes and customization via CSS, RTL direction support more...

You can change almost  popular 100+ scrollbar theme style, ScrollBar scroll speed, Showing ScrollBar arrow button mode, ScrollBar auto-hide mode, ScrollBar auto expand mode, ScrollBar moving mode by keyboard & other settings by using the options and shortcode of this plugin.


In this documentation, we'll cover enough areas of the option panel and shortcode for you to control the plugin effectively. Let's began:

Installing the plugins is just like installing other WordPress plugins. If you don't know how to install plugins, please review the two options below:

Install by ZIP File

  1. From your WordPress dashboard, choose 'Add New' under the 'Plugins' category
  2. Select 'Upload' from the set of links at the top of the page (the second link)
  3. From here, browse for the zip file included in your plugin purchase titled 'wordpress-custom-scrollbar-installable.zip' and click the 'Install Now' button
  4. Once the installation is complete, activate the plugin to enable its features.

Install by FTP

  1. Find the directory titled 'wordpress-custom-scrollbar' and upload it and all files within to the plugins directory of your WordPress install (/WORDPRESS-DIRECTORY/wp-content/plugins/) [e.g. www.yourdomain.com/wp-content/plugins/]
  2. From your WordPress dashboard, choose 'Installed Plugins' option under the 'Plugins' category
  3. Locate the newly added plugin and click on the 'Activate' link to enable its features.

After install, the plugin will add a menu under Settings called "WP Scrollbar Options".

In this settings, you can configure settings. Let's describe.

 

Show Main Scrollbar

Enable or disable the main scrollbar. If you select False the main scrollbar will hide from your theme.

ScrollBar theme style

If you change the list value of your scrollbar theme style will change. if you want to see how to look like the theme style demo, just go to this website Click here

Custom Style

If you give custom style false then Dragger rail color, Dragger rail width, Dragger rail border radius, Dragger bar color, Dragger bar hover color, Dragger bar width, Dragger bar border radius will not work.

Scrollbar scroll speed

Select scrollbar speed here. The default value is 400. If you increase value, the scrolling speed will be slower. If you decrease the value, scrolling speed will be faster.

Showing  arrow button 

If you select False. Arrow button will hide from the up/down or left/right of the scrollbar.

ScrollBar auto hide mode

Enable or disable auto-hiding the scrollbar. If you select true will hide the scrollbar when the cursor is out of the scrolling area.

ScrollBar auto expand mode

Enable or disable auto-expanding the scrollbar(s) when the cursor is over or dragging the scrollbar then scrollbar will auto expand.

ScrollBar moving mode by keyboard

Enable or disable content scrolling via the keyboard. The plugin supports the directional arrows (top, left, right and down), page-up (PgUp), page-down (PgDn), Home and End keys.

Show admin bar

You can show or hide admin bar from here. 

Nested Shortcode

This option for using the shortcode. How many shortcode you want to display  you can define from here.

Custom CSS

Here, Type your custom CSS Code, If you want to modify your content scrollbar style.

If You Do Not Understand Please See The Video Documentation

 

Now I will show how to embed Custom Scrollbar in a single content via shortcode in everywhere you want.

After installing the plugin will add a button on the Post and Page editor toolbar called "WordPress Custom Scrollbar".

 

When you click on the button a popup window will show. By that popup window, you can insert your shortcode easily.

 

In this Popup window, you can configure shortcode. Let's describe.

:

There are almost 25 scrollbar theme style In the Settings menu options page you will see, all the style in ScrollBar theme style list. if your want you can add individual theme style in each single shortcode from this list. if you do not want  to add single theme style need not select  this list . if you do not define this list value Settings menu options page theme style will show.

:

If you want you can add an individual  class in a single shortcode using this field. In the next time, you can add CSS style by calling this class.

:

You can define an individual arrow button mode. If you select False. Arrow button will hide from the up/down or left/right of the scrollbar. if you do not define this list value Settings menu options page Showing ScrollBar arrow button mode will show.

:

Set  an individual  width of your single content. you can use px or %.

:

Set  a individual  height of your single content.  Example:  400px, 200px etc.

Show Scrollbar:

You can select Vertical or Horizontal Scrollbar from here

How to set horizontal scrollbar bar

If you want to set horizontal scrollbar you give value Horizontal Div Width more than the Set Width value

 

Scroll To Vertically And Scroll To Horizontally:

If you set value in Scroll To Vertically Or Scroll To Horizontally. Then the scroll point will show that area. If you set value 200 in Scroll To Vertically field then scrollbar will show 200px bottom from top. If you set value 300 in Scroll To Horizontally  field then scrollbar will show 300px right from left.

Mouse Wheel:

Here If You Select Value Vertically scrollbar scrolls in vertically. If You Set Value Horizontally  scrollbar scrolls in horizontally.

ScrollBar  Position :

Set the position of scrollbar relative to content. There are 2 available values: "inside" and "outside". Setting  "inside" (default) makes the scrollbar appear inside the scrolling area. "outside" makes the scrollbar appear out of the scrolling area.

ScrollBar  speed :

If your want you can add individual scrollbar speed in each single shortcode from this list. if you do not want  to add single scrollbar speed need not give value in the field . if you do not define this list value Settings menu WP Scrollbar Options page ScrollBar scroll speed will be integrated.

Select scrollbar speed here. The default value is 400. If you increase value, the scrolling speed will be slower. If you decrease the value, scrolling speed will be faster.

Auto hide mode :

If your want you can add individual Auto hide mode in each single shortcode from this list. Enable or disable auto-hiding the scrollbar. If you select true will hide the scrollbar when scrolling cursor is out of the scrolling area. if you do not define this list value Settings menu WP Scrollbar Options page ScrollBar auto hide mode will show.

Auto expand mode :

If your want you can add individual Auto expand mode in each single shortcode from this list..Enable or disable auto-expanding the scrollbar(s) when the cursor is over or dragging the scrollbar. if you do not define this list value Settings menu WP Scrollbar Options page ScrollBar auto expand mode will show.

Snap Amount :

You can change snap amount from here.

RTL Direction:

For RTL language, you can set it from here.

Custom Style:

If you set custom style true. Then you will be able to set individual custom style in a scrollbar by adding value in Dragger Rail Color (HEX), Dragger Rail Width, Dragger Rail Border Radius, Dragger Bar Color (HEX), Dragger Bar Width, Dragger Bar Border Radius, Dragger Bar Hover Color, Dragger Horizontal Rail Margin, Dragger Horizontal Bar Margin.

 

If You Do Not Understand Please See The Video Documentation

I've used the following images, icons or other files as listed.


Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

SoftHopper