ある ワードプレス ウェブコンテンツ管理では、商品ページ、コースページ、カスタム記事タイプを扱うとき、例えば、詳細を保持するために多くのフィールドを使用することがよくあります：

• 製品パラメータ（モデル、重量、材質(zhì)）
• コース內(nèi)容（導入、シラバス、講師紹介、FAQ）
• サービス內(nèi)容（サービス範囲、料金説明、利用方法）

すべてのフィールドのコンテンツが同じページ內(nèi)に積み重ねられていると、ユーザーは読むのに混亂し、ページの専門性と美観が損なわれる。

を使用する方法について説明します。タブタブはフィールドの內(nèi)容を表示するためにグループ化される。

I. タブタブの利點

タブタブ（タブの切り替え）が可能：

• 異なるタイプの情報をグループ化して表示する
• 控えめにウェブページ長すぎるコンテンツを避けるための長さ
• ページの美観と専門性を高める
• ユーザーが必要な情報を素早く見つけられるようにする

第二に、コードなしで、フィールドの內(nèi)容の生産タブタブページメソッド

初心者の方には、次のような使い方をお勧めします。 ページ編集プラグイン 例えば、タブ機能を?qū)g裝する：

方法1：Elementorの無料版を使う

エレメンタ WordPressでよく使われるページエディターのひとつで、無料版にはタブウィジェットが付屬しており、簡単に操作できる。

ステップ

1.WordPressの背景で[ページ]をクリックし、編集したいページを選択して[Elementorで編集]をクリックします。

2.左側(cè)の「タブ」を検索し、ドラッグ＆ドロップする。 タブウィジェット ページに戻る

3.各タブのタイトルと內(nèi)容を編集する。

4.內(nèi)容がフィールドから來ている場合は、フィールドの內(nèi)容をコピーして、対応するタブに貼り付けることができます。

例

• タブ1 タイトル：製品概要
• タブ1 內(nèi)容：商品説明欄をコピー＆ペーストする
• タブ2 タイトル：製品パラメーター
• タブ2 目次：パラメータ?フィールドのコピー＆ペースト
• タブ3 タイトル：よくある質(zhì)問
• タブ3 內(nèi)容：コピー＆ペースト よくあるご質(zhì)問 フィールド

5.ページを保存するには、[更新]をクリックします。

方法2.Gutenberg Editor Blockプラグインを使う

WordPressのデフォルトエディタ(グーテンベルク)、例えばタブ機能をサポートするブロックプラグインをインストールすることができます：

• ケイデンス?ブロック
• Spectra (舊稱：Ultimate Addons for Gutenberg)

ステップ

• プラグインをインストールして有効化する（バックグラウンドの[プラグイン]→[プラグインのインストール]でプラグイン名を検索する）

• ページを編集する際、ブロック選択で「タブ」を検索する。

• タブ?ブロックを挿入し、必要な數(shù)のタブを追加する。

• 各タブに対応するフィールドの內(nèi)容を貼り付ける
• 更新ページ

方法3.テーマ付屬のタブ機能を使う。

いくつかの高度なテーマ（例えば アストラ?プロタブコンポーネントはBlocksy Proに付屬しており、プラグインをインストールすることなく、ページ編集中に直接挿入することができます。

タブのグループ化 アプリケーションノートの表示

タブタブを使用すると、ページ內(nèi)の多くのページを移動できます。フィールドコンテンツを論理的に分割することで、全體的な構造をわかりやすくしています。例えば、イントロダクション、パラメーター、よくある質(zhì)問、使用方法、その他の情報を別々に配置し、訪問者がスイッチをクリックして必要なコンテンツを表示できるようにすることで、ページのコンテンツが連続的に積み重なることによる視覚的な混亂を避けることができます。

タブをデザインする際、フィールドのコンテンツタイプに基づいてグループ化の順序と名前を決定し、各タブが理解しやすく読みやすいコンテンツの獨立したブロックを提示するようにできます。

ヒント

• タブタグの內(nèi)容は、論理的に分離して配置するのに適しています。コンテンツブロック
• ユーザーにとって難しい選択を避けるため、タブの數(shù)は3?5個に制限することを推奨する。

• 各タブ內(nèi)のコンテンツはできるだけシンプルにし、核となる情報を優(yōu)先する。

V. まとめ

タブタブを使ってフィールドのコンテンツをグループごとに表示することで、ページがすっきりし、ナビゲートしやすくなり、全體的なデザインもよりプロフェッショナルなものになる。WordPress初心者の方は、Elementorを使うだけでコードは不要です、ケイデンス?ブロック テーマがコンポーネントと一緒に提供されている場合は、簡単です。

お問い合わせ
チュートリアルが読めない？無料でお答えします！個人サイト、中小企業(yè)サイトのための無料ヘルプ！	カスタマーサービス WeChat
① 電話：020-2206-9892
② QQ咨詢：1025174874
三 Eメール：info@361sale.com
④ 勤務時間: 月～金、9:30～18:30、祝日休み