Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

Do accordion block anchor links work on the same page?

  • I followed the docs and set up some links & html anchors to open accordion blocks but it’s not working. I just want to do a smooth-scroll down and then open the accordion content but it doesn’t seem to be a cache issue.

  • Hi there,

    It should, but it will require custom JS to make it smooth scroll on the same page. I have something in my bin, give this a try:

    //scroll to accordion and click the button inside the ID (accordion item)to open the accordion
    <script>
    document.addEventListener('DOMContentLoaded', function() {
        var hash = window.location.hash;
    
        if (hash && document.querySelector(hash)) {
            document.querySelector(hash).scrollIntoView({ behavior: 'smooth' });
    
            var accordionButton = document.querySelector(hash + ' > button.gb-accordion__toggle');
            if (accordionButton) {
                accordionButton.click();
            }
        }
    });
    </script>
  • Gotcha. The js did not work. I’m open if you have another suggestion but I hid the buttons so the client does not see them.

  • I just tested it on my site and it worked out of the box.

    The issue is from the smooth-scroll class you added to the button, can you remove that class?

    And if you do not want to use JS, you can use this CSS to smooth scroll everything:

    html {
        scroll-behavior: smooth;
    }
  • Thank you!

  • No Problem 🙂

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.