長いコンテンツを公開する場合、目次を追加すると、検索エンジンと 訪問者 人間がコンテンツをナビゲートして理解できるようにします。
ウィジェットを使って WordPressの目次ウィジェット、目次を簡単に追加できます ウェブサイト コンテンツ内のタイトル タグの階層に基づいてコンテンツを自動的に生成します。
例えば：
のビジュアルテーマビルダーでこのウィジェットを使用する場合 Elementor プロ、指を離すことなく、すべてのコンテンツに目次を自動的に追加できます。 訪問者が目次のリンクをクリックすると、アンカーとして機能し、ページのそのセクションに移動します。
この投稿では、ウィジェットの構成方法を正確に説明します WordPressの目次ウィジェット とともに Elementor テーマビルダー。
しかし、前に、一緒に発見しましょう WordPressのブログ7の手順をインストールする方法 et あなたのブログにワードプレスのテーマを、見つけインストールしてアクティブにする方法.
それから、私たちがここにいる理由に戻りましょう。
Elementorで目次を追加する方法
まず最初に、このウィジェットは基本的な方法でも使用できることに注意してください。 ただし、このチュートリアルでは、次のコマンドを使用して、コンテンツのすべて (または一部) に目次を自動的に追加することに焦点を当てます。 Elementor テーマビルダーと独自の投稿テンプレート。
それを行う方法は次のとおりです。
1.単一の投稿テンプレートを作成または変更する
まず、Elementor Theme Builderを使用して新しい一意の投稿テンプレートを作成するか、目次を追加する既存の一意の投稿テンプレートを編集します。
テンプレートはあらゆる種類の投稿（ブログ、ページ、カスタム投稿タイプ）に適用できますが、ここではブログ投稿に焦点を当てます。
2.目次ウィジェットを追加する
独自の投稿テンプレートを開いたら、ウィジェットを追加します コンテンツの表 目次を表示する場所。 これは、投稿タイトルと投稿コンテンツのウィジェットとともに、ユニークカテゴリにあります。
ウィジェットを追加すると、投稿に含まれるすべてのタイトルのリストが自動的に表示されます。
次に、このウィジェットの設定を構成します。
3.ウィジェットテーブルを構成する
目次ウィジェットの設定を必ず開いてください。 次に、タブを使用します コンテンツ 目次に表示されるコンテンツを設定します。
最初に、タイトルを追加します-たとえば、「目次」。 これは、ウィジェットが自動的に生成するアンカーリンクのリストの上に表示される静的テキストです。
次に、含めるコンテンツを選択します。 タブ内 含める、 あなたは入ることができます：
- HTMLタグ。 たとえば、含めることができますそして、しかしそれ以上のものはありません。 WordPressエディターでタイトルタグを定義する必要があります。
- コンテナ。 投稿コンテンツの外部の他のコンテナへのアンカーリンクを追加することもできます。 たとえば、足のつま先です。 これは高度な機能です。
タブにアクセスした場合 除外、 CSSセレクターを使用して、投稿から特定のヘッダーを除外できます。 たとえば、単一のタイトルを除外する場合、 特別なCSSクラスを追加できます " 無視する WordPressエディターを使用してそのヘッダーに、次にルールを使用してそれを除外します セレクターによるアンカー :
次に、パラメータを使用できます マーカービュー 目次リストで番号と箇条書きを選択します。 あなたが選ぶなら 弾丸」、任意のFont Awesomeアイコンから選択できます。
最後に、セクションを使用できます 追加オプション 他のパラメータを制御するには：
ワードラップ -要素が数行を取ることができるかどうか。
ボックスを最小化 - もし 訪問者 目次は縮小される場合もあれば、縮小されない場合もあります。 このオプションを有効にすると、カスタム アイコンを選択し、応答動作を設定することもできます。 たとえば、この目次を自動的に折りたたむことができます。 訪問者 モバイルで。
階層ビュー -有効にすると、小見出しは親見出しの下にインデントされます。 無効にすると、すべてがインデントなしでXNUMXつのリストに表示されます。
4.スタイル設定を構成する
次に、[スタイル] タブに移動して、目次のデザインを構成します。 すべての色とタイポグラフィを変更して、ユーザー フレンドリーなエクスペリエンスを作成し、デザインの残りの部分と一致させることができます。 ウェブサイト :
5.詳細設定を構成する
仕上げるには、タブに移動します 上級 目次の動作に関するいくつかの設定を構成します。
たとえば、 幅（Width） に等しい カスタム et 役職 に等しい 固定の セクションで ポジショニング、ユーザーがページをスクロールし始めても、目次が同じ位置にとどまることを確認できます。
あなたが使用している場合 ポジショニング コンテンツテーブルを別の要素（ヘッダーなど）の上に表示するには、Zインデックスを増やして上部に表示することもできます。
そしてそれだけです！ Elementor Visual Theme BuilderとTable of Contentsウィジェットを使用してコンテンツに目次を自動的に追加する方法を学習しました。
開始するには、購入してください Elementorプロ 今日、あなたの目次を作成します Elementorテーマビルダー.
