- This topic has 17 replies, 5 voices, and was last updated 2 years, 6 months ago by Tom.
February 26, 2018 at 8:54 am #506067Robert
Hello, have a one-pager site. The menu items are anchor tags to content on the same page.
But when a link goes to the section of the page, part of the section is under the sticky menu at the top. How do I get it to give it a few extra pixels so the entire section being linked to is visible?
FYI, I am using GP Pro with Elementor Pro.
Thank you in advance.GeneratePress 2.0.2GP Premium 1.5.6February 26, 2018 at 11:46 am #506202LeoStaffCustomer Support
Can you give this solution a shot here?
https://generatepress.com/forums/topic/two-menu-problems/#post-358143March 26, 2018 at 9:37 pm #531943Melody
Hi GP team,
I’d like to follow up on this question, I am using elementor pro to build pages, and a few pages with elementor anchor, I was wondering if the new GP 1.6 smooth scroll function, it will resolve the sticky menu covering the top of the anchor point?
I tried to turn on the smooth scroll by click the smooth scroll box under Customize > General, however the problem remains, I am not sure if I need to add any css code in elementor pro? sorry I am not a developer.March 26, 2018 at 10:56 pm #531986TomLead DeveloperLead Developer
Yes, the new smooth scroll option fixes this issue.
Once the option is turned on, you need to give your link this class:
Then the script will take over 🙂March 27, 2018 at 1:46 am #532105Melody
thank you from the prompt reply, may I ask how to add the “smooth-scroll”? I tried to add it under the particular anchor element’s additional css, didn’t work.
Thank you in advance!March 27, 2018 at 8:48 am #532629TomLead DeveloperLead Developer
First it needs to be turned on in “Customize > General”.
Then your link needs to be set up like this:
<a href="YOURURL.com" class="smooth-scroll">You link</a>March 27, 2018 at 10:39 pm #533259Melody
I am really trying hard(I am not a website designer..),I tried to add the class in text editor, and under chrome console inspect element, right now is as below, but the smooth scroll effect is still not working
<a href="#widow's peak" class="smooth-scroll">髮際線設計</a>
from your reply, I tried to put in hook(apparently it was incorrect), I am really not sure where I could add this class now in order to work.
thank you for your time on this!March 28, 2018 at 8:11 am #533911LeoStaffCustomer SupportMarch 28, 2018 at 7:34 pm #534517Melody
Hi Leo and GP team,
thank you so much for the attention with me!
one more question, I found when I tried to add the html class in text editor, it will change to
<a class="smooth-scroll" href="#widow's peak">髮際線設計</a>
as above, the smooth-scroll will go the the front when I go back to preview. am I adding the html class at the correct place?
here are the links:
two links for example(I’ve taken out the smooth scroll class for now):
Thank you, I hope above are clear for you.
MelodyMarch 29, 2018 at 8:35 am #535224LeoStaffCustomer Support
Not sure if I understand? Are you using the Text Editor?
That order should be fine. But make sure you you fixed the href part as I suggested above: https://generatepress.com/forums/topic/anchor-link-content-shows-up-under-sticky-menu/#post-533911
Let me know.March 29, 2018 at 10:32 pm #535829Melody
yes I put in the class in the Text Editor, as this screenshot, am I doing incorrectly?
and I have this screen video as below, the smooth scroll is not working on mobil responsive.
this particular example is:
Oh and I’ve correct the ‘ and space problem, but still not working.
Thank you!!March 30, 2018 at 9:21 pm #536755TomLead DeveloperLead DeveloperOctober 29, 2018 at 10:54 pm #713869Tim
Apologies for pulling up an old thread here.. I want my navigation menu items to smoothly scroll to their corresponding Elementor section. How would I achieve this?October 30, 2018 at 8:54 am #714505TomLead DeveloperLead DeveloperOctober 30, 2018 at 8:34 pm #715100Tim
Hi Tom – it does, but it actually doesn’t work as well as the GP type. The effect I am after is used in the Awaken Elementor template. I would like to know how it was implemented in this theme.
- You must be logged in to reply to this topic.