How can I integrate the "Anchor Links" script into custom code Lenis Smooth Scroll in Webflow?

To integrate the "Anchor Links" script into custom code Lenis Smooth Scroll in Webflow, you can follow these steps:

1. Add the Lenis Smooth Scroll script to your Webflow project:

• Go to the Webflow Designer and click on the page where you want to use the smooth scroll.
• Click on the "Pages" tab on the right-hand side.
• Scroll down to the "Custom Code" section.
• In the "Head Code" section, paste the Lenis Smooth Scroll script code. You can find the script code on the Lenis Smooth Scroll website or in the code provided by the developer.

1. Add the "Anchor Links" script to your Webflow project:

• Follow the same steps as above to access the "Custom Code" section.
• In the "Head Code" section, paste the "Anchor Links" script code. You can find this script code on the Anchor Links website or in the code provided by the developer.

1. Create and style your anchor links:

• In the Webflow Designer, select the text or element that you want to serve as the anchor link.
• Click on the "Settings" tab on the right-hand side.
• Under the "ID" section, enter a unique ID for the anchor link. Make sure to remember or note down the ID as it will be used in the "Anchor Links" script.

1. Set up the smooth scroll with anchor links:

• Open the custom code editor by clicking on the </> icon in the top-right corner of the Designer interface.
• Select the "Before " option in the dropdown menu.
• Inside the code editor, write JavaScript code to initialize the smooth scroll with the anchor links. It should look something like this:

<script>  document.addEventListener("DOMContentLoaded", function(event) {    $('a[href^="#"]').on('click', function (event) {      var $anchor = $(this);            $('html, body').stop().animate({        scrollTop: ($($anchor.attr('href')).offset().top - 80)      }, 800, 'easeInOutQuart');            event.preventDefault();    });  });</script>

1. Publish your Webflow project:

• After completing the steps above, you can preview your website to ensure that the smooth scroll with anchor links is functioning correctly.
• If everything is working as expected, publish your Webflow project to make it live on the internet.

By following these steps, you should be able to integrate the "Anchor Links" script into the custom code Lenis Smooth Scroll in Webflow.

Additional Questions:

• How do I add custom code in Webflow?
• Can I use different smooth scroll scripts in Webflow?
• Are there any other smooth scroll scripts compatible with Webflow?