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.

You're trying to make custom code appear and function correctly on your Webflow site, but it’s not rendering even after trying all standard embedding methods.

​

1. Confirm the Code Type and Source

​

• If it’s JavaScript, ensure it’s inside <script> tags and placed in the correct scope (footer or before </body>).
• If it’s HTML, such as a widget or embed box, it must be placed in an Embed element within your Webflow page—not just in Project Settings.
• If it references external resources (e.g., third-party scripts or stylesheets), confirm those URLs are valid and publicly accessible.

​

2. Use the Embed Element for Visible Output

​

• For any content meant to be seen on the page (like a form, widget, or iframe), use Webflow’s Embed component and insert it directly into the Element Tree where you want it to appear.
• Do not rely solely on the Project Settings > Footer Code for this type of code—it runs after the DOM is loaded and does not insert visual elements inline.

​

3. Publish the Site, Not Just Preview

​

• Custom code does not appear in Webflow's Designer Preview or the Editor.
• You must click "Publish" to your domain (or staging domain like yourproject.webflow.io) to see any custom code execution.

​

4. Check for Script Errors in the Browser

​

• Open your site in the browser, then open DevTools → Console and look for errors.
• Errors like "Uncaught ReferenceError" or "Failed to load resource" often indicate missing libraries or permissions.

​

5. Verify External Script Permissions

​

• If your code loads something external (YouTube, Calendly, etc.), some services block loading via iframe or restrict based on headers/domains.
• Make sure any third-party service you're embedding allows embedding on custom domains, especially if you’re testing on webflow.io.

​

6. Avoid Conflicts or Restrictions

​

• Double-check you’re not accidentally overriding your own code by placing multiple versions in different places (e.g., page settings vs. project settings).
• Confirm your site’s Custom Code field isn't cleared or restricted by CMS permissions.

​

7. Test with Simplified Code First

​

• Test a basic snippet like <script>console.log("Code loaded");</script> in an Embed element or Footer Custom Code field to confirm code injection is working.
• If that works, the issue is likely with the complexity or source of your full code.

​

Summary

​

To get your code working, ensure it's placed with the right method based on its function—Embed element for visible HTML, Footer code for scripts, and always test on a published site, not preview. Use DevTools to debug and confirm that external resources are loading correctly.