コンテンツがうまく構成されていると、ユーザーは長く滞在する傾向があります。タブを入れ子にすることで、整理整頓され、インタラクティブで、ユーザーフレンドリーな状態を保つことができます。これは、ドキュメント、価格表、FAQに最適です。
コンパクトなスペースですべてにアクセスできるよう、ユーザーがページを離れることなく異なるセクションを切り替えられるようにします。無限にスクロールするような乱雑なページではなく、きちんと構造化されたレイアウトで、複数の情報がナビゲートしやすい範囲に収まっています。
WordPressで複雑な作業をすることなく、ネストしたタブを追加することができます。必要なのは適切なツールと アルティメット・ブロック がまさにそれです。私たちの記事は、WordPressで最も簡単な方法で入れ子タブを追加する方法についての答えを見つけるのに役立ちます。
ワードプレスに入れ子タブを追加する
Gutenbergをお使いの方へ、 アルティメット・ブロック は、ネストしたタブを簡単に追加するための理想的な選択肢です。しかし、目的別に作られた26種類のブロックを持つUltimate Blocksは、タブのためだけのものではありません。Gutenbergでコンテンツを構造化し、分かりやすくし、インタラクティブな要素を追加するための適切なツールを備えたオールインワンのソリューションです。
ステップ1:プラグインの準備
まず、WordPressのダッシュボードにアクセスしてください。そこから プラグイン を選びます。 新規追加.検索バーに 究極のブロック 数秒以内に結果がポップアップするはずだ。結果にプラグインが表示されたら Install Now.少し時間をおいてから、プラグインを有効にしてください。

ステップ2:タブ付きコンテンツブロックを挿入する
ネストしたタブを追加したい投稿またはページをGutenbergエディタで開きます。エディタから + ボタンをクリックして タブ付きコンテンツを作成し、コンテンツに挿入します。これがタブレイアウトの基礎となります。

ステップ3:タブと入れ子タブを作る
一旦 タブ付きコンテンツ ブロックが追加されると、デフォルトではタブが1つになります。最初のレイヤーに複数のタブを作成するには "+" ボタンをクリックし、必要な数だけ追加します。各タブの名前を変更するには、タイトルを直接クリックして新しい名前を入力します。各タブは、テキスト、画像、その他のコンテンツブロックを挿入できるコンテナとして機能します。

創造する 入れ子タブ最初のレイヤーからタブを選択し、別のレイヤーを挿入する。 タブ付きコンテンツ ブロック・インサーターを使って、その中にブロックを追加します。この新しいブロックは、選択されたタブの中で第2レベルのタブシステムとして機能します。同じプロセスを繰り返すことで、さらにネストされたレイヤーを追加し、コンテンツを複数のレベルで構成することができます。

ステップ4:完璧になるまでカスタマイズする
各タブ内にコンテンツを配置した後、タブの外観を変更したくなるかもしれません。タブから 一般設定 タブで タブタイプ追加 タブアンカーそして、プロ・バージョンには以下が含まれる。 アイコン, イメージそして 二次テキスト というタイトルで。
で スタイル設定を調整することができます。 カラーズ をタブ、タイトル、コンテンツ用に変更します。 タブレイアウト を切り替える。 水平と 垂直 タブ をカスタマイズする。 ボーダーと寸法 あなたのデザインに合うように。

ステップ 5: 入れ子タブのプレビューと公開
ネストしたタブをライブにする前に プレビュー ボタンをクリックし、すべてが期待通りに動作しているか確認してください。すべてのタブがスムーズに切り替わり、ネストしたタブが正しく表示されることを確認してください。調整が必要な場合は、戻って設定を微調整してください。すべてがうまくいったら 出版 または Update をクリックして変更を反映させます。

ここでは、ネストされたタブの簡単なデモンストレーションをご覧いただけます。

結論
ネストされたタブは、WordPressのレイヤーコンテンツをより直感的にナビゲートします。ただし、本当の入れ子タブには対応していないため、効果を得るにはタブ付きコンテンツブロックを手動で挿入する必要があります。他のエディタを使っている場合 代替案は存在するしかし、すべてのタブ・プラグインがデフォルトでマルチレベル・ネストをサポートしているわけではありません。この記事で紹介した方法を試してみて、あなたのニーズに合うかどうか確かめてください。そして、もしそうでなければ、他のプラグインを試してみてください。コンテンツの整理を始めて、その違いを見てみよう。