If a slider image is not being hidden on certain pages even though you've set its visibility condition to "hidden", the issue is likely due to incorrect conditional visibility logic, override styles, or misplaced elements.
1. Check Conditional Visibility Settings
- Select the image element within the Webflow Designer.
- In the Element Settings panel (gear icon), review the Conditional Visibility settings.
- Ensure the condition refers to the correct field (e.g., Hide if Current Page Name is not “Home”).
- Remember, Conditional Visibility only works on Collection Pages or inside Collection Lists with valid CMS bindings.
2. Verify CMS Binding and Scope
- If you're using a Collection List or Collection Page, make sure the slider image is properly bound to a collection item.
- If the element is not inside a CMS context, visibility conditions based on CMS fields will not work.
3. Inspect Element Display Settings
- Sometimes elements are hidden via CSS instead of visibility logic.
- Select the image and check the Style panel: look for
Display: none
or Visibility: hidden
. These styles might be applied from a combo class or global class override.
4. Check for Symbol Overrides or Reused Components
- If you're using a Symbol that contains the slider, and placing it across different pages:
- Conditional visibility inside a Symbol will not vary by page unless you use Overrides supported by the new Webflow Components system.
- You must "detach" or use conditional logic outside the symbol to make it page-specific.
5. Inspect Custom Code or Interactions
- Check if there is any custom JavaScript or interactions (like hide/show triggers) that override visibility logic.
- Look in Page Settings → Custom Code or Project Settings → Custom Code.
- Also, check the Interactions panel to see if any page load or scroll-based interactions affect image opacity or display.
6. Publish and Test Live Site
- Conditional visibility does not appear in Preview mode if it's based on CMS or dynamic data.
- Always Publish the site and test the issue on the live/staged domain to verify behavior.
Summary
Ensure your conditional visibility is correctly set based on CMS data, confirm the slider image is placed within a valid CMS context, and check that no CSS classes, symbols, or custom code are overriding display settings. Conditional visibility only works as expected when all rules are structurally valid and tested on the live site.