Divi Show / Hide Button Module
Antivirus scan
Powered by ClamAV
✅ Verified clean
This product file has passed our security filters.
Want to run a fresh ClamAV scan right now? Takes a few seconds and shows scanner version, signature DB and live result.
This can take 5 to 30 seconds.
Clean file Threat detected
No threats detected in this file.
- File
- Size
- Scanned
- ClamAV
- Signature database
⚡ Powered by ClamAV
Scan could not be completed
Report product
If you detected an issue (broken file, malware, inappropriate content, etc.) let us know and we'll review it ASAP.
Sign in to report
About Divi Show / Hide Button Module
A show and hide button depends on the names you give your content
One day you tidy your page CSS and rename a class. The section is still there and looks the same, but the button that used to open it now looks for something that does not exist under that name.
The Show / Hide Button module does not point at a section, it points at a CSS ID or class; the button and its content are tied together by a name you type, and any change to that name pulls them apart.
Divi Show Hide Button adds a new module to the Divi Builder. Instead of linking to another page, it controls the visibility of elements on the current page: it reveals hidden content, hides visible content or toggles between both each time it is clicked. It works on sections, rows and modules, and you do not need to write code.
What each button can do
- Show these elements: reveals content that starts hidden.
- Hide these elements: hides content that starts visible.
- Toggle these elements: shows and hides it on each click.
- Several targets: in the target field you can enter several IDs, classes or complex CSS selectors, separated by commas.
- Self-hiding button: the button itself can disappear when clicked.
- Style: it is designed like a normal Divi button.
- Tabs: several buttons grouped together form tabs.
Each of those options sits in the button settings, in the section for what happens when it is clicked. On a single page you can place several buttons with different actions and texts.
A multi-step form made with rows
One possible combination, which you should test on your page before publishing it: a form split into two rows, each with its own CSS class. A “Next” button hides the first and shows the second, and a “Back” button does the opposite. The module also builds button-controlled tabs and swapped elements.
The same principle works for a long block of text that starts closed, or for two versions of a content between which the visitor chooses. Each case is set up the same way: you mark the elements with a class and type that class into the button.
Limitations of the module
- The elements it controls must have a CSS ID or class.
- If you rename the class or the ID, the button must be updated too.
- Buttons control the visibility of elements on the current page.
- It is a Divi Builder module: you use it wherever you can add Divi modules.
First steps with the button
- Install the plugin and open a page with the Divi Builder.
- Give the section, row or module you want to control a CSS ID or class in its advanced settings.
- Add the Show / Hide Button module and design the button like any Divi button.
- In the button settings, open “When Button Clicked…” and choose show, hide or toggle.
- Type the ID or class of the elements in the field, separated by commas if there are several.
- Test the button on the published page.
Alternatives for showing and hiding content
If you prefer a ready-made accordion or toggle module, look at Divi Advanced Content Toggle Module.
If you are looking for a package of modules with more pieces for Divi, there are Divi Booster, from the same vendor, and Divi Plus.
Answers about Show / Hide Button
Can I control more than one element with a button?
Yes. You can enter several IDs, classes or complex selectors separated by commas.
Can the button hide itself when clicked?
Yes, it is an option of the module.
Can it be used to make tabs?
Yes, by grouping buttons that show and hide content.
Do I need to write code?
Not for the button; you only need to give an ID or a class to the elements it will control.
Topics
Version history
-
v
2.0 Current 26 Oct 2026
-
v
1.6.0 8 Apr 2024
Customer reviews
Sign in to leave a review. Only people who have the product can review it.
No reviews for this product yet.
Frequently asked questions
-
GPL (General Public License) is the license under which WordPress and most premium plugins/themes are distributed. It grants you the right to use, modify and redistribute the software in as many projects as you want, with no domain restrictions.
-
Yes. With membership you get automatic updates via our GPLClub Updater plugin (installed on your WP, detects new versions and applies them). With individual purchase, you get one year of manual updates from your account.
-
Depends on the plan. Monthly: 3 domains. Semi-annual: 7. Annual and Lifetime: 15. Individual purchase: 1 domain.
-
GPLClub offers its own support for installation, configuration and compatibility. For direct support from the original author (feature requests, product-specific bugs), a license purchased from the author is required.
