The new Tabs & Accordions extension for Joomla 4, is not a direct conversion of Tabs and Sliders from Joomla 3. It is a completely new extension built from the ground up.
You can still use the main {tab} syntax to create tab sets. But many of the extra attributes are different or work differently.
Also, the HTML output is completely different than Tabs and Sliders for Joomla 3. So any CSS stylesheets/overrides for Tabs/Sliders will not work on 'Tabs & Accordions' for Joomla 4.
How to Upgrade Tabs / Sliders from Joomla 3 to Joomla 4
As mentioned, Tabs & Accordions is a new extension, that is not a direct upgrade of their Joomla 3 predecessors.
So the process to upgrade Tabs / Sliders to Tabs & Accordions is different compared to the standard Regular Labs Extensions:
- Upgrade your Joomla 3.10 site to Joomla 4
- Uninstall the old versions of Tabs and/or Sliders if you have them installed
- Install the latest version of Tabs & Accordions for Joomla 4
- Tweak the Plugin Settings of Tabs & Accordions to your liking.
- Review your usage of Tabs and/or Sliders across the site and change your syntax to the newest syntax if needed
Here is an overview of the major changes in syntax between Tabs and Sliders for Joomla 3 and Tabs & Accordions for Joomla 4:
| Tabs / Sliders J3 | Tabs & Accordions J4 |
|---|---|
{slider ...} ... {slider ...} ... {/sliders} | {accordion ...} ... {accordion ...} ... {/accordions} |
class="green" | color="green" |
class="icon" | icons="true" (on first tab/accordion) |
class="color_content" | color-panels="true" |
If you want to use the same basic styling as the Tabs/Sliders use on Joomla 3, set the theme of Tabs & Accordions to "Accent Lines".
Bulk replacing syntax
If you need to change certain things in your tags to get things to work how you want, you can use DB Replacer to replace things in a few clicks.
For instance, you can bulk replace {slider with {accordion.