No Results Conditional

No Results Conditional lets any element on the page react to a post feed being empty. It works two ways: as visibility rules for the page's initial render, and as CSS classes that update live while visitors search.

Overview

An empty search result is a dead end unless you put something there — a message, a "broaden your search" prompt, a contact form, a link to related categories. Voxel's visibility builder can't see whether a feed found anything, so that content had no condition to hang on.

This adds it. Always on; nothing to enable.

Key Features

• Two new rules in Voxel's visibility builder
• Two CSS classes that update live during AJAX searches, with no page reload
• Works on any Elementor element
• Always on

Visibility Rules

In Voxel's visibility builder you now have:

• Post feed has no results (VT)
• Post feed has results (VT)

Put either on any element to control whether it renders when the page first loads.

These are evaluated server-side at render time, so they decide what is in the initial HTML.

Live Classes for AJAX Searches

Visibility rules run once, on page load. When a visitor changes a filter, the feed reloads over AJAX and the rest of the page does not re-render — so for anything that must react to searching, use the classes instead.

Give any Elementor element one of:

Class	Behaviour
vt-show-on-no-results	Hidden normally, shown when the feed is empty
vt-hide-on-no-results	Visible normally, hidden when the feed is empty

Add it under the element's Advanced → CSS Classes. The state updates as visitors search, with no reload.

Which one to use

Use the visibility rules when the element should never exist for a given state. Use the classes when the element needs to appear and disappear as the visitor filters. They can be combined on the same page.

Example

A "Nothing matched — try widening your search" block:

1. Build the block anywhere below the feed
2. Give it the class vt-show-on-no-results
3. It stays hidden until a search comes back empty, then appears — including on searches the visitor runs without reloading

Troubleshooting

The Element Never Appears

Check the class is on the right element — Elementor applies CSS classes to the wrapper, so put it on the section or container you actually want hidden, not on an inner widget.

It Works on Load but Not While Searching

That's the difference between the two mechanisms. Visibility rules only apply to the initial render; switch to the CSS classes for behaviour during AJAX searches.

Requirements

• Voxel theme with a post feed on the page
• Elementor