One Page Scroll

One Page Scroll is a website design technique where all content is on a single, long webpage.

The GutenKit plugin has introduced an One Page Scroll module. You can now easily create smooth scrolling with this effective feature and offer your WordPress site visitors nice user experience similar to a mobile app.

One Page Scroll with GutenKit #

It is a Pro module. Don’t forget to get it from here.

Now, open the page you want to enable One Page Scroll from your WordPress dashboard, after that –

  • Click on the GutenKit Page Settings option
  • Go to Advanced
  • Enable One Page Scroll button

Once you enable the One Page Scroll button, you will get these options:

  • Scroll Speed – Here you can set the scrolling speed of the page.
  • Scroll Animation – There are plenty of scroll animation options here, such as, Linear, Ease In Back, Ease InOut Quad, Ease Out Expo, Ease Out Shine, and so on.
  • Show Dot Navigation – If you want you can enable this options to show dot navigation.
  • Navigation Style – If you enable the Dot Navigation option then from here, you can choose any navigation style.
  • Navigation Position – It lets you set the navigation position at the Top, Bottom, Left, or Right.
  • Horizontal Position – You can set the horizontal position by controlling the bar.
  • Vertical Position – This bar allows you can set the vertical position.
  • Navigation Spacing – You can adjust the navigation spacing from here according to your preferences.
  • Navigation Color – Change the navigation color utilizing the option.

Disable One Page Scroll for any Section #

However, you can disable the One Page Scroll feature for any section of the page.

  1. Go to Document Overview
  2. Select the section for which you want to disable the One Page Scroll feature
  3. Go to Settings

Now, move to the Advanced tab and Find One Page Scroll module. Here, you have to disable the button named Disable For This Section.

Adding Tooltip #

After disabling the One Page Scroll feature for your desired section you can add Tooltip text there.

The other customization options for the Tooltip are – Typography, Color, Padding, and Border Radius.

Final Output #

Here we have modified a page with One Page Scroll of GutenKit –

What are your feelings
Updated on June 6, 2024