WordPress6.1+Twenty Twenty Three

WordPress が 6.1 になり、伴って Twenty Twenty Three というテーマもリリースされました。結構遊べる組み合わせだったので、さっそく適応させてみました。

フルサイトエディティング

ヘッダーやフッターはこれまであまり編集することはありませんでしたが、今回の組み合わせだとフルサイトエディティングが可能になっています。もちろん制約もありますが、かなり色々いじることができるようになってますね。

block 単位で編集可能にするのは、 WordPress のトレンドですね。ヘッダーやフッターもこのトレンドにあわせるかたちで編集可能になっています。 CSS が必要な部分はあるのですが、 CSS と組み合わせることでかなり自由度の高い編集が可能になってます。

このブログもトップページにはタイトルがあり、その横にメニューボタンを配置してメニューの中にプライバシーポリシーなどを入れてあります。その下にブロック状の記事一覧が並ぶという構成になっています。

編集画面と実際の見た目も同じになっている

WordPress6.1+Twenty Twenty Three の組み合わせだと、編集画面と実際に公開された画面はほぼ等しくなっていますので、イメージもわきやすくなっています。私のブログには広告も入れていませんので ( 一時期入れていたけど外した ) 、大変シンプルになっていると思います。画像の最適化はできていないので、画像で待つことはあるかと思いますし、サーバーの都合もあって高速かはできているのか少々疑問ですが、少しは早くなってると思います。

これまでもありましたが、特定の block に CSS のクラスを割り当てることができるので、そのクラスに基づいて見た目を変えることもできるわけです。追加 CSS の設定もこれまで通りできるので、編集作業がかなり便利になります。

CSS 指定は編集画面では見ることができなくなっていますが、プレビューを組み合わせることで便利に使うことができると思います。

ロリポップ ! との相性

これは以前にも記事にしたことがあると思いますが、追加 CSS を割り当てる際に、ロリポップの WAF( ウェブアプリケーションファイアーウォール ) と相性が悪く、 WAF を指定したままだと追加 CSS の指定でエラーになります。

一時的に WAF を OFF にしてやることで、追加 CSS の指定が通りますので、やってみてください。ロリポップのホームページにも記述がありますが、 OFF にしてからおおよそ 5 分ほど反映されるまで時間がかかりますので、ちょっと待ってください。

WAF は基本的に ON にしておくのが推奨されていますので、作業が終わったら、 ON にするようにしましょう。

---

バージョンアップで今後どうなるのかワクワクしますね。サクッと見た目を編集して自分好みのサイトにしていきたいと思っています。