【解説】タブブロックの使い方｜Aurora Design Blocks

Index

ブログ内の情報をコンパクトにまとめたいときに便利なのが「タブブロック」です。
この記事では、Aurora Design Blocks に搭載された「タブ切り替え機能付きブロック」の使い方を、画像付きでわかりやすく解説します。

タブブロックとは？

複数のコンテンツを「タブ形式」で切り替えて表示できるブロックです。
自己紹介・よくある質問・商品説明など、内容ごとに分けたいけど1画面にまとめたいときにぴったり。

まず、プラスボタン「＋」からブロックを追加し、
「[aurora-design-blocks]Tab switching feature」をクリックします。

この時点で、タブ切り替えに対応したレイアウトブロックが作成されます。

「タブのタイトル…」と書かれた部分に、好きな見出し名を入力します。
（例：特徴・使い方・注意点など）

タブはプラスボタン（＋）を押すことでいくつでも追加できます。

各タブを選択すると、それぞれ独立したブロックエリアになります。
ここに文章や画像など、自由に内容を入れていきましょう。

ポイント：
タブ間の内容は同時に表示されないため、視覚的に混乱しにくく、スマホでもすっきり見える構成にできます。

タブはクリックするだけで切り替え可能。
以下のように、選択中のタブは黒背景＋白文字で表示されます。

切り替えはJavaScript不要でスムーズ。表示速度にも影響しません。

読者が「自分に必要な情報だけをサクッと見られる」仕組みは、ブログ全体の読みやすさにも直結します。
Aurora Design Blocksのタブブロックは、そんな導線づくりにぴったり。

ぜひあなたのブログにも取り入れて、情報整理のプロになっちゃいましょう🌟