How can I fix an issue where the menu is not present on my Webflow site when published, even though it works fine in preview mode? I've tried rebuilding the interactions, removing custom code, and rebuilding the menu, but nothing seems to work. Can you please help me?

TL;DR
  • Ensure the Navbar is inside the Body and integrated properly via Symbols on all pages, then republish the site.  
  • Verify visibility across all breakpoints and check that no interactions or styles are hiding it.  
  • Test in incognito, review custom code for errors, and publish to Webflow.io to rule out domain issues.

If your menu works in Webflow Preview but disappears on the published site, the issue often relates to missing symbols, page-specific display settings, or unpublished changes.

1. Check If the Navbar Is Inside a Symbol

  • Go to your Navigator and see if the menu is part of a Symbol (like a Header or Nav Component).
  • If so, make sure the Symbol is present on the actual page in the Designer. Sometimes Symbols are deleted from individual pages unintentionally.
  • After adding or editing Symbols, always re-publish the site to see the changes live.

2. Ensure the Menu Element Is Displayed on All Breakpoints

  • Rotate through all breakpoints (desktop, tablet, mobile) and check if the menu or menu button is visible and not set to “display: none.”
  • In particular, check:
  • The Navbar visibility toggles.
  • Whether the menu element’s visibility changes at breakpoints.

3. Verify That Display Conditions or Page Load Interactions Aren’t Hiding It

  • Go to the Interactions panel and check if any load, scroll, or click interactions are setting the display of the menu to none or opacity 0 unexpectedly.
  • Common mistake: an interaction affecting a class that is reused across other elements, unintentionally targeting the Navbar.

4. Test in Incognito and Clear Cached Versions

  • Open your site in incognito/private mode to rule out browser cache issues.
  • Make sure you republish the entire site, not just export or view in Preview mode.

5. Check for Custom Code Placement Errors

  • If you've used custom code in the Page Settings or Project Settings > Custom Code, ensure it doesn't have missing closing tags or script errors.
  • Also check the Developer Console (F12) on the published site for JavaScript errors that might prevent the menu from rendering.

6. Confirm the Menu Is Inside the Body Element

  • Open the Navigator and make sure the Navbar isn’t nested outside of the Body element (e.g., inside a stray Symbol or div outside the page structure). If it’s placed incorrectly, it might render in Designer but not on the live site.

7. Publish to Webflow.io Domain as a Sanity Check

  • Try publishing to your Webflow.io staging domain (e.g., yoursite.webflow.io) instead of the custom domain to rule out external hosting issues.
  • If the menu appears there, the issue may lie with custom domain misconfigurations or cached assets.

Summary

Make sure the Navbar is visible across breakpointsinside body, part of the page (not mistakenly removed via Symbol), and that interactions or styles aren’t hiding it on page load. Test the Webflow.io version to isolate the problem from the live custom domain. Debug with the browser console if needed.

Rate this answer

Other Webflow Questions