ヤフオクに出品中です。

サイドバーに追従する目次を設置する方法 Cocoon

Cocoonでサイドバーに追従する目次を設置する方法ワードプレス
この記事は約3分で読めます。

記事が非常に長くなった場合、読者が現在位置を迷う可能性があります。

そんな時、サイドバーでページのスクロールについてくる目次を用意しておくと親切です。

WordPressテーマのCocoonなら、簡単にサイドバーで追従する目次を設定することができます。

Cocoonとは

Cocoonは、SEO・高速化・モバイルフレンドリーに最適化した無料テーマです。

見た目はシンプルですが、初めての方でも感覚的に使えるように便利な機能を織り込んで作りました。

100%GPLテーマなので自由にご利用いただけます。

Cocoon
SEO・高速化・モバイルファースト最適化済みのシンプルな無料Wordpressテーマ。100%GPLテーマです。

寄付を募集していたのでお礼にわずかですが支援しました。良いテーマをありがとうございます。

サイドバーに追従する目次ウィジェットを設置する方法

左カラムの[外観]内[ウィジェット]をクリック。

Cocoon ウィジェット

利用できるウィジェット欄にある[目次]をサイドバースクロール追従にドラッグ&ドロップすれば完了です。

Cocoon [目次]をサイドバースクロール追従にドラッグ&ドロップ

ウィジェットから距離があってドラッグ&ドロップしにくい場合は[目次]右のメニューをクリックして開きます。

メニューが開くので[サイドバースクロール追従]にチェックを入れて[ウィジェットを追加]ボタンをクリックすることでも登録が可能です。

Cocoon [サイドバースクロール追従]にチェックを入れて[ウィジェットを追加]

 

[サイドバースクロール追従]に[目次]ウィジェットを登録できたら、詳細を設定します。

設定が完了したら[保存]をクリックして内容を確定します。

Cocoon 目次の詳細設定

タイトル

「目次」とか「インデックス」、「索引」などお好きなタイトルを付けてください。

目次表示の深さ

デフォルトでは「H6見出しまで」表示されますが、内容が分かりやすい程度の見出しに変更可能です。

左カラム[Cocoon設定]内[目次]タブ内[目次表示の深さ]の設定に準拠します。

Cocoon設定 目次表示の深さ

 
準拠(じゅんきょ)とは「あるものをよりどころとしてそれに従うことです」

表示設定

カテゴリーや特定のページでサイドバースクロール追従目次の表示・非表示を切り替えることができます。

  • カテゴリー
  • ページ
  • 著者
  • 投稿
  • 固定ページ
  • タグ
 

Cocoonのサイドバーでページのスクロールにあわせて目次がついてくるようになりました。

タイトル多めのページ表示例

AliExpressの購入方法
中国ショッピングサイトAliExpressの購入方法を迷わないように画像を多用して丁寧に説明しています。アリエクスプレスでは安くて日本では手に入れにくい商品も多数ありました。到着まで日数がかかることを許容できればお得なお買い物ができます。

まとめ

WordPressのテーマ、Cocoonでサイドバーに表示した目次がページのスクロールに追従する方法でした。

Cocoonは無料なのに、プラグインをインストールしないと実装できない機能も少し装備されている高機能なWordpressのテーマです。

WordPressの初心者から上級者まで無料テーマを探しているならオススメのテーマです。

コメント

タイトルとURLをコピーしました