Display Conditions for Elementor: One Page That Changes for Who Is Looking

October 21, 2026
·
Shahidul Islam
Display conditions extension showing rules that hide an Elementor section

You need one banner for logged out visitors and another for members. A promotional strip that appears on Friday and disappears on Monday. A download button only for the people who have earned it. A different call to action for a returning visitor than for a first one.

The normal solution is to duplicate the page. Then to duplicate it again for the next variation, and to keep four nearly identical pages in step forever. Everyone who has done it knows how that ends: one copy gets updated and the others quietly drift.

Display conditions is a Sky Addons Pro extension that adds a rules panel to every element. The element is shown or hidden based on the conditions you set, on the server, before the page is sent. One page, many audiences.

Display conditions reporting live rules on an Elementor page
Six live rules reporting what the page already knows: day, month, system and browser

Where display conditions fits

  • Membership sites. A join banner for visitors, a dashboard link for members, on one page.
  • Seasonal campaigns. A promotion that appears and disappears on a date, with nobody logging in at midnight.
  • Course platforms. Content that unlocks by role, not by a separate protected page.
  • International sites. A shipping notice for one country, a different one elsewhere.
  • Campaign landing pages. A headline that changes with the URL parameter the ad sent.
  • Returning visitor offers. A first visit message, then a different one on the third.

Why it beats the usual approach

ApproachWhat it costs
Duplicating the page per audienceEvery edit must be repeated. One copy always falls behind
A membership plugin’s shortcodeContent is hidden, but the layout around it still has to be built twice
Hiding with CSSThe content is still in the page source. It is not hidden, only invisible
A custom PHP templateA developer for every change, and a theme file to maintain
Display conditionsA rules panel on any element, evaluated on the server before render

The features that matter

Twenty three conditions, covering the real cases. Authentication, specific user, role, post, post type and static page. Date, a time range, a before date and time, month, time and day of week. Operating system and browser. External URL, URL parameters, URL string and search engine referrer. Visit count and session count. Language, country, and a shortcode condition for anything the list does not cover.

Stack them with all or any. Each element holds a repeater of conditions, plus a relation control. All means every rule must pass, which is how you target narrowly. Any means one is enough, which is how you cover several audiences with one block. Each row also has an is or is not operator, so every condition works in both directions.

Show or hide, decided once. One control sets whether a passing rule set reveals the element or removes it. Writing the rule for the audience you want, then flipping to hide, is usually clearer than inverting every row.

It happens on the server. The element is filtered before rendering, so a hidden element is not in the HTML at all. This is the real difference from a CSS approach, where the content is downloaded, present in view source, and merely not painted.

It knows about caching. Elements with conditions are marked as dynamic so Elementor’s element cache does not serve a stored copy that ignores the rules. This is the detail that breaks most home grown solutions.

The editor stays visible. In the editor every element renders regardless of its conditions, so you can still select and style a block that would be hidden on the front end.

Display conditions showing all twenty three rules in six groups
All twenty three rules, arranged in six groups

How to build it

  1. Select the section, container or widget you want to control. The panel is on the Advanced tab.
  2. Open Display Conditions and turn Enable on.
  3. Set whether a passing rule set should Show or Hide the element.
  4. Add a condition row and pick the condition, for example Authentication or Role.
  5. Set the operator to is or is not, then the value.
  6. Add further rows and set the relation to all or any.
  7. Test on the front end in a private window. The editor always shows the element, so the editor cannot confirm the rule.

Why it works

Filtering before render rather than after is what makes this a content tool instead of a styling trick. Hidden content that is still in the page source is not private, it is not smaller, and it still counts against what search engines read. Removing it server side means the visitor receives a page built for them.

The rules are also evaluated strictly. A condition that cannot answer is skipped rather than counted as a failure, which prevents a plugin being deactivated from silently hiding half a page. Combined with the cache bypass, a conditional element behaves the same on the first visit and the thousandth.

Personalisation on most sites means a slightly different page per audience and four copies to maintain. The version that survives contact with a real team is one page where a few blocks know who is looking.

Getting it right

  • Always test in a private window. The editor shows everything, and you are logged in as an administrator, so the two most common rules will not behave as you expect while you build.
  • Prefer hide with a positive rule. Describing the audience and then hiding is easier to read six months later than a stack of is not rows.
  • Keep the rule count sensible. Every condition on every element is evaluated on every render. A handful per page is nothing. A hundred is a decision.
  • Pair show and hide blocks carefully. Two blocks with opposite rules is the usual pattern for an either or message. Check that no visitor sees both or neither.
  • The post condition lists blog posts. Pages are covered by the separate static page condition, which is the right rule for them.
  • Country and language depend on what the site can detect. Test them from the conditions the site actually runs under rather than assuming a result.
Display conditions serving one hero slot to two audiences
One hero slot serving two audiences, on desktop and on a phone

What else it can carry

Anything on the page. A whole section, a container, a single button, a price, a shipping note, a countdown, a form. Because the extension is attached to every element type rather than a widget, the granularity is yours to choose.

It also works in theme builder templates, which is where it becomes structural rather than tactical. One header with a member area link that only members see. One single post template with an author block that appears only when the post has an author bio. One footer with a country specific legal line. Each is a single template that behaves correctly for everybody.

For the platform level behaviour the conditions build on, the WordPress developer handbook page on conditional tags explains what the site can actually know about a request.

The conditions also compose with each other in ways single rules cannot. A returning visitor from a particular campaign, on a weekday, who is not signed in, is four rows and one relation setting. That combination is what separates a rules panel from a simple logged in check: the useful audiences are rarely described by one fact, and writing them as a short stack is far easier to read later than nesting the logic into separate pages.

Display conditions relation control beside a date based offer
All of them or any of them, and a weekend offer that knows what day it is

Display conditions: common questions

Is display conditions free?

No. It is part of Sky Addons Pro. The free versus Pro page sets out what the licence includes, and pricing has the plans.

Does it need another plugin?

No. Elementor, Sky Addons and a Pro licence. Some conditions become more useful alongside a membership or ecommerce plugin, but none is required.

Will it slow the page down?

Each condition is a check at render time, and most are trivial. The bigger effect is positive: hidden elements are never rendered, so the page sent to the visitor is smaller.

Does it work on mobile?

Yes. There are operating system and browser conditions for device specific rules. For pure layout differences, Elementor’s own responsive visibility controls are the lighter tool.

Why can I still see an element I hid?

Two usual reasons. You are looking in the editor, which always shows everything, or you are logged in as an administrator and the rule is about authentication. Check in a private window.

The short version

Display conditions adds a rules panel to every Elementor element, with 23 conditions covering login state, role, content, date and time, device, URL, visit count, language and country. Rules stack with all or any, each can be inverted, and the element is filtered on the server so hidden content never reaches the browser.

Build it

See the rules in use on the display conditions demo, then read the display conditions documentation. For conditional navigation, see full page menu, and for the blocks the rules usually control, wrapper link.

Written by
Shahidul Islam
Writes about the work behind the widgets — what shipped, why, and what it cost.
Share
In this post

More from the journal

Display Conditions for Elementor: One Page That Changes for Who Is Looking

Display Conditions for Elementor: One Page That Changes for Who Is Looking

Display conditions show or hide any Elementor element using 23 rules covering login, role, date, device, URL, visit count, country and language.
Post Comments for Elementor: Style the Discussion Instead of Hiding It

Post Comments for Elementor: Style the Discussion Instead of Hiding It

The post comments widget drops native WordPress comments into an Elementor template and gives you 8 style sections to make them match the design.
Animated Gradient Background for Elementor: A Hero That Moves Without a Video

Animated Gradient Background for Elementor: A Hero That Moves Without a Video

An animated gradient background gives an Elementor hero motion without a video file. Three colour stops per step, blend modes and a pause when off screen.

Comments are closed.