Webflow sync, pageviews & more.
NEW

How can I make this code work on my Webflow page? I've tried adding it to the footer in project settings, the specific page's footer, and an embedded code element, but it's not showing on the published site.

TL;DR
  • Add code in the correct place (Project/Page Footer for scripts, Embed for HTML elements) and ensure it's properly formatted.
  • Publish the site to test (scripts won’t work in preview), check browser console for errors, and use incognito mode to rule out blockers.
  • Verify external script URLs and HTTPS compatibility, avoid code conflicts or syntax errors, and delay execution until the DOM is fully loaded.
  • Always publish after making code changes to apply updates.

If your custom code isn't working on your Webflow site (whether added in the page footer, project footer, or Embed element), here are the steps to troubleshoot and fix the issue.

1. Verify the Code Type and Placement

  • Scripts or external embeds should go in the Project Settings > Custom Code > Footer for site-wide effect, or Page Settings > Custom Code > Footer for page-specific use.
  • If it’s visual HTML elements or widgets, use a "Embed" component placed on the canvas.
  • Scripts that manipulate HTML must wait for the DOM to load — wrap them in window.onload or DOMContentLoaded.

2. Check Webflow's Embed Permissions

  • Webflow disables scripts/scripts-style embeds in the Designer preview. You must publish the site to a custom domain or to the webflow.io subdomain to test whether they’re working.
  • Embedded code (Script/iframe) won't display in preview or Designer mode.

3. Ensure the Script Is Not Blocked

  • Browser or ad blockers can block scripts from domains like Facebook, TikTok, or custom trackers. Test your published site in a private/incognito window with extensions turned off.
  • Check the developer console (F12) in your browser for JavaScript errors when viewing the published site.
  • If your code includes <script src="...">, confirm that:
  • The script URL is correct and publicly accessible.
  • The site uses HTTPS and doesn't block third-party embeds via CORS or Content Security Policies.

5. Watch for Conflicts or Incorrect Syntax

  • One missing semicolon or bracket in a script can prevent it from running.
  • Avoid duplicate script tags or library loads (e.g., loading jQuery manually when Webflow already includes it).

6. Ensure Correct Embedding Format

  • If you're using the Embed element for scripts, make sure you're not inserting only <script src="..."> without pairing it with <script></script> if needed.

7. Delay Script Execution If Needed

  • For dynamically loaded elements (like sliders or forms), your script might need to run after the DOM and Webflow interactions have initialized. Use a wrapper like:
  • window.addEventListener("load", function() { ... });
  • Or use setTimeout(function(){...}, 1000) as a test.

8. Publish Again After Changes

  • Every time you add or change custom code, click Publish again. The code changes do not appear on the live site until published.

Summary

To make your code work on your Webflow page, ensure it's added in the correct location, properly formatted, not blocked by the browser, and that you're testing on the published site, not the Designer. If you've confirmed all of the above and it’s still not rendering, share the actual code snippet you're using to allow for more specific diagnosis.

Rate this answer

Other Webflow Questions