Help CenterTabs
14 Mar 2018 in: ShortcodesBasic Tabs
Tabs are connecting using paths specified in the data-tab attribute. Tab is then initialized in Javascript on the activating elements.
To avoid creating a distraction, when starting a new design project, we always go back to one of the old mainstays: lorem ipsum or li Europan lingues.
In addition to the well-known paragraph-length placeholder texts Lorem Ipsum, and Li Europan Lingues, there are several other filler texts.
The twelve most common letters in the English language are another popular choice when a designer just needs a meaningless phrase to test our typography and layout.
<ul class="wojo tabs">
<li class="active"><a data-tab="#popular">Popular </a></li>
<li><a data-tab="#archive">Active </a></li>
<li><a data-tab="#comments">Comments </a></li>
</ul><div class="wojo basic tab item segment active" id="popular">
<p>To avoid creating a distraction... </p>
</div>
<div class="wojo basic tab item segment" id="archive">
<p>In addition to the well-known... </p>
</div>
<div class="wojo basic tab item segment" id="comments">
<p>The twelve most common letters... </p>
</div>