Getting Started
JReviews ships with a ready-to-use listing detail template that can show custom fields, media, reviews and related listings in tabs. The template is a suffixed version of the listings/detail.thtml
template named listings/detail_tabs.thtml
.
Read more about using theme suffixes
To use the tabs template, add the _tabs
theme suffix in Configuration → Category Layout Manager
to each category where you want to have the tabs.
Field Group Tabs
To show each custom field group in its own tab, you can use the template_listings.detail_tabs:split-field-groups filter hook.
Tabs From Scratch
If you want to create your own tabbed layout, you can also do it from scratch. The code below can be used as a starting point for adding your own tabs.
<div class="jr-tabs jrTabs">
<ul>
<li><a href="#tab1">Tab 1</a></li>
<li><a href="#tab2">Tab 2</a></li>
<li><a href="#tab3">Tab 3</a></li>
</ul>
<div id="tab1">
This is tab 1 text
</div>
<div id="tab2">
This is tab 2 text
</div>
<div id="tab3">
This is tab 3 text
</div>
</div>
The href values in the list elements (tab1
, tab2
, ...) representing the tabs, must match id attributes of the div elements that hold the corresponding tab content.