Webflow sync, pageviews & more.
NEW

How can I hide the "no items found" empty field in Webflow for a second multi-image gallery on certain pages?

TL;DR
  • Use Conditional Visibility on CMS pages to hide the "No items found" block based on the gallery field or a custom switch.
  • For static pages, assign a unique class to the empty block and use page-specific CSS or JavaScript to hide it.

To hide the "No items found" empty state for a second multi-image gallery in Webflow on specific pages, you’ll need to apply conditional visibility or custom CSS to control when it appears.

1. Understand the Problem

  • Webflow's built-in empty state layout block automatically shows when a Collection List has no content.
  • If you're displaying multiple galleries, you may want to show or hide the empty block selectively per page.

2. Use Conditional Visibility (Only for CMS Pages)

  • If you’re on a CMS template page, you can use Conditional Visibility directly in the Webflow Designer:
  • Select the “No Items Found” element inside your second gallery Collection List.
  • In the Settings Panel, under Conditional Visibility, set a rule such as:
    • "When [Multi-image field] is set."
    • Alternatively, use a separate plain text switch field (e.g., "Hide second gallery") and set: "When Hide second gallery is not on."
  • This method won't work on static pages — only CMS templates.

3. Set a Custom CSS Class and Use Page-Specific Code

  • On static or non-CMS pages, add a custom class to the empty state element, such as .gallery2-empty.
  • Then, embed a small custom script in the Page Settings > Before section or a custom code embed block on that page only:
  • Example: Hide the empty state only on specific pages using display: none.
  • You could use page-specific selectors, or use Webflow’s Body ID (e.g., body[data-wf-page="..."]) to target the page.

4. Remove the Empty State Content Entirely (Optional)

  • If you never want the empty state shown for that multi-image gallery:
  • In the Designer, select the "No Items Found" block inside the second gallery.
  • Delete its content or leave it blank.
  • The Collection List Wrapper will simply show nothing when empty, without drawing attention.

Summary

Use Conditional Visibility for CMS pages or apply custom CSS with a unique class for static pages to hide the "No items found" message for your second multi-image gallery. This allows control over when that empty block is visible on a per-page basis.

Rate this answer

Other Webflow Questions