Subscribe On YouTube

Join other subscribers and enjoy other Divi video tutorials!

How To Conditionally Show Or Hide Divi Modules Based On Custom Field Values

Nelson Miller Profile Orange
In this tutorial I will show you how to use an exciting new Divi feature to conditionally show or hide modules based on custom field values!

Secret New Feature!

I recently introduced you to the Divi Display Conditions feature. And while we knew it was great, it was missing a seemingly #1 feature – settings for custom fields. As I watch the Divi changelog closely, I noticed something new appeared in version 4.14.3. I did all the work exploring it for you and am happy to report that this feature is what I was waiting for! In this tutorial, I will introduce it to you and show you how to use this new Divi Display Conditions feature to conditionally hide and how modules based on custom field values!

▶️ Please watch the video above to get all the exciting details! 👆

Enable Custom Fields In Divi

The first step before we can begin using this exciting new feature in Divi is to enable custom fields. Perhaps you already have custom fields set up, that is great! You can skip ahead. I do not want this particular tutorial to become a lesson on using custom fields. If you want a dedicated tutorial on that, you can let me know in the comments. In this tutorial, I’ll quickly explain two types of custom fields.

Built-In Custom Fields

WordPress comes with built-in custom fields by default. However, these are disabled by default, so you may not even know about them! They are also a bit limited in comparison to some plugins like ACF, but they certain work great for basic needs. You can enable these in four basic steps from any page or post.

  1. In the top right corner, click the three dots menu.
  2. Click on “Preferences” at the bottom of the panel.
  3. A popup will appear. Click on “Panels” in the tabs on the left.
  4. Enable the toggle for “Custom Fields.”
how to enable custom fields in Divi

Awesome! Now the custom fields panel will appear below the content editor area on the page like this:

custom fields panel on a Divi page or post

Note that turning this setting on once on any page will enable it on all pages and posts across your site, which is great.

Custom Fields Plugin

If you need a more robust system of custom fields, you will need to install a custom field plugin. Some popular ones include Advanced Custom Fields, Pods, Meta Box, and many more. In my video accompanying this tutorial I show you some examples using ACF, but it really doesn’t matter what method you use. 

popular custom field plugins for Divi

Exploring The New Custom Field Display Conditions In Divi

As I mentioned, the Divi 4.14.3 update brought several new Display Condition features (I also have a feeling more are coming). One of those caught my eye, the one called Custom Field. Why? Because it’s the #1 feature that we all expected in the Display Conditions, and was oddly missing. So it’s a big deal!

The new Custom Field option is easy to locate as soon as you click to add a new condition. In any section, row, or module, click on the Advanced tab and open the Conditions toggle. Next, click the plus icon to “Add Condition.”

add new Divi Display Condition

A new panel will appear with lots of choices.

For this tutorial, select the “Custom Field” option.

choosing custom field from the Divi Display Conditions

Now, you will see a panel appear to help you narrow down your selection of the specific custom field and its value that you want to use.

1. Select Custom Field Name

The first dropdown defaults to “Manual Custom Field Name.” Below it, you’ll find an input field where you can enter the name of the custom field. What you do here depends on whether you’re using the default WordPress custom fields or a plugin like Advanced Custom Fields (ACF).

  • Using default WordPress custom fields: I recommend selecting the custom field name from the dropdown. This way, you won’t need to type it manually, and you can ensure it’s selected correctly.
  • Using Advanced Custom Fields (or other plugins): You’ll need to get the exact field name from ACF and type or paste it into the input field. You can go to your custom fields and copy the ID or name there and paste it into this field.

The options that appear in the dropdown will vary based on the custom fields you have set up. After selecting the field, you can move on to choosing the condition.

Divi Display Conditions custom field display only if settings

2. Select Condition

The condition dropdown defaults to “Is,” but you can change this to fit your specific needs. Here are the available options:

  • Is: Matches the exact value.
  • Is Not: Does not match the exact value.
  • Contains: Includes the specified value within the field.
  • Does Not Contain: Does not include the specified value within the field.
  • Is Any Value: The field has any value (useful for checking if a field is not empty).
  • Has No Value: The field is empty.
  • Is Greater Than: The field value is greater than the specified value (useful for numeric fields).
  • Is Less Than: The field value is less than the specified value (useful for numeric fields).

Choose the condition that best matches your requirements, and then proceed with setting the value to complete the setup.

Divi Display Conditions custom field options

A very common use case is selecting “Is Any Value” which is one I use personally all the time. I explain this further in the video, but here’s a brief overview:

For example, if you have a Button module with its URL linked to a custom field with dynamic content, you might only want the button to display if there is an actual link present within the custom field. In this case, you would select “Is Any Value.” This means the button will only be shown if there is a link available to click, and it will not show if no link is added in the custom field.

NOTE: When you choose “Is Any Value,” the last dropdown for selecting the specific value is not needed because you are only checking for the presence or absence of any value in the custom field.

Divi Display Conditions custom field option has any value

3. Select Custom Field Value

Depending on the condition you chose in Step 2, this option may not appear, allowing you to skip this step.

If the “Select Custom Field Value” option does appear, you must specify the value you want to compare against. This section is similar to the custom field name setup, featuring a default option labeled “Manual Custom Field Value” and an input field.

Unlike the custom field name, I recommend using the input field to manually enter the value you’re checking for, which ensures you have precise control over the value used in the condition.

Optional: Using ACF Grouped Fields

If you’re using Advanced Custom Fields (ACF) with grouped fields, like with gallery images in our Divi Dynamic Helper plugin, there is an additional consideration to keep in mind.

When working with a parent group field and its child fields, you may encounter issues if you try to add either the parent or child field names directly in the Divi Conditions. However, there’s a workaround: you need to combine the parent field name with the child field name.

For example, if your parent group field is named gallery_image_group and the first image field within this group is named gallery_image_1, you should combine these names with an underscore in between. In this case, you would use gallery_image_group_gallery_image_1 as the custom field name in the Divi Conditions.

This combined field name should work correctly with the Divi Conditions as outlined in our tutorial.

Conclusion & Use Cases

There’s not much else to say, other than to go play around with this for yourself! I’m sure you will find even more ways to use than what I in the video. Be sure to watch that for several real-world use cases on our new family website: Miller Family Adventure.

Tell Us A Creative Use Case!

Let me know in the comments what use cases you are building with this new feature! I know there are a lot of creative ideas out there!

Subscribe For More Things Like This!

At the start of each month, we send out a recap newsletter from the month before with family news, Divi news, our latest tutorials, and product news. Occasionally, if the news is too exciting to wait, we will send out another email separate from the monthly newsletter. That’s what you get when you subscribe, and of course you can unsubscribe if you are no longer interested!

Blog Post Optin
Divi Logo (2)

Shop Our Divi Products

Plugins • Courses • Templates

Visit The Shop

Featured Products

Asset 4

New! Trail Guides

Follow a series of blog posts carefully arranged around a specific topic or goal! Keep track of your progress by marking posts completed, just like a free course!

View Trial Guides

Divi Tutorials On YouTube

Our videos have views! Join subscribers and enjoy over video tutorials!

Visit Our Channel

Leave A Response!

By commenting you agree to our Blog & YouTube Comments Policy

42 Comments

Comments By Members

These comments are highlighted because they were posted by fans who have a membership on this site.

  1. Mark Hancock <span class="comment-author-role-label"><a href="https://www.peeayecreative.com/product/divi-adventure-club/" class="comment-author-role-link" rel="external nofollow" target="_blank">Divi Adventure Club Member</a></span>

    I know it is not built in but could there be a way to display a module, row, section….depending what they have as a CSS id? I have two forms on 1 page but I only want displayed what they select from a menu ie…. #esp. Thanks! Mark

    Reply
    • Nelson Lee Miller (aka The Divi Teacher) <span class="comment-author-role-label author-label">Author</span>

      Sure you could do this as imply as just #idname {display: none;} and when that ID is added then it does not display the element on the frontend. You could also use a class.

      Reply
  2. Dorthe <span class="comment-author-role-label"><a href="https://www.peeayecreative.com/product/divi-adventure-club/" class="comment-author-role-link" rel="external nofollow" target="_blank">Divi Adventure Club Member</a></span>

    Hi Nelson
    Thank you so much for this tutorial and all the others. I really like your work!

    I’ve noticed the Gallery on your Adventure page. Would you mind to give me a hint on how that is set up as a gallery from the images uploaded in the custom fields. Did you use a plugin to make the gallery or is it coded or even set up the the conditions function? Hope my question makes sense 🙂

    Reply
    • Hemant Gaba <span class="comment-author-role-label"><a href="https://www.peeayecreative.com/product/divi-adventure-club/" class="comment-author-role-link" rel="external nofollow" target="_blank">Divi Adventure Club Member</a></span>

      Hey Dorthe,

      The gallery is Custom Created using PHP and Advanced Custom Field plugin. If you want to achieve that so here is a hint:
      First, inside the field group that you have created using the ACF plugin, create a field of type group and under that add the subfields with type image. If you want to show 10 images, add 10 subfields and set the output as an array of the group field.

      After that, you need to create a code to loop through that array to display the images, and this code you need to add under the function that will create it a shortcode and that shortcode you need to place inside the code module and you will have your images.

      Reply
      • Gregory

        Please make a tutorial, for all. I understand the Idea, but not to do.
        Thanks.

Comments By Others

  1. Rodney Kesselring

    I have been just digging in to Custom fields and I love them! Thanks for the tutorial.

    Problem. When I go to do conditional display in a layout i do not see any of the ACF fields. on the list of standard WP ones. is this perhaps a bug? BTW if i look up and use the manual value it works fine but the divi interface will not show them to be selected.

    Thanks

    Reply
  2. Patrick

    I’m not understanding how to get the custom field to recognize that the ACF custom field I’m asking it to validate the field data on. What is the proper field name? Is it was is shown in an INSPECTOR focus in a browser, cause that field name is completely different than what I named the field in the ACF module. I’ve tried both and it does nothing to recognize the custom field. I’m simply asking it to NOT SHOW a TEXT MODULE if the custom field says N/A as it’s data. It doesn’t do it.

    I don’t have any WP custom fields in use and this wouldn’t help if I can only use the WP custom field. Your comment about it working on a custom plugin like ACF has me puzzled on the proper syntax to make it work. Please help.

    Reply
  3. YoDocus

    Hi there.. bit stuck here:
    1. I don’t see the 3 dots at the right top to enable Custom Fields. So what do I do instead to make sure it’s enabled?
    2. I tried to nonetheless add a group (yup.. you have groups now.. didn’t see that in your post) and added a text field in there that’s empty. Then I want to change the visibility of a button and make it depending on the value of the text field. When I open up the condition, my new custom text field didn’t show up in there. What am I missing??

    Thanks!

    Reply
  4. Steffen

    Damn, thank you so much for this article!

    I’m really advanced with Divi and ACF but did not find this solution for weeks. And the simple reason was that I’m using Divi in German and the translation of this part of the module is so kind of wrong that I wasn’t able to guess the original meaning.

    Reply
  5. Rick Elrod

    I formatted a divi builder layout for blog posts to only show restaurant specials if a photo had been added into the custom field since some weeks there is only one special and some weeks there are up to three. Now I want to create a specials page that only shows this weeks specials (just the most recent blog post) but I’m having trouble figuring out how to get it to show the post content from the custom fields especially with them formatted how I set it up on the “All Posts” layout on the divi builder. Would love to hear if you have any suggestions on how to accomplish this.

    Reply
  6. Roel

    Hi Nelson, awesome article. I would like to hide an email optin module based on the language that is selected.
    I am using translatepress. They have this code: [trp_language language=”en_US”] This will only be shown when language is en-US [/trp_language].
    Could you advise on how to use this shortcake with the custom fields?

    Thanks!

    Reply
  7. Bill

    Hi Nelson! I added custom fields through the ACF plugin which add social link fields in user profiles.

    I use dynamic URL links in the Social Media Follow Module. This works to display any author’s social media links/icons. However, all icons will display whether or not they have a value. I tried adding the condition: Manual Custom Field Name (Twitter) Is Any Value. That prevents the twitter icon from displaying whether or not it has a value in their user profile. Any ideas?

    Reply
    • Nelson Lee Miller (aka The Divi Teacher) <span class="comment-author-role-label author-label">Author</span>

      I think this issue is because in Divi the conditions are not working for individual items, I noticed this in tabs also. Please report this to Elegant Themes and hopefully they will update it.

      Reply
  8. Patricia

    Hello Nelson, and thank you for sharing all these pecious tutorials !

    Is there a way to hide a WooCommerce “Add to cart button” on an online course page, when a user is already enrolled in this specific course (and of course logged in) ?
    I don’t find the way.
    Thank you if you know.

    Reply
  9. Lou Ann

    I have a product with a Buy button. I’d like to change button to Sold for everyone once the client uses WP EasyPay to purchase the product. Is it possible to do this?

    Reply
  10. Chris

    Hey there, after reading this blog post I was excited to finally have this feature in Divi. But I tried a lot and wrote to the Divi support tree times and finally got a clear answer:

    “It is not feasible to do so using any of the available custom field plugins.
    This blog was not created by the Divi theme; rather, it was authored by an independent author. [I mentioned your article and that you annaunced this feature as running]
    In such case, you may choose to get in touch with the blog’s author for any further information.”

    Now I am wondering, if your article leads into a deadend and it would be good to take it offline until the feature really is implemented?

    Best wishes, Chris

    Reply
  11. joan

    Hello, thank you, it helped me a lot.
    but I have a query, how can I do it when my custom field is a group? how to get to put the value of sub item of the group.

    Reply
    • Hemant Gaba <span class="comment-author-role-label"><a href="https://www.peeayecreative.com/product/divi-adventure-club/" class="comment-author-role-link" rel="external nofollow" target="_blank">Divi Adventure Club Member</a></span>

      Hey Joan,

      We will definitely look into the query and get back to you as soon as we find a ideal solution.

      Reply
  12. Pinco Pallino

    First of all, thanks for the detailed post: it exactly cover what Divi doesn’t say much about.
    My question is: does it still work as you described in the post (and the video)?
    I do use ACF to add some extra fields to WordPress user profiles so that I can build a nice author page with Divi theme builder. I’m trying to use the condition based on an ACF field to display a Divi module or row in the page, but it just doesn’t work like your video. Using a condition on a “Manual Custom Field Name”, entering the field name from ACF and using the condition “Is Any Value” just display everything all the time, even when the field is empty (really empty).

    I’m trying to find out if it’s a different behavior because I’m in the author’s page or if something changed in a later release of Divi (I’m on latest version for both Divi and ACF).

    Thanks a lot for all the content you publish!

    Reply
    • Pinco Pallino

      As often, a possible answer comes to mind after posting: the “Manual Custom Field Name” option is connected to the “Post” type of content, therefore I suspect it does work, but only on “Post” type of content, not on WordPress users for which such kind of option doesn’t exist in Divi conditions.

      Reply
  13. Fortespy

    let’s assume i have a row with 3 columns, the first column is a sidebar with links.when a link is clicked, i want the content of that link to display in the second column. is it possible using Divi display conditions

    Reply
    • Hemant Gaba <span class="comment-author-role-label"><a href="https://www.peeayecreative.com/product/divi-adventure-club/" class="comment-author-role-link" rel="external nofollow" target="_blank">Divi Adventure Club Member</a></span>

      Hey there,

      I don’t think we can achieve the functionality using the conditions option. To achieve this the Custom Code is required.

      Reply
  14. Cathie Heart

    Finally a conditions field so that ACF can link and hide an entire module, row or section! I’ve been waiting for this and was searching, searching and found your article. Somehow I didn’t put ‘conditional’ with the fact of linking it to custom fields when I saw this new bit show up on the divi interfaces!!

    Now I can do so SO much more.

    Reply
  15. Ray Gulick

    This does seem pretty powerful, but I can’t figure out how to make custom post type ‘Events’ drop off the list when they are ‘past events’. I’m a fairly experienced developer, but new to Divi.

    I have a custom field, ‘event_enddate’ (Ymd), which I need to compare to ‘today’s date’. With what you’ve explained here I see how to make ‘event_enddate’ part of the equation, but there does not seem to be a way to add today’s date to compare it to: event_enddate is more than today’s date.

    Reply
      • Mark S

        Nelson, Great tutorial. Is there a way to make page content load depending on button click / link value? For instance, click button A and show A content, click B and see B content? I can’t seem to figure this out. Is like a visitor path determines the content without going to a separate page. Thanks.

      • Ray Gulick

        So, is your recommendation that I create a listing template with a custom WP_query, and not use Divi on that page?

        Which, of course, means I’d need to duplicate the header and footer outside of Divi for that page as well?

      • Nelson Lee Miller (aka The Divi Teacher) <span class="comment-author-role-label author-label">Author</span>

        I don’t really have a recommendation, as I don’t have experience with what you are trying to do comparing the dates. You would need to write some jQuery instead of using the Divi Conditions.

Submit a Comment

Your email address will not be published. Required fields are marked *

Recent Posts

0

Your Cart