Hestia×WORDPRESS ブロックエディタメモ

WORDPRESSが、いわゆる「日記CGI」式エディタからブロックエディタになってから暫く経ちました。そこで、この連休中に、このブログのトップページをWORDPRESSのブロックエディタで作成した「固定ページ」に置き換えてみました。テンプレートは、Hestiaを利用しています。

ちょっと全体をスクショするためにかなり縮小したので見えにくいですが

こんな感じです。以前のブログサイトと、実はさほど表示内容は変えていませんが、以前の固定ページでは、こんなことはほぼできませんでした。

まず、Hestiaには、時前のセクションを使い、パーツと、固定ページ、ブログを組み合わせられる「フロントページセクション」があります。なので上に近いようなものは実は可能だったりしますが、Hestiaで用意されているパーツを使うので、必ずしも自分好みにはカスタマイズできません。

まずはHestiaの「外観設定」から。一般設定でのページサイドバーレイアウト、ブログサイドバーレイアウトを共通で右にサイドバーがくる形式を選択。次に外観設定から戻って、「フロントページセクション」を選択、「私たちについて」以外を無効にします。この「私たちについて」というのが、いわゆる「固定ページをトップページに持ってくる」設定になります。企業サイトなんかだと「About us」みたいなのをトップに持ってきているイメージですね。
そして最後、「ホームページ設定」にて、ホームページの表示を「固定ページ」にして、ホームページとなっている選択肢から、トップに設定したい固定ページを選択すればOKです。ページサイドバーレイアウトで右にサイドバーが設定したのに、全幅ページになる場合は、固定ページの編集画面の右メニュー、「文書」で下のほうにあるサイドバーでも同じものを指定すればOKです。

カスタマイズはWORDPRESSのカスタマイズ機能を利用しますが、これの便利なところは「下書き保存」できるところです。どういうことかというと、現在運用しているページをいじらずに、カスタマイズ内容を保存するときに「公開」ではなく「下書き保存」を選ぶことで、従来のように、運用しているサイトを直接いじらずに修正が完了してから公開することができるようになったということです。特に今回は、ブログ⇒固定ページに変更なので、ブログは普通に更新しつつ、固定ページをカスタマイズして完了してすぐ差し替えが可能です。

ホームページトップに持ってきた二つの内容、一つはブログですが、もう一つは署名サイトへのリンクです。この二つは、プラグイン『Stackable』の『Feature』を使いました。

緑で囲っている注意書きは同じく『Stackable』の『Notification』、3つの固定記事は『Feauture Grid』。これも、自分で選んだブログへのリンクを入れられます。現在は3つですが、数は変えられます。一つなら上と同じ『Feature』を使えば良いので、複数のときはこちらという感じでしょうか。

区切り線はプラグインなしの『レイアウト要素』から『区切り』、Blogの文字もプラグインなしでの『一般ブロック』から『見出し』で選びました。ブログの記事の羅列は、プラグイン『Stackable』の『Posts』を選択、表示数と横列数を選べるので「1」にすればリスト型に、「2」すればこのページのようになります。表示は『Landscape』型にしています。また、画像ではわかりませんが、この下にカテゴリ別にも表示していまして、それは同じプラグインでカテゴリを指定して表示しています。

固定ページで不便なのは、ページ送りができないことですね。ブログを表示するだけの固定ページを作ってそこに全体を表示する方法もありますが、多いとそうもいかないので、ボタンなどを設置して、そこからカテゴリ別にリンクを設定するとかすれば良さそうです。（これを書きながら、『Stackable』の『ボタン』で設定しました）