Saturday 12 December 2015

How to Create Tabs without Third Party Extensions for a Joomla Article

Joomla comes with native tabs support for single articles. The plugin that render this feature is the same that split an article into several pages.
In this tutorial we will show you how to add tabs in your articles with the Page break plugin.

The article

  • Go to Content > Articles > New
  • Add some content, in my example I’m using dummy text.
joomla page break plugin tabs
  • Put the mouse cursor at the beginning of the first paragraph, which later will be displayed as a tab.
  • Click Page break
joomla page break plugin tabs
  • Set a Page title
  • Add an Alias, such as some-text-with-no-spaces (optional)
  • Insert page break
joomla page break plugin tabs
Repeat the process to create a new tab. Put the mouse cursor in the end of the first set of content. For example: the second paragraph.
  • Set a title for the article
  • Save and close

The Page Break plugin

  • Go to Extensions > Plugins
  • Search “Content - Page Break”
joomla page break plugin tabs
  • Set Presentation Style as “tabs”
  • Be sure the plugin’s status is enabled
  • Save and close
joomla page break plugin tabs

The menu item

We need a link to display the article in frontend.
  • Create a menu item through Menus > Your menu > Add new menu item
  • Menu item type: Articles > Single article
  • Choose the article
  • Set a Title
  • Save and close
joomla page break plugin tabs

End result

Preview the article with tabs from the new menu item in your public site:
joomla page break plugin tabs
 

No comments:

Post a Comment