Set visibility conditions in Elementor

Visibility Logic Pro adds conditions to Elementor widgets, sections, and containers. Use them to control who sees content and when, without writing code. You can restrict member-only sections, schedule sale or event content, personalize pages with stored data, vary layouts by device, or show region-specific information. The visibility settings are configured alongside the content they control.

Choose the data and context for each rule

The Pro edition extends basic visibility rules with conditions for language, URL parameters, user location, dynamic data, ecommerce activity, post context, archives, IP addresses, and referrers. Language conditions support WPML, Polylang, and TranslatePress. URL parameter conditions support repeaters and nine operators. Geolocation uses MaxMind to detect a visitor’s country, and Dynamic Conditions can use Elementor Pro Dynamic Tags as visibility conditions.

• ACF and user meta: Advanced ACF conditions can use repeater fields, options pages, term meta, user fields, and specific post or user sources. Combine ACF conditions with AND/OR logic and 17 operators. Advanced user meta also works with combining multiple conditions with AND/OR logic.
• Commerce: WooCommerce rules can use order history, active subscriptions, or customer status. Easy Digital Downloads rules support purchase history and subscription status.
• Content context: Target post types, specific pages, taxonomy terms, post type archives, or taxonomy archives.
• Visitor conditions: Apply rules based on IP address or referrer, or use WordPress conditional tags as visibility conditions.

Set the hidden content behavior

Visibility Logic Pro supports Elementor Flexbox containers, classic sections, nested containers, and widgets. You can copy and paste visibility settings between widgets or sections.

By default, a hidden element is removed from the HTML. Enable Keep HTML / Hide by CSS when its markup needs to remain in the document. You can also replace a hidden element with fallback content, either custom text or an Elementor template. Hide When Empty hides a parent section or container when all its child widgets have been hidden by visibility conditions.

Apply and render the rules

Install the extension and edit a page with Elementor. Select a widget, section, or container, then open the Visibility tab or go to Advanced > Visibility Control. Enable Visibility Logic, pick a condition, configure its rule, and save the page. The live page then shows or hides the element according to those settings.

Conditions are processed server-side during page rendering. If user-specific conditions apply to pages using a full-page caching extension, exclude those pages from the cache or use Keep HTML / Hide by CSS with client-side cache.