How can I fix the issue of my Home page not loading in Webflow after tinkering with preloaders without knowing what went wrong?
TL;DR
- Check the Page Load interaction for steps that keep content hidden or repeat infinitely.
- Ensure the preloader element hides properly via display or opacity settings and doesn't block the page with high z-index or looping animations.
- Use Preview and Publish to confirm the issue is resolved.
If your Home page isn’t loading in Webflow after adjusting preloaders, the issue is likely due to a misconfigured preloader interaction or display setting that prevents the main content from appearing.
1. Check Page Load Interactions
- Go to the Home page, then open the Interactions panel (lightning bolt icon in the right panel).
- Look for an interaction labeled "Page load".
- Review the “When page finishes loading” section. If elements are hidden or stuck in a looped animation (like infinite opacity transitions), this can block the page content.
- Disable or modify the interaction by removing steps that hide main content or repeating animations.
2. Inspect the Preloader Element
- Identify your preloader element—this is usually a div layered above the entire page.
- Open the Styles panel and check if it has fixed position, full width/height, and a high z-index—this can cover your content indefinitely.
- Verify it has a display: none or opacity 0 + pointer-events: none step at the end of the animation timeline.
3. Temporarily Hide the Preloader
- Select the preloader div in the Navigator.
- Temporarily set display: none in the Style panel to immediately see if the rest of the page shows up correctly.
- If so, the issue is somewhere in the preloader animation logic.
4. Check for Unfinished or Infinite Loops
- If the preloader uses timed animations, ensure it doesn't loop forever.
- In the Interactions panel, make sure the preloader's hide step actually triggers after a delay (e.g., wait 1.5s, then set to display: none).
- Avoid using infinite transitions like repeating moving loaders without a finish condition.
5. Preview and Publish to Test
- Use the Preview mode in Webflow Designer to test interactions.
- If fixed, Publish the site to confirm the fix applies outside of the Designer.
Summary
Your Home page likely isn’t loading because the preloader isn’t hiding correctly, keeping the main content hidden or covered. Check the Page Load interaction, ensure the preloader eventually hides, and that there are no infinite animations blocking visibility.