New in Joomla 1.7: Tabs, sliders, and pages

You may already be familiar with the Page Break feature in Joomla, a feature which has been around for some time. Page Break takes a long article and breaks it into shorter, sub-articles. It generates an article index, so you can navigate to all of the pages within a single article. In Joomla 1.7, by default, the front end of the “Getting Started” article in the sample data might look like this, once you add some page breaks:

The right column shows the article index. This is a list of all sub-pages within this article.

New in 1.7, there are some additional configuration options for setting up page breaks. Go to Extensions – Plugin Manager – Content-Pagebreak, and take a look at the Basic Options on the right side of the screen.

  • Show Site Title includes some of the article information in the HTML page title. For page 1 of this article, the HTML page title is “Getting Started”. For page 2, however, the title is “What is a CMS? – Page 2″. (This is a default Joomla site with no changes made to the configuration, other than the page breaks added to the “Getting Started” article.) Setting “Show Site Title” to Hide means that the HTML page title is “Getting Started” for each page of content.
  • Article Index Heading applies to the Article Index, in the right column. Setting this to Hide will hide the title that says “Article Index” by default.
  • Custom Article Index Heading means that you can change the text of the “Article Index” heading to anything you want.
  • Table of Contents generates the list of links in the article, the Article Index, on the page. Setting this to Hide would eliminate that list of links.
  • Show All controls whether the link to show the full article without page breaks is available in the Article Index.

All of the above features are huge improvements to Joomla’s multi-page article feature. However, my absolute favorite new feature here is the Presentation Style. Previously, you had to display an article like this in the “pages” format. That generates a view similar to the one you see above.

There are now two additional presentation options. You can have sliders, shown below:

In this case, the article is broken into accordion panels. You click each title to bring up each block of text. This is a great format for a FAQ page.

The other option for display is tabs, shown below:

Here, you can click on each tab as you move across, showing the same blocks of text. This is a great format for a product information page, where you may want to break specifications into different tabs.

Styling for sliders and tabs must be included in the template you choose to use with these options. This styling is available in the Beez 2.0 template (the default template in 1.7). You may need to check with individual template manufacturers to make sure styling is available for this in their templates. While Joomla 1.6 templates generally work in Joomla 1.7, this feature is new in Joomla 1.7, and it requires styling to make it work correctly.

NOTE: When you make a change to the page break plugin, it affects ALL articles with page breaks on your site. In other words, all page break articles have tabs, or sliders, or pages. You can’t have one article with pages and another with tabs. The same is true for the other settings in the plugin.

{loadposition jenbio}

  • http://www.zignsire.com/ complete website package

    It generates an article index, so you can navigate to all of the pages within a single article. In Joomla 1.7, by default, the front end of the “Getting Started” article in the sample data might look like this.

  • http://ad-maven.com/index.html admaven and ad-maven

    there are some additional configuration options for setting up page breaks. Go to Extensions – Plugin Manager – Content-Pagebreak, and take a look at the Basic Options on the right side of the screen.

  • http://www.easylifeapp.com/ Easylifeapp

    This is “Styling for sliders and tabs must be included in the template you choose
    to use with these options. This styling is available in the Beez 2.0
    template (the default template in 1.7)” really helpful information for us. Thanks author.