タブインターフェースをショートコードで作成

Raindrops テーマ 0.930以降をお使いの場合、タブインターフェースをショートコードを使って簡単に記述できます。

  • Tab Area

ショートコード タブ


タブインターフェースの作り方を紹介します。


書き方


タブを書くには、ショートコードという記法を使います

[tab] [tab_item title="タブのタイトルを書きます"]

ここにコンテンツを書きます

[/tab_item] [/tab]

tab_itemを増やしていくとそれぞれのタブができます。

制限、html要素、h3はタイトルに使うので、tab_item内では使えません


画像


画像は、サイズが多少大きくてもタブ内に縮小されてはみ出ません

tab その他の属性

タブのコンテンツ部分にクラスを指定できます。

クラスを追加したサンプルを以下に示します。

[tab class="gradient2 corner"]
  • Tab Area

ショートコード タブ


タブインターフェースの作り方を紹介します。


書き方


タブを書くには、ショートコードという記法を使います

[tab] [tab_item title="タブのタイトルを書きます"]

ここにコンテンツを書きます

[/tab_item] [/tab]

tab_itemを増やしていくとそれぞれのタブができます。

制限、html要素、h3はタイトルに使うので、tab_item内では使えません


画像


画像は、サイズが多少大きくてもタブ内に縮小されてはみ出ません

❗ 一ページの画面の中に複数のタブインターフェースが表示される場合は、それぞれは、一つのタブインターフェースとして、表示されます。(つまり、タブインターフェースがいくつあっても、表示されるのはクリックした一つのコンテンツになります)


コメントは受け付けていません。