If your Home page is not loading in Webflow after editing preloaders, it's likely caused by incorrect interactions, infinite animations, or custom code errors.
1. Check the Preloader Animation or Interaction
- Go to the Webflow Designer, then Page trigger settings (top right lightning icon).
- Look for Page Load interactions on the Home page.
- If there’s a preloader set to run on page load, ensure it ends properly (e.g., opacity transitions to 0, display set to none).
- Verify if there’s an infinite loop or a missing animation ending the preloader visibility.
2. Temporarily Disable Preloader Interactions
- Disable the entire page load animation temporarily to test if it resolves the issue.
- In the Interactions panel, toggle off or delete the Page Load animation.
- Reload the published site and check if the page begins to load.
3. Check Preloader Element Visibility
- In the page elements structure (Navigator panel), find your preloader container.
- Make sure it’s set to display: none or opacity: 0 at the end of its animation.
- A preloader stuck on display: flex or opacity: 1 may be covering the entire page.
4. Review Any Custom Code
- Go to Page Settings (gear icon in the Page panel) and check both the Header and Footer custom code fields.
- Look for:
- JavaScript tied to preloader logic (e.g.,
window.onload, setTimeout). - Invalid or infinite JavaScript functions that prevent the DOM from rendering.
- Try temporarily commenting out or removing all custom code and republish to isolate the issue.
5. Inspect in Preview vs. Live Site
- Use Preview Mode inside Webflow’s Designer. If the page works there, the issue might be with published assets, third-party scripts, or hosting configuration.
- If broken both in Designer and on the published site, focus on interactions or layout blockers.
6. Check Element Z-Index and Overflow
- If the preloader or another element has a high z-index and isn’t hidden correctly, it can block the Home page.
- Check the Body and html tags for
overflow: hidden that isn’t reset after page load.
Summary
To fix the Home page loading issue after editing your preloader, disable or fix the preloader interaction, ensure it ends correctly, review any custom code, and check for display or z-index conflicts. Removing the preloader temporarily lets you confirm if it’s the root cause.