How to add tabs to your store

Adding tabs is a great way to add detail without taking up too much space. Not all of our themes support tabs—Handy doesn't yet!—but most do. You can add tabs to any RTE (rich text editor) area. This includes:

  • Product descriptions
  • Collection descriptions
  • Custom pages
  • Blog posts

Find an RTE field in the admin area and press the “Show HTML” button. Paste in the following example and replace the text content (“Label X” and “Content for Label X”) with your own. The top set of elements are the tabs themselves, and the second set of elements are the content that corresponds to each tab.

 
<ul class="tabs">
	<li class="active">Tab 1</li>
	<li>Tab 2</li>
	<li>Tab 3</li>
</ul>

<ul class="tabs-content">
	<li class="active">
		<p>Tab 1 content goes here.</p>
	</li>
	<li>
		<p>Tab 2 content goes here.</p>
	</li>
	<li>
		<p>Tab 3 content goes here.</p>
	</li>
</ul>