Instructions
Learn how to customize or remove the smooth scroll and scroll interactions included in this template.
Preloader
Change Preloader Logo
To replace the preloader logo, open the Home page and locate the Preload Transition Wrapper element.
Inside the wrapper, find the image element named Preloader Logo and replace it with your preferred logo.
You can replace the image by selecting Preloader Logo and choosing a new image from the Assets panel.
After replacing the logo, make sure to publish the website to apply the changes to the live site.
Smooth Scroll
Adjust Smooth Scroll
To adjust the smoothness of the scrolling, locate the following code:
<script>
const lenis = new Lenis({
lerp: 0.07,
});
</script>You can change the
lerp value to adjust the scrolling behavior.- Lower values create smoother, slower scrolling.
- Higher values create more responsive scrolling.
We recommend keeping the value between
0.05 and 0.1.Remove Smooth Scroll
If you prefer to use Webflow's default scrolling behavior, remove the Lenis code from the Before </body> tag in the Page Settings.
Remove both the Lenis script and the initialization code:
<script src = "https://unpkg.com/lenis@1.3.21/dist/lenis.min.js" > < /script>
<script>
const lenis = new Lenis({
lerp: 0.07,
});
function raf(time) {
lenis.raf(time);
requestAnimationFrame(raf);
}
requestAnimationFrame(raf);
</script >After removing the code, the website will use Webflow's default scrolling behavior.
Custom Code
The Lenis smooth scroll code can be found in:
Page Settings → Custom Code → Before </body> tag
If the code has been added to multiple pages, make sure to update or remove it from each relevant page.
Always publish the website after making changes to ensure the updated behavior is applied to the live site.
