---
title: "How to Set Elementor Display Condition Based on Dynamic Custom Fields (Acf, Jetengine, Metabox)?"
url: https://theplusaddons.com/docs/set-elementor-display-condition-based-on-dynamic-custom-fields/
date: 2023-06-23
modified: 2026-09-11
lang: en
author: "Aditya Sharma"
description: "Displaying content conditionally based on dynamic custom fields gives you precise control over what each visitor sees on your site. Plugins like ACF, JetEngine, MetaBox, and Toolset let you attach..."
image: https://theplusaddons.com/wp-content/uploads/2023/06/How-to-Set-Elementor-Display-Condition-Based-on-Dynamic-Custom-Fields-Acf-Jetengine-Metabox_-1024x536.jpg
word_count: 2202
---

# How to Set Elementor Display Condition Based on Dynamic Custom Fields (Acf, Jetengine, Metabox)?

## 

- The Plus Addons for Elementor Pro includes Display Condition, and it is off by default until The Plus Addons > Extensions turns it on.
- Display Condition appears in the Advanced tab of any Elementor widget, section, or container, and the editor shows everything while conditions apply only on the published page.
- Keep HTML stays on by default, so hidden elements still reach the browser and page source unless it is turned off for private content like members-only details or prices for logged-in customers.
- ACF Text Fields, ACF Selection, ACF Button Group, ACF Boolean, ACF Date / Time, ACF Post, and ACF Taxonomy each provide Rule tab options with Is or Not logic to show or hide content from field values.
- ACF Selection allows multiple values for checkbox fields, ACF Button Group also allows multiple values, and ACF Date / Time uses a Before Date field to compare against an earlier date and time.

Displaying content conditionally based on dynamic custom fields gives you precise control over what each visitor sees on your site. Plugins like ACF, JetEngine, MetaBox, and Toolset let you attach custom fields to posts, products, and custom post types, and the Display Condition extension in The Plus Addons for Elementor reads those field values to show or hide any Elementor widget.

The Display Condition extension of The Plus Addons for Elementor lets you set display conditions based on different custom fields.

*To check the complete feature overview documentation of The Plus Addons for Elementor Display Condition extension, [click here](/docs/display-conditions-settings-overview/).*

***Requirement  - This extension is a part of The Plus Addons for Elementor, make sure it is installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-extras/display-conditions/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

## Before You Start

- **Edition:** **Pro** — Display Condition is part of The Plus Addons for Elementor Pro. It does not exist in the free plugin.- **Switch it on.** It is off by default. Go to **The Plus Addons > Extensions** and turn on **Display Condition**.- **Where it appears:** the **Advanced** tab of any Elementor widget, section or container — not only The Plus Addons widgets.

> ***The editor always shows everything.** Conditions are applied only on the published page, so check the result in a private window — logged out if the rule is about login status.*

**Best Used For:**

- Membership sites that need to show premium content only when an ACF boolean field marks a post as paid or members-only

- WooCommerce stores displaying product-specific sections based on ACF selection fields like product type or availability status

- Marketing sites personalizing page content for different visitor segments using JetEngine or MetaBox custom fields

For ease of understanding, we are using the free Advanced Custom Fields (ACF) plugin here, but if you are using some other dynamic custom fields plugins like JetEngine, MetaBox, or Toolset you will get relevant display condition options.

To add display conditions based on custom fields of Advanced Custom Fields, add any Elementor widget on the page. 

1. Go to **Advanced** > **Display Condition**.

2. Turn on the **Display Condition** toggle.

Now you will see **Keep HTML**, which is on by default. While it is on, an element whose conditions are not met is still sent to the browser and hidden with CSS, so its content can be read in the page source. Turn it **off** for anything private — members-only details, prices for logged-in customers — so the element is not sent at all.

3. After selecting the appropriate option from the **Display When** dropdown, go to the **Rules** section. Here you have to set the actual display condition. You can have one or multiple conditions.

4. Then click on the **Rule** tab. Here you will find different options under the **Advanced Custom Fields **label.

## How to Set Elementor Display Condition Based on ACF Text Fields? 

With this option, you can show or hide content based on the values of different ACF text fields such as text, number, range, email, URL, password, and text area.

Suppose we have created a custom field group called Additional Information for our posts. Here we have a Text field called Name with the value “Sam”.

![ACF text field for Elementor display condition in The Plus Addons for Elementor](https://theplusaddons.com/wp-content/uploads/2023/06/acf-text-field.png)

Now to set the display condition based on the value of that text field, from the Elementor editor select the widget on the page.

1. Choose **ACF : Text Fields** from the first dropdown under the **Rule** tab.

2. Then in the second dropdown, add the field label.

3. Then in the third dropdown, you have two options - 

**Is** - The condition evaluates as true. Use this to show the widget only when the custom field value matches your target.

**Not** - The condition evaluates as false. Use this to hide the widget when the custom field value matches, and show it to all other visitors.

4. In the last field, add the same text field value that you have entered in the ACF field.

Depending on your choice in the third field (Is or Not), your content will be visible or hidden.

Following this process, you can set display conditions based on the values of other ACF text fields.

The Plus Addons for Elementor also integrates ACF gallery fields directly in the Elementor editor. See [How to Create an Elementor Gallery with ACF Gallery](https://theplusaddons.com/docs/create-elementor-gallery-with-acf-gallery/) to display images stored in ACF gallery fields on your pages.

## How to Set Elementor Display Condition Based on ACF Selection? 

With this option, you can set display conditions based on the values of different ACF selection fields such as select, radio button, and checkbox.

Taking the example above, we have added a Status select field in the Additional Information and we have set the value as “Editor”.

Now to set the display condition based on the value of that select field, from the Elementor editor, select the widget on the page. 

1. Choose **ACF : Selection** from the first dropdown under the **Rule** tab.

2. Then in the second dropdown, add the field label.

3. Then in the third dropdown, you have two options - 

**Is** - The condition evaluates as true. Use this to show the widget only when the custom field value matches your target.

**Not** - The condition evaluates as false. Use this to hide the widget when the custom field value matches, and show it to all other visitors.

4. In the last field, add the same field value that you have entered in the ACF field.

> *Note: You can add multiple values here this is ideal for Checkbox field.*

Depending on your choice in the third field (Is or Not), your content will be visible or hidden.

Following this process, you can set display conditions based on the values of other ACF selection fields.

## How to Set Elementor Display Condition Based on ACF Button Group? 

This option lets you set display conditions based on the values of ACF buttons.

Continuing our example, we have added a Profile section in the Additional Information with two buttons, Show and Hide. We have selected the Show button here.

![ACF button group for Elementor display conditions in The Plus Addons for Elementor](https://theplusaddons.com/wp-content/uploads/2023/06/acf-button-group.png)

Now to set the display condition based on the value of that button, from the Elementor editor, select the widget on the page. 

1. Choose **ACF : Button Group** from the first dropdown under the **Rule** tab.

2. Then in the second dropdown, add the field label.

3. Then in the third dropdown, you have two options - 

**Is** - The condition evaluates as true. Use this to show the widget only when the button value matches your target.

**Not** - The condition evaluates as false. Use this to hide the widget when the button value matches, and show it to all other visitors.

4. In the last field, add the button value.

> *Note: You can add multiple values as well.*

Depending on your choice in the third field (Is or Not) your content will be visible or hidden.

## How to Set Elementor Display Condition Based on ACF Boolean? 

This option lets you set display conditions based on the ACF boolean value. A boolean field can only have a True or False value.

Continuing our example above, we have added a boolean field named Paid to mark the status of the post.

![ACF boolean field for Elementor display condition in The Plus Addons for Elementor](https://theplusaddons.com/wp-content/uploads/2023/06/acf-boolean.png)

Now to set the display condition based on the boolean value, from the Elementor editor, select the widget on the page. 

1. Choose **ACF : Boolean** from the first dropdown under the **Rule** tab.

2. Then in the second dropdown, add the field label.

3. Then in the third dropdown, you have two options - 

**Is** - The condition evaluates as true. Use this when the boolean field is set to True and you want the widget to appear on the page.

**Not** - The condition evaluates as false. Use this when you want the widget to appear only when the boolean field is set to False.

4. In the last dropdown, select **True** or **False** as per your requirement.

Depending on your choice in the third field (Is or Not) your content will be visible or hidden.

## How to Set Elementor Display Condition Based on ACF Date / Time?

With this option, you can set display conditions on content based on a specific date and time using the ACF Date fields.

In our example, we have added a section called Date in the Additional Information and selected a specific date and time.  

![ACF date time field for Elementor display condition in The Plus Addons for Elementor](https://theplusaddons.com/wp-content/uploads/2023/06/acf-date-time-new.png)

Now to set a display condition based on that date value, from the Elementor editor, select the widget on the page 

1. Choose **ACF : Date / Time** from the first dropdown under the **Rule** tab.

2. Then in the second dropdown, add the field label.

3. Then in the third dropdown, you have two options - 

**Is** - The condition evaluates as true. Use this to show the widget when the date field matches your target date.

**Not** - The condition evaluates as false. Use this to hide the widget when the date matches, and show it on all other dates.

4. In the **Before Date** field, choose an earlier date and time from what you have set in the ACF field.

> *Note: Depending on the ACF settings you can work with date only as well.*

## How to Set Elementor Display Condition Based on ACF Post? 

With this option, you can set display conditions on the content of different posts, pages, or custom post types (depending on ACF settings) based on the ACF post, such as Post Object and Relationship.

> *Note: Depending on the ACF settings, the display conditions should be applied to the content in the relevant template or common templates like Header, Footer, Sidebar etc.* 

In the example, we have added a section called Post Name in the Additional Information and added a post named Elementor.

Now to set the display condition based on the post value, from the Elementor editor, select the widget on the page. 

1. Choose **ACF : Post** from the first dropdown under the **Rule** tab.

2. Then in the second dropdown, add the field label.

3. Then in the third dropdown, you have two options - 

**Is** - The condition evaluates as true. Use this to show the widget only when the post field matches a specific post, page, or custom post type.

**Not** - The condition evaluates as false. Use this to hide the widget when the post field matches, and show it in all other cases.

4. In the last field, select the post, page, or custom post type name that you have added in the ACF field.

> *Note: You can add multiple post name.*

Depending on your choice in the third field (Is or Not), your content will be visible or hidden.

Following this process, you can set display conditions based on the values of other ACF post fields.

If you build post listing pages and want visitors to filter content by category on the same site, see [How to Add a Category Wise Filter in Blog Post in Elementor](https://theplusaddons.com/docs/add-category-wise-filter-in-blog-post-in-elementor/) for the category filter widget in The Plus Addons for Elementor.

## How to Set Elementor Display Condition Based on ACF Taxonomy? 

With this option, you can set display conditions based on different taxonomies like category, tag, and custom post type taxonomy using the ACF taxonomy field. 

> *Note: Depending on the ACF settings, the display conditions should be applied to the content in the relevant template or common templates like Header, Footer, Sidebar etc.* 

In the example, we have added a section called Category in the Additional Information and selected the Clothing post category.

![ACF taxonomy field for Elementor display condition in The Plus Addons for Elementor](https://theplusaddons.com/wp-content/uploads/2023/06/acf-taxonomy.png)

Now to set display condition based on the selected taxonomy, from the Elementor editor, select the widget on the page. 

1. Choose **ACF : Taxonomy** from the first dropdown under the **Rule** tab.

2. Then in the second dropdown, add the field label.

3. Then in the third dropdown, you have two options - 

**Is** - The condition evaluates as true. Use this to show the widget when the taxonomy term matches your target category or tag.

**Not** - The condition evaluates as false. Use this to hide the widget when the taxonomy term matches, and show it for all other terms.

4. In the last field, select the term name that you have added in the ACF field.

> *Note: You can add multiple terms.*

> *Note: If left blank, it will be applied to all terms.*

Depending on your choice in the third field (Is or Not), your content will be visible or hidden.

Also, read [How to Set Elementor Display Condition Based on Shortcode](https://theplusaddons.com/docs/set-elementor-display-condition-based-on-shortcode/).

## Supported Plugins and Field Types

| Plugin | Field types in the rule list |
| ------ | ---------------------------- |
| ACF | Text fields, Selection, Button Group, Boolean, Date / Time, Post, Taxonomy |
| ACF Extended | Image Selector |
| JetEngine | Text, Text Area, Switcher, Checkbox, Radio, Select, Number |
| Toolset | Text, Number, Radio, Checkbox, Select, Checkboxes |
| PODS | Text, Date, Number, Boolean |

> *Each group appears in the rule list only while that plugin is active. There is no separate Meta Box group in the current version.*

## Limitations

- **Fields are read from the page being viewed.** Put the element in the single template of the post type that carries the field.- **Pro only.** Display Condition is not in the free plugin.

## Troubleshooting

### My field type is not in the list

Only the types above are supported. Check the plugin is active and the field is one of these types.

## Frequently Asked Questions

**Q: Why isn’t my Elementor display condition showing on the page I’m editing?**
A: Display Condition only applies on the published page, not inside the Elementor editor, so the editor will still show everything. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH also keeps this extension off by default, so it has to be enabled under The Plus Addons > Extensions first. If the rule is tied to login status or private content, test it in a private window while logged out.

**Q: Which custom field plugins work with Elementor display conditions?**
A: The supported plugins listed on the page are ACF, ACF Extended, JetEngine, Toolset, and PODS. Each one exposes different field types in the rule list, such as ACF text fields, JetEngine switcher and checkbox fields, Toolset radio and select fields, and PODS boolean fields. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH only shows a plugin group when that plugin is active.

**Q: What’s the safest way to hide private content with ACF display conditions?**
A: Turn off Keep HTML when the content is private. With Keep HTML on, the element is still sent to the browser and only hidden with CSS, which means its content can still appear in page source. That matters for members-only details or prices for logged-in customers. The Plus Addons for Elementor gives you this control inside the Display Condition extension so private data is not exposed unnecessarily.

**Q: Can I set display conditions based on ACF date and time values?**
A: ACF Date / Time is supported, and the rule compares your field against a chosen date and time. The key detail is the Before Date field: it uses an earlier date and time than what you set in ACF. That makes it useful for time-based visibility where timing matters more than a simple true or false check. Depending on your ACF settings, date only can also work.

**Q: How do I decide between Is and Not when setting a custom field condition?**
A: Use Is when you want the widget to appear only when the field matches your target value. Use Not when you want the widget hidden for that match and shown everywhere else. That choice matters because it changes whether your rule behaves like an allow list or a block list. In The Plus Addons for Elementor Display Condition rules, this pattern appears across text fields, selection fields, button groups, boolean fields, posts, and taxonomies.

**Q: What should I do if my custom field type isn’t supported?**
A: the rule will not appear. In that case you need to use one of the supported types or switch to a supported plugin group inside The Plus Addons for Elementor.