Tabs Module

This module allows you to add multiple columns to your page, and users can switch between the content by clicking on the tabs.

Demo

Usage

To use the Tabs module, follow the format below in your markdown:

{% tabs 页面内不重复的ID %}
<!-- tab 栏目1名称 -->
内容
<!-- endtab -->
<!-- tab 栏目2名称 -->
内容
<!-- endtab -->
{% endtabs %}

In this format, unique ID within the page is the unique identifier you create for each tab, and you can choose any name for it.

To define the content for each column, use <!-- tab column name --> and <!-- endtab -->.

For example, in the above example:

{% tabs First unique name %}
<!-- tab First Tab-->
**This is Tab 1.**
<!-- endtab -->
 
<!-- tab Second Tab-->
**This is Tab 2.**
 
This is Tab 2.
<!-- endtab -->
 
<!-- tab Third Tab-->
**This is Tab 3.**
 
This is Tab 3.
 
This is Tab 3.
<!-- endtab -->
{% endtabs %}

Learn More

To experience it yourself, please visit the Redefine Demo Site (opens in a new tab)