WordPressのブロックエディタ拡張:Getwidについて解説(8)Tabs

タナビーの高梨です。

今回はGetwidのTabsブロックに関する設定を解説していきます。

全般設定についてはこちらをご覧ください。

Tabs概要

Tabsブロックとは、公式ページからの引用では

プリセットされたスタイルとカスタマイズ可能な見出しで、水平または垂直のタブを作成

公式ページ(翻訳 by DeepL先生)

だそうです。

名前からしてタブだということは分かりますが、どんなものなのか、見た方が早いのでさっそく見ていきましょう!

ブロックの設定

ブロックの設定の前に、まずはタブの数を設定しないと設定画面そのものが出てきませんので、適当に設定しましょう。

数値は後から変えられます。

Title Tag:タイトルを何のタグで囲うかを「Paragraph」「Heading2」「Heading3」「Heading4」「Heading5」「Heading6」から選択します。それぞれ<p>、<h2>~<h6>で囲われます。

Layout:全体に対するタグの表示位置を「Horizontal Left」「Horizontal Center」「Horizontal Right」「Vertical Left」「Vertical Right」から選択します。実際のイメージを下に記載しておきます。

Horizontal Left

Horizontal Center

Horizontal Left

Horizontal Right

Horizontal Left

Vertical Left

Horizontal Left

Vertical Right

Horizontal Left

Active by Default:デフォルトで選択されているタブを指定します。

まとめ

設定個所は以上です。

設定が少ないですね。

CSSの設定を誤ると、タブの枠線(border)が不自然になります。

本記事でもおかしな表示になっていますが、あえてそのままにしておきます。