LuckyWP Table of Contents:カスタマイズ可能な目次を生成できる

2019年7月14日

カスタマイズ可能な目次を自動的に生成できる WordPress 用プラグインの紹介です。
それは「LuckyWP Table of Contents」です。
その導入手順から日本語化・使い方と設定などを解説していきます。

LuckyWP Table of Contents

LuckyWP Table of Contents - WordPress.org

LuckyWP Table of Contents は、カスタマイズ可能な目次を自動的に生成できます。

生成される目次は、デフォルトでは自動で挿入されますが、
ショートコード・Gutenberg ブロック・ウィジェットでの表示も可能です。

出力される目次の HTML コードは、
Google 検索結果のスニペットにページ内リンクとして表示されます。
日本語化対応もされています。

国産の目次作成プラグイン「Rich Table of Contents」もあります。

記事を作成もしくは更新時点でのバージョン:2.0.3
マルチサイトでの利用:可

Gutenberg エディターでの動作

Gutenberg エディターに専用ブロックが追加されます。

Gutenbergでのショートコードの挿入手順

このプラグインは、ショートコードを使用します。
挿入手順については、下記の記事にて詳しく解説していますので、御覧ください。

Gutenberg でのショートコードの挿入手順 – WordPress活用術

LuckyWP Table of Contents のインストール手順

LuckyWP Table of Contents をインストールするには 2 種類の方法があります。
下記の URL から ZIP ファイルを入手して、管理画面からアップロードして有効化する。
LuckyWP Table of Contents – WordPress.org

もしくは、WordPress.org の公式プラグインディレクトリにリリースされているので、
管理画面からインストールできます。

ダッシュボードから「プラグイン」メニューの「新規追加」を選択し、
プラグイン追加画面右上の検索窓に「LuckyWP Table of Contents」と入力します。

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

検索結果の一番左上に表示されると思うので、「今すぐインストール」をクリックします。
※一番左上に表示されない場合は、上記の画像から探して下さい。
インストールが完了したら、プラグインを「有効化」します。

プラグインのインストールに慣れていない方は、
下記の記事にて詳しく解説していますので、御覧ください。

WordPressプラグインのインストール手順を解説 – WordPress活用術

LuckyWP Table of Contents の日本語化

LuckyWP Table of Contents は、日本語化対応がされているので、有効化するだけで日本語化されます。
日本語化されない場合には、日本語化用の言語パックを translate.wordpress.org から入手できる場合があります。

WordPress と関連プロジェクト(テーマ・プラグイン)用の翻訳プラットフォームとして、
translate.wordpress.org (GlotPress) が導入されています。

※ボランティアで翻訳されている場合が多いので、
全てのプラグインで、必ずしも日本語化用の言語パックが用意されているわけでは無いです。
また、用意されていても 100% 翻訳されている保証もありません。

日本語化用の翻訳ファイルの探し方は、下記の記事を参照してください。

WordPress公式での日本語化用の翻訳ファイルの探し方 – WordPress活用術

専用メニュー

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

ダッシュボードの「設定」メニューの中に追加されています。

LuckyWP Table of Contents の使い方

必要に応じて設定画面から設定変更を行います。
目次の挿入(表示)するには、5 種類の方法があります。

  • ショートコードを手動で記述
  • 投稿編集画面のボックスで設定
  • ショートコードビルダーで挿入
  • 専用ブロックで挿入
  • 専用ウィジェットで挿入

ショートコードを手動で記述するのは面倒なので、
残りの 4 種類の方法を簡単に説明します。

投稿編集画面のボックスで設定

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

クラシックエディターの「テキスト」タブの場合には、
専用のボックスが追加されています。
デフォルトでは有効になっているので、目次が不要であれば無効にできます。
カスタマイズ項目は、共通なので最後に説明します。

ショートコードビルダーで挿入

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

メニューに追加されたボタンをクリックするとビルダーが起動します。

専用ブロックで挿入

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

一般ブロックに専用ブロックが追加されています。

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

設定値を変更したい場合には、鉛筆マークをクリックします。

専用ウィジェットで挿入

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

カスタマイズ項目

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

設定値は設定画面で設定した値が自動設定されています。

表示例

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

実際に表示させると上のような感じで表示されます。

LuckyWP Table of Contents の設定(Settings)

一般

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

  • 見出しの最小数
    投稿中の見出しの数が指定した数値よりも少ないと目次を表示しないようにできます。
    初期値:2
  • 深さ
    見出しタグの深さを指定します。
    初期値:6
  • 階層表示
    目次を階層形式で表示するかどうか。
  • 数値化
    見出し番号のカウントアップの仕方を選択します。
    初期値:Decimal numbers(nested)
  • 計算接尾辞
    各見出し番号の最後に記号を追記したい場合に選択します。例)1.3)

ヘッダー

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

  • タイトル
    目次のタイトルを入力します。
  • 表示/非表示を切り替える
    「表示・隠す」リンクを表示するかどうか。
  • ラベル表示
    「表示」リンクのラベルを入力します。
  • ラベル非表示
    「隠す」リンクのラベルを入力します。

「デフォルトだとコンテンツのアイテムは隠れた状態です」
にチェックを付けると目次はデフォルトでは非表示となります。

動作

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

  • スムーズスクロール
    スムーズスクロールを有効にするかどうか。
  • オフセットトップをスクロール
    オフセットトップを px 単位で入力します。
    初期値:24 px

外観

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像


  • 目次領域の幅を選択します。
    初期値:自動
  • 回り込み
    目次の表示位置を指定します。
    初期値:なし
  • タイトル文字サイズ
    目次のタイトルのフォントサイズを指定します。
    初期値:デフォルト
  • タイトルフォントの太さ
    目次のタイトルのフォントの太さを選択します。
    初期値:太字
  • アイテムのフォントサイズ
    目次の各見出しのフォントサイズを指定します。
    初期値:カスタム値
  • 配色
    目次の配色を選択します。
    初期値:ライトカラー

配色を上書き

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

  • 背景色
    背景色を選択します。
  • ボーダー色
    枠線の色を選択します。
  • タイトル色
    タイトルの文字色を選択します。
  • リンク色
    リンクの色を選択します。
  • ホバーリンクの色
    マウスホバー時のリンクの色を選択します。
  • 訪問済みリンクの色
    訪問済みのリンクの色を選択します。

自動挿入

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

  • 目次を自動挿入
    目次を自動挿入するかどうか。
  • 位置
    目次の表示場所を選択します。
  • 投稿タイプ
    目次を表示する投稿タイプを選択します。

見出しを処理

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

  • 常に投稿タイプ用
    見出しの処理を常に行う投稿タイプを選択します。

その他

見出しをスキップ

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

  • レベルで
    目次から除外する H タグのレベルを選択します。
  • テキストで
    目次から除外する見出しに含まれるテキスト文字列を入力します。(1 行に 1 つ)ワイルドカードとしてアスタリスクを使用可。

ハッシュ

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

  • ハッシュ形式
    ハッシュ形式を選択します。
  • 小文字に変換
    小文字に変換するかどうか。
  • [_] を [-] に置き換える
    アンダースコアをダッシュに置き換えるかどうか。

SEO

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

目次を タグでラップ:
目次を noindex タグでラップするかどうか。

リンクに rel="nofollow" を使用:
リンクに rel="nofollow" 属性を追加するかどうか。

その他の設定

WordPressプラグイン「LuckyWP Table of Contents」の導入から日本語化・使い方と設定項目を解説している画像

  • 投稿タイプにパネルの「目次」を表示する
    「目次」パネルを表示する投稿タイプを選択します。
  • マークアップタグ一覧
    マークアップタグを選択します。

代替プラグイン

LuckyWP Table of Contents にほしい機能が無かった場合には、
LuckyWP Table of Contents 以外にも投稿内に目次を自動生成できるプラグインを記事にしています。
以下では、LuckyWP Table of Contents を含めて 5 個を簡単に紹介しています。

投稿内に目次を自動生成できるWordPressプラグイン一覧

URL

LuckyWP Table of Contents – WordPress.org

本ページはアフィリエイトプログラムによる収益を得ています

目次生成

Posted by 管理人