Smooth Scroll with custom anchors

Asked on November 30, 2015 in Customization.

Dear all,

Smooth scroll doesn’t works with custom anchors. Every link (for example #contact) is scrolling to the top of the page. Even after following howto here: https://docs.layerswp.com/doc/how-to-create-a-single-scrolling-page-with-anchor-links/
But with the default anchors (like #layers-widget-column-12) it works without any issue.

I really thank you in advance!

Kind regards
John

jonathanhamende Layers User
Reply
  • Possible Answers to Your Question:

  • 1 Answer(s)
    Answered on November 30, 2015.

    Hi there,
    Assuming you are talking about the snippet in this article:
    https://docs.layerswp.com/doc/how-to-add-smooth-scrolling-for-anchor-links/

    This is because the function is specifically looking for IDs that use a hash, not for a name attribute, which is what the custom anchors set (widgets can only have one ID).

    Thanks for your answer. Is there no way the modify the widget ID then?
    I ‘m asking this for 2 reasons:
    – I’m using a translator plugin and instead of having 2 menu’s I want to use the same translated menu for 2 pages but with the same link. For example: widget contact us with id or name contact. and in my menu a link to #contact.
    – I want visitors to see www.domain.com/#contact instead of www.domain.com/#layers-widget-map-1 on mouse hover

    and at the same time using the onepage with smooth scroll

    Thanks in advance
    Jonathan Hamende

    on December 1, 2015.

    You cannot change the widget ID. This is why we give you the Custom Anchor. The problem with this is that a name attribute cannot be added to a <section> element the way the widgets are doing it. Therefore you’re only workaround right now is to use the widget IDs and the classic smooth scroll script. Your hosting control panel should have an option for link cloaking in your domain settings, which keeps the anchors from being visible, or you can do it manually. The following is for affiliate links but is the same process for single-page sites:
    https://yoast.com/cloak-affiliate-links/

    on December 9, 2015.
    Reply