WordPressの改ページの方法と目次を作る方法(ブロックエディタ)

先日、「フランスのコロナ対策の経過①~③」という記事を書き始めました。これは在ストラスブール日本国総領事館からいただいたメールについて基本1通を1ページとして書いていくつもりのもので、まだ発展途上なんですが、ページ数がかなり多いので、何月何日の内容はどこにあるかというのがすごく分かりにくかったです。

それで、最初のページにメールのタイトルと日付を全部書いて、一つひとつリンクを貼ったらいいかなとも考えましたが、大量にあるのをコピペするのもしんどいですし、ページ変更とかになったら、全部に影響が及びますね。

さてどうしよう~と悩んでいたんですが、ふと目次のプラグインを入れたらどうだろうと考えました。

当該記事はこちらです:
フランスのコロナ対策の経過①(2020年2月~7月)
フランスのコロナ対策の経過②(2020年8月~12月)
フランスのコロナ対策の経過③(2021年1月~最新情報)

改ページの方法

まず、改ページも今回の記事で初めて試してみました!

これはブロックエディタだとすごく簡単です。

画像は、WordPressスクリーンショットより

「ページ区切りブロック」(Page Break Block)を選ぶだけでできてしまいます。^^

目次が作れる無料のプラグイン

このブログはさくらインターネットのレンタルサーバを使って書いているので、固定費は無料ではないのですが、それ以外は節約すべく、無料のプラグインを探しました。

Easy Table of Contents

「目次」は英語でtable of contentsと言いますが、まさにぴったりなプラグインが見つかりました!

このEasy Table of Contentsというプラグインは、その名のとおり使い方は本当に簡単です。

目次が欲しいと思っている人は、とりあえずインストールしてみると直感的に分かると思います。

設定方法:一般

画像は、Easy Table of Contentsの設定画面より
サポートを有効化/自動挿入

デフォルトでは「固定ページ」になっていたと思いますが、わたしは、「目次」を表示させるのは「投稿」(この記事とかですね)のほうにしました。

別に複数選んでも大丈夫ですが、今のところ自分の固定ページは見出しのないものが1枚あるだけなので、とりあえずオフにしています。

位置

「最初の見出しの前(デフォルト)/最初の見出しの後/上部/下部」から選べます。

これはとても迷いましたが、全部試したところ、デフォルトに落ち着きました。

表示条件

「1~10件以上の見出しがある場合」から選べます。デフォルトでは「4件以上」になっていたと思います。

これは今回工夫した点なのですが、わたしは「2件以上」にしました!

「フランスのコロナ対策の経過①~③」は発展途上の記事なので、最初のうちは各ページの見出しがH3が1つとH4が1つの2件しかなかったりするんですが、そうすると「4件以上」のままだと目次が出てこないんです。

見出しラベル

これは目次の「目次」と書いてあるところを編集できるということです。

わたしはデフォルトの「Table of Contents」のままなんですが、日本語に自動的に翻訳されて「目次」と表示されるみたいです。

試しにフランス語で「Sommaire」と入れると、そのように表示されたんですが、「Table of Contents」と入力すると、また日本語で「目次」と表示されました。

「見出しラベルを表示」をオフにすると、「目次」というような言葉は表示されなくなり、目次の中身だけが表示されます。

折りたたみ表示

これは、読者が目次右肩にあるメニューボタンみたいなところをクリックすることで、折りたたんだり、また表示させたり、自由にできるようにするものです。

ツリー表示

これをONにしていると、目次の頭が見出しの大きさによって、1つずつ下がってくれます。

オフにしていたら、例えばH3もH4も同列に表示されます。

カウンター

「小数点表示(デフォルト)/数字/ローマ数字」から選べます。

1とか、1.2とか、数字を見出しの前に付けてくれるのですが、わたしの目次はなにしろ長いので、カウンターが表示されていると数字が溢れて余計に見にくかったです。

それで、カウンターは「なし」にしました。

設定方法:外観と高度

画像は、Easy Table of Contentsの設定画面より

目次の外観を変更することも可能です。この「外観」と次の「高度」のところは、今は私はまだ何も触っていない状態です。

わたしの目次

画像は、「フランスのコロナ対策の経過③(2021年1月~最新情報)」のスクリーンショットより

上記のように設定したところ、わたしの目次は今はこんな感じになっています。

この「フランスのコロナ対策の経過①~③」の場合、日付は見出しH4で、タイトルが見出しH3です。ちょっとだけツリー表示になっていますね。

「位置」で悩んだ理由ですが、「最初の見出しの前(デフォルト)」だと、最初の見出しのすぐ上に表示されるのですが、この間がくっつき過ぎている気がするので、個人的にはちょっと気持ちが悪いです。でも「スペーサー」を使うこともできないので、この点は諦めています。。

ちなみに、現在この記事の見出しは、こんな感じになっています。「カウンター」は「なし」ですが、「ツリー表示」されていますね。

さいごに

プラグイン「Easy Table of Contents」の感想ですが、目次が自分のブログに初めて表示された時、本当にものすごく感動しました!!

一つひとつ手作業で見出しのリンクを貼るしかなのかなと思っていたのが、嘘のように一瞬で解決できました。

数ページに渡るような長い記事を書こうとしている方、目次に悩んでいたらぜひお試しください。とてもおすすめです!

WordPressについて書いたブログはこちらです:

2020/7/18「WordPress(ワードプレス)を始めました
7/19「Gutenberg(グーテンベルク)とは?
9/15「WordPressで行間に区切りやスペースを挿入する方法(ブロックエディタ)
2021/3/9「WordPressの改ページの方法と目次を作る方法(ブロックエディタ)
4/5「CSSデビュー!WordPress(ワードプレス)の表の文字サイズを簡単に一括で変更する方法

(このブロックは、再利用ブロックです)

Be First to Comment

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です