[Resolved] Smooth scroll when using generatepress elementor starter sites

[Mark]

I have a GP premium site at generatepress.michianait.net that is based on an Elementor Generatepress starter site. I would like to use the generatepress smooth scroll (and scroll duration options) with the anchor menulinks. Can I use the built in generatepress smooth scroll functionality to do this? Or do I need an elementor plugin?

Thanks,
Mark

[Leo]

Hi there,

Yup you should be able to.

The instruction here should work:
https://docs.generatepress.com/article/smooth-scroll/

[Mark]

Thanks. I wasn’t sure if the GP options only applied to Gutenberg sites, or also to Elementor based GP starter sites.

Mark

[Leo]

No problem 🙂

[Mark]

Yeah, I thought I had read a post from David, where he said you had to disable the GP smooth scroll in the customizer because it conflicted with Elementor.

Mark

[Leo]

Hmm I feel like David would know better than me for Elementor-related issues.

I don’t see an issue though if the primary navigation is coming from GP though.

Maybe give it a shot and let us know if you run into any issues?

[Mark]

Hi Leo, I was referring to David’s comment in point #3 below, but maybe things are different in 2021. I will try it out.

Mark

On April 16, 2019 David wrote:

Hi there,

for me personally, if i have to use Elementor then these are some of the rules i apply:

1. Disable Default Fonts and Colors in Elementor so i can maintain global control of Fonts in the Customizer.

2. I keep Theme Elements as opposed to replacing them with Elementor. In particular the Navigation. The code for the GP mobile and slideout is far superior and a lot easier to customize. I always think why rebuild what the Theme does out of the box.

3. Smooth Scroll has to be disabled in GeneratePress ( unfortunately ) as Elementor chose to leave out the option to disable theres. The two will conflict.

4. I don’t use Canvas template even for a custom landing page as it does not have any Hooks. Instead use the Layouts Element to create your own ‘canvas’ type template when required.

5. Point 4 can also be applied to My Templates in the Display rules. This will apply to editing Elementor Templates making it easier as by default they will open in the Default Template where Sidebars etc can get in the way.

6. If I need to add global content i will use Header Elements and GP hooks as opposed to Elementor Theme Builder. It means adding shortcodes then so be it.

7. Blog Post Columns and Woo Shop columns – if for some reason i am using the Elementor Widgets for these then i would ensure the GP settings are set to 1 column.

8. Custom CSS – although Elementor Pro provides a place to add the CSS i would always add my CSS to my own Style Sheet or Additional CSS. Seen too many instances where users cannot find the CSS they added in Elementor.

9. General Rules for Elementor:
Build out wireframes for all your sections before populating them with content. They can be saved as Templates and imported each time. This will save repeating the same edits over and over.

Note you cannot change section / column / widget padding or margins globally without using CSS. So get them right before moving on.

When building out your sections, set your mobile responsive settings ( padding, margins etc ) first. If you don’t they will inherit the changes made to desktop. Meaning you then have to re-edit every element for tablet and mobile.

[Elvin]

Hi there,

On point #3:

It’s pretty much the same.

You’re basically picking between Elementor and GP script for smooth scroll. GP is easier to remove, that’s why David recommended it.

Also, Since your content is created in Elementor, it’s best if Elementor is the one to use because some internal anchors/links will have to rely on smooth scroll scripts written for Elementor elements.

[Author]

Posts