Quick summary
Adding JavaScript to Webflow requires navigating to the Custom Code section in your project or page settings and pasting your script before the </body> tag for optimal page load performance. This demo walks through both the site-wide method via the Webflow dashboard and the page-specific method inside the Webflow editor.
Steps
- From the Webflow dashboard, locate your project thumbnail and click the three dotted icon to view options.
- Click on Settings to open your project settings.
- From the left sidebar, navigate to the Custom Code section.
- Review the available code sections for head, body, and footer — note that adding JavaScript in the head section can slow page load times.
- Scroll down to find Add code before </body> tag, enter your script, and wrap it inside <script> and </script> tags — do not include the <body> tags, as they are added automatically.
- Validate and save your changes — note that code added here applies to all pages of your project.
- To apply JavaScript to a specific page, open the editor and go to the Pages tab in the left sidebar menu.
- Hover over the page name to reveal the small gear icon for page settings, then click to open.
- Scroll to the bottom to find the Custom Code section and click to expand.
- Note that scripts added to the head section can increase load time — instead scroll down to the Before the </body> tag section for better performance.
- Embed your JavaScript inside this section, wrapping it in <script> and </script> tags — do not include <body> tags, as they are placed automatically.
- Save your changes and publish your project to make the JavaScript live on your site.
