Is it possible to clear the anchor tag from the webpage address on reload, or at least return to the same section on page refresh on a custom domain in Webflow?

Published on
September 22, 2023

Yes, it is possible to clear the anchor tag from the webpage address on reload or return to the same section on page refresh on a custom domain in Webflow. This can be achieved by using some JavaScript code.

Here's how you can do it:

  1. Create a new HTML embed element on your Webflow page where you want to clear the anchor tag or return to the same section on page refresh.

  2. Paste the following JavaScript code inside the HTML embed element:

<script>    // This code clears the anchor tag from the webpage address on reload    if (window.location.hash) {        window.location.hash = "";    }    // This code returns to the same section on page refresh    window.onload = function() {        if (window.location.hash) {            var element = document.getElementById(window.location.hash.substring(1));            if (element) {                setTimeout(function() {                    element.scrollIntoView();                }, 0);            }        }    }</script>
  1. Adjust the code if needed. By default, the code will clear the anchor tag on reload and return to the same section on page refresh. However, you can modify it to suit your specific requirements. For example, if you only want to clear the anchor tag on reload, you can remove the second part of the code that returns to the same section.

  2. Save and publish your Webflow site to see the changes in effect. The anchor tag will no longer be present in the webpage address on reload, and the page will scroll to the same section on each refresh.

This JavaScript code works by checking if there is an anchor tag in the webpage address (window.location.hash). If there is, it clears it using window.location.hash = "". Then, on page load (window.onload), it checks if there is an anchor tag again and scrolls to the corresponding section using element.scrollIntoView().

By implementing this code, you can provide a smoother and more seamless user experience on your Webflow site.

Additional questions:

  1. How do I clear the anchor tag from the webpage address in Webflow?
  2. Can I make my Webflow site return to the same section on page refresh?
  3. What is the JavaScript code to remove the anchor tag and scroll to a specific section in Webflow?