Responsive Tabs - Supports Nested Tabs

TabMate 2 is a new RapidWeaver stack that lets you easily add tabs in your web pages.

With tabs, you can organize your content in a neat and accessible manner. When viewed on a mobile device, the tabs become an accordion so your content looks good on different devices.

If you want, you can nest tabs within tabs. The tabs can even be set to auto switch from one to another when the page loads.


  • Responsive, so it works and displays well on computers and mobile devices. On computers, the tabs are shown. On narrow mobile devices, the accordion is shown instead.
  • Easily nest tabs within tabs.
  • Directly link to a specific tab, so when your web page loads, the page is scrolled to the tab and the tab is open by default.
  • You can specify which tab is open by default.
  • The tabs can optionally be set to automatically switch from tab to tab. You can set the time interval between switching from one tab to another.
  • Easily customize the colors of the tabs and borders.

You can place all kinds of content in tabs like Text, Images, even YouTube videos, like:

  • Stacks 3
  • Rapidweaver 6 or 7.

Notes

  • - If you are embedding tabs within tabs, only the outermost tabs can be directly linked to and opened specifically when the page loads.
  • - Internal tabs can be collapsed when clicked, but not outermost tabs. This does not apply when the accordion is shown.

How To Link Directly To A Specific Tab

  1. Ensure that each tab has its own hashed URL by going to the setting the "Set Hash" option in TabMate's Options to "Yes".
  2. Publish the web page.
  3. Open your published web page using your web browser.
  4. Click the tab you want to link to, and then copy its URL in the web browser. This is the URL you use if you want to scroll to this tab and have it open by default.
  5. In any place that you want to link to the tab, use the URL you copied in #4.

Stacks . Images & Videos . Social . Lightboxes . Layout . Publishing . Utilities .
Bundles . Support .