Troubleshooting
If you are facing a technical issue with the Divi Tabs Maker, please check the troubleshooting steps listed below. If the outcome of following the steps below points to an issue with our plugin specifically, please send us a support message. When you reach out for support, we will ask about the results of these troubleshooting steps to better understand and resolve the issue.
👉 General Troubleshooting Steps
Step 1: Deactivate All Plugins Except Divi Tabs Maker
When troubleshooting an issue with our plugin, it’s essential to determine whether there is a conflict with another plugin. To do this, please deactivate all other plugins on your site, leaving only the Divi Tabs Maker active. If deactivating the other plugins resolves the issue, it indicates a conflict with one of them.
To identify which plugin is causing the conflict, start by reactivating each plugin one at a time. After reactivating each plugin, refresh the page to check if the issue still happens. Continue this process until you find the plugin that triggers the problem.
Once you’ve identified the conflicting plugin, please let us know the details so we can provide further assistance.
If the issue is still happening with only our plugin active, it suggests the problem may not be related to a conflict and will require further investigation.
Step 2: Deactivate Our Divi Tabs Maker Plugin
Please temporarily deactivate the Divi Tabs Maker to confirm whether our plugin is causing the issue. While this may seem counterintuitive, it is an important step to verify if the problem is related to our plugin.
If the issue persists after deactivating our plugin, it suggests that our plugin is not the cause. Conversely, if the problem only occurs when our plugin is active, it indicates that our plugin might be involved and will require further investigation.
🔧 Common Issues
Below is a list of common issues you may encounter when using this plugin. Please review the solutions or explanations provided for any issues that are relevant to your situation.
Something Not Working Within Tab Content
If you are facing issues when integrating JavaScript elements like carousels or customized blogs inside our Divi Tabs Maker, there’s a good chance of compatibility issues. This is because both the tabs and these elements rely on JavaScript functionality.
Before contacting our support team, please test your exact setup with the default Divi Tabs module. This step will allow you to compare the result and pinpoint whether any issues are related to our plugin or simply not possible.
If something is working in the default Divi Tabs module that is not working in our Divi Tabs Maker module, certainly reach out to us and we will investigate.
Sticky Is Not Working
Several issues might be causing this problem. One common issue is related to Divi performance settings. To test this, go to Divi>Theme Options>Performance and try turning off some items, starting with Dynamic JavaScript Libraries.
Another thing to try is adding sticky to a regular Divi module. Sometimes 3rd party modules can be finicky. By setting sticky on a regular Divi module on the same page, it forces the required Dynamic JavaScript Library to load, which can benefit our module as well.
Please try these steps and let use know if they do not help.
Dynamic Tab Content Messed Up
In some cases, when you are adding Divi Library layouts to the tab content via our dynamic content feature, Divi may not display things correctly in the Visual Builder. However, it should look normal as expected on the frontend. If there is something not displaying correctly on the frontend, just let us know!
Deeplinking Not Working On Same Page
The Divi Tabs Maker plugin includes a deeplinking feature, allowing you to link to a tab from another page and make it active when the page loads. However, deeplinking does not work when trying to open a tab from a link or button on the same page. To achieve this, you need to use custom code.
Steps to Set Up a Button to Open a Specific Tab
Follow these instructions to make a button (or any clickable element) on the same page open a specific tab.
Step 1: Add Custom jQuery Code
Use the following jQuery snippet:
This code tells the button (or any element with the #moduleIdHere) to simulate a click on the specific tab you want to open (#tabIdHere).
Step 2: Add jQuery Code to Divi
For detailed instructions on how to add custom code in Divi, follow this tutorial.
Step 3: Assign an ID to the Button Module
- Open the Divi Button module.
- Go to the Advanced tab.
- Under the CSS ID & Classes toggle, add a CSS ID to the CSS ID field (for example,
my-button). - Replace
#moduleIdHerein the code snippet with the ID you assigned (e.g.,#my-button).
Step 4: Find the Tab ID
- Open your browser’s Developer Tools (right-click and select “Inspect”).
- Navigate to the tab you want to target.
- Look for the
id=" "attribute in the code and copy the tab ID. It will look something like:pac_dtm_tab_control_pac_dtm_child_1.
Step 5: Set the Button to Open the Tab
- Open the Button module.
- In the Link toggle, add the tab ID (e.g.,
#pac_dtm_tab_control_pac_dtm_child_1) to the Button Link URL field.
Now, when you click the button, it will automatically open the specific tab on the same page!
FAQs
If you have questions that are not addressed in our documentation, please review the frequently asked questions listed below. We regularly update this section based on common queries from our customers. If you don’t find the answer you’re looking for here or in our other documentation, feel free to contact us for support, and we’ll be happy to assist you.
How does this plugin work?
The plugin adds a new custom Divi module into the existing Divi Visual Builder. Simply go to your Divi Builder layout, click the gray plus (+) icon to add a new module, and select “Divi Tabs Maker” to get started. Please check our full plugin documentation for more information about all the features.
Can I use Divi library layouts as the tab content?
Yes! This is a major feature of the module. You can easily add any Divi section, row, or module from the Divi Library to your tab content area by simply clicking the dynamic icon button in the content area. This allows you to create nested tabs by adding other modules, rows, or sections within the main tabs.
How can I add columns within a tab?
You can add any text or images within the tab content area like normal, or you can use our incredible Divi Library feature to add Divi Library layouts to the tab content. So to make content with multiple columns, you would simply create the row or section as you want it and save it to the Divi Library, then add to the tab content area via our dynamic content feature.
Is it possible to nest tab modules within tabs?
In general, it’s possible to add Divi Library layouts inside tabs, but with this specific scenario it is not working with the current structure of Divi. There seems to be an issue with how Divi handles tabs.
You’ll see some odd behavior with or without our plugin if you try to nest a tab module within a tab module. If you use the default Divi tabs module and create a few tabs, save to the Divi Library, use a shortcode (with a free plugin like Simple Divi Shortcode), then add this saved layout in the content of the default Divi tabs module, you will see the title of the last tab from the saved layout will replace the title of the first tab.
We found one way it could work. With both default tabs or both Tabs Maker, it will not work, but if one of each is used, it works:
- If the tabs in the saved layout are created using our Divi Tabs Maker plugin and a default Divi tabs module is added into the content via shortcode, then it’ll work perfectly fine.
- If the tabs in the saved layout are created using the default Divi tabs module, and the Divi Tabs Maker tabs are added into the content via dynamic content, then it’ll work perfectly fine.
Can I translate the next and previous navigation buttons?
Currently, we have not added that feature, but you can easily change the text of the navigation buttons with the following jQuery snippet which can be copied and pasted into the Divi>Theme Options>Integration area:
<script>
jQuery(document).ready(function(){
setInterval(function(){
jQuery(“.pac_dtm-controls-single.pac_dtm-prev”).html(“Previous Text”);
jQuery(“.pac_dtm-controls-single.pac_dtm-next”).html(“Next Text”);
}, 100);
});
</script>