You can display Tabs or Accordions on your website in 3 ways.
- Menu item/component view
- Module
- Right from the article with included plugin button.
Navigate to a menu where you want to create a link and select DJ-Tabs as menu item type.
Set:
- Select group – select group of tabs to display
- Select theme – Select theme to use
- Select layout – choose if you want to u tabs or accordion layout
And save settings.
Tabs in a module
Another way to show a content of DJ-Tabs is by using DJ-Tabs module.
The module displays content of a group created by DJ-Tabs component.
Create new DJ-Tabs module or edit existing one and set:
- Select group – select group of tabs to show
- Select theme – Select theme to use
- Select layout – choose if you want to display tabs or accordion layout
Tabs/Accordion Options
- Module Class Suffix – A suffix to be applied to the CSS class of the module. This allows for individual module styling
- Video Automatic Play/Pause – Select whether to play/pause video automatically after switching to/from a tab with video
- Accordion Layout Display – Select to display accordion layout initially
- Tabs Hidden – Hide all the tabs, leaving the content of the firs tab only
- Rows Number – Tabs will be shown in the specified number of rows. Leave blank to use global
Save settings.
Add tabs or accordion to an article with a dedicated button
The last way to show tabs or accordion is placing it in the article using 'DJ-Tabs' button in article editor.
First, you need to make sure that you have enabled the plugin. To do so go to Extensions -> Plugins and search for DJ-Tabs Editor Button and make sure it's enabled.
Once this plugin is activated, you'll see the new button under (or in) your favorite editor in Joomla.
When clicked this button will reveal the box where you can choose:
- the group that will be displayed (so your category of tabs or accordion)
- the theme that will be used (you can use any theme you want)
- layout - select tabs or accordion
Click Insert and tabs or accordion will be put in place you had your cursor when clicking the button.