皆さま、こんにちは。
今回はWordPressバージョン5.9から使用できるようになった”ブロックテーマ”についてです。そもそもブロックテーマはどんなことができる機能があるものなのかという点を、実際の管理画面をスクリーンショットでご覧いただきながらご説明していきます。
WordPressでブロックというと、2019年から導入されたブロックエディタを思い浮かべる方が多いのではないでしょうか。ブロックエディタには記事の編集時に画像や見出し、リストなどをHTMLタグを書かずに選ぶだけで挿入できる機能が備わっています。
■WordPressのブロックテーマとは
ブロックテーマは、ブロックエディタの発展形のようなものです。記事を書くページだけでなく、デザイン面もすべてブロックで管理をする仕組みです。WordPressで構築されたWEBサイトではデザイン面の管理をする”テーマ”というひとまとまりのファイル群がありますが、その”テーマ”が全てブロックで構成されているのがブロックテーマです。
全てブロックで構成されていて、デザイン編集もしやすいよう配慮されているのがブロックテーマのポイントです。ブロックエディタは記事部分だけでしたが、サイト全体の編集がブロックでできるようになりました。
■これまでのテーマが使えなくなる？
これまでのWEBサイトをブロックテーマに変える必要はありません。機能の一つとしてブロックテーマが追加されたような感じだとご理解ください。それ以外の方法でテーマが作れなくなったというわけではありませんので、ブロックテーマでなければもうインストールできない、といったことはありません。
とはいえ、ブロックテーマという新しい制作の方法が増えたことで、納品物がブロックテーマで作られていた、ご自身で使おうとインストールしたらブロックテーマだったということも増えてくるはずです。
そこで今回は、ブロックテーマで作成されたWordPressの管理画面のご紹介と、ブロックでデザインされているということは修正や追加が簡単になったのか？という気になる点を含め、実際の管理画面をご覧いただきながら解説していきます。
これまでブロックテーマというものを知らなかった、ブロックテーマを聞いたことがあったけれどどういうものかよくわかっていないという方に読んでいただければ今後のご参考にしていただけるのではと思います。
当記事は以下の内容で進めていきます。ご興味のあるところを読んでいただければ幸いです。
- WordPressブロックテーマの特徴
- ブロックテーマを使いたいと思ったら
- ブロックテーマのインストール
- ブロックテーマでデザインの編集をしてみた（管理画面紹介）
- ブロックテーマのメリット・デメリット
１．WordPressブロックテーマの特徴
ブロックテーマは、ナビゲーションメニュー、ヘッダー、記事、フッターなど、WEBサイトのあらゆるデザインパーツにブロックを使用しています。
すべてがブロックで構成され、パーツとして管理されるので、「デザインの組み合わせ」「同じデザインの使い回し」がしやすくなっているのが特徴です。
■WordPressブロックテーマは”エディター”に集約
これまでメニューやカスタマイズ画面がありましたが、ブロックテーマでは基本的には”エディター”に集約されています。
■エディターの画面
【エディター＝デザイン編集画面】
エディター画面にさまざまなものが集約されています。例えばフォントサイズを変えたり、リンク先を変えたり、写真を変えたり、テキストを修正したり。全てにつながっています。
1つの画面からさまざまな修正・カスタマイズができるのは便利だなと思いますが、階層も複雑になっているので、やはり「簡単にデザインができる／修正できる」わけではないと感じます。
■パターンを登録できる
特徴として組み合わせや使い回しがしやすくなったと書きましたが、それは登録する機能と、登録したものを一覧できる画面があるからです。
自分でパターンを登録しておくことができるので、1つのページで修正したものを他のページに反映させることが簡単になりました。
2．ブロックテーマを使いたいと思ったら
2024年、新しくリリースされたWordPressのデフォルトテーマ「 Twenty Twenty-Four」はブロックテーマです。2024年現在では最新のデフォルトテーマですので、まずはこのテーマをWordPressにインストールし、使い始めてみるのがおすすめです。
そのほかにもWordPress公式テーマの中にブロックテーマ対応のものがありますので、管理画面から検索して見つけることができます。管理画面内にあるテーマの追加ページには【ブロックテーマ】カテゴリができており、WordPressのデフォルトテーマの他にもブロックテーマが増えてきていることがわかります。
管理画面で見つかるのは、WordPressの公式テーマですから安心です。原則として無料で使えますし、ファイルの中身などもチェックされています（テーマによっては”PRO版”など課金してプラスする機能が付いているものもありますが、必要な人のみが契約するものとなっています）。
この他、今後はWordPressの公式テーマ以外で有料販売されるテーマにもブロックテーマ対応が増えてくると思います。ただ、「ブロックだから簡単」とはいえませんので、インストールして使ってみたら「思っていたより難しい」と思われるかもしれません。もし有料テーマが欲しいと思われても、まずはWordPressが用意しているデフォルトテーマで操作性やご自身が想定する内容が表現できるかの確認をしてから有料テーマ購入をおすすめします。
もし、有料テーマの購入を想定されている方がいらっしゃいましたら、別記事：WordPressの有料テーマを購入する時に気を付けることもお読みいただければ参考にしていただけると思います。
3．ブロックテーマのインストール
ブロックテーマもこれまでのテーマと同じように、WordPressの管理画面からインストールできます。
それ以外に必要な設定はありません。
プラグインも必須となるものや、使えないものはありません。
WordPressの公式テーマとして登録されているブロックテーマもいろいろありますので、ちょっと触ってみたいという方は、WordPress.comの無料プランを活用してインストール→編集のお試しをしてみてはいかがでしょうか。
4．ブロックテーマでデザインの編集をしてみた（管理画面紹介）
ブロックテーマはWEBサイト全体がブロックで構成されており、ブロックの階層が深くなるため非常に複雑ともいえます。管理画面をご覧いただきながら、機能の特徴がわかる部分をご紹介します。
※テーマを触る際には【左サイドメニュー＞外観＞エディター】と進んでください
左サイドにメニューがありますが、右に実際の表示画面が出ているので、そこをクリックして進めることも可能です。
○リストビューで構造を見える化
修正を進める段階では、左上のアイコンから【リストビュー】表示にしておくことがおすすめです。構造が見えるので、今どこを触っているかがわかります。
○（作業例）ナビゲーションを修正する
多くのWebサイトのトップページで採用されている”グローバルナビ（メニュー）”を修正する場合もエディター画面から文字列やリンク先などまとめて修正できます。
○（作業例）画像の装飾、情報を追加する
画像の入れ替えやリンク追加、切り抜き、枠線を付ける、フィルターをかけるなどができます。トップページの画像を入れ替える時など、便利ですね。
○（作業例）お知らせ欄のレイアウトの修正
何列（カラム）で見せるか、数値を変えるだけで修正できます。CSSの追加や並べ方なども調整可能。
○（作業例）フォント、フォントサイズ、余白の修正
同じブロック内で連動しているので、1つ変えると同じグループは一気に変わります。段落に見出しタグ（h1、h2）が入っているかも表示されるので、どこに見出しタグが付いているかの確認もしやすいです。
○（作業例）ブロックの追加
要素を追加するのはブロックエディタと同じで【+】から必要なブロックを選択して追加していきます。
ブロックにある【MAP】を追加してみます。ブロックに出てきた枠に住所を入れるとGoogleMAPが組み込まれます。左の構成要素にも【MAP】が増えています。
MAP以外にも、すべてのブロックを同じように追加できます。ブロックテーマはブロック以外の”パターン（ブロックを複数組み合わせたもの）”も追加できます。どんなブロック／パターンがあるかは、ブロック追加表示の下に出てくる【すべての種類】から確認できます。
ちょっとしたコンテンツも追加できるブロック／パターンがデフォルトで入っているので、WEBサイトに手を加えやすくなったのは間違いないと思います。
5．ブロックテーマのメリット・デメリット
デザイン等のスキルによってさまざまなご意見があると思いますが、一からデザインを制作する側ではなく、テーマはあるものをインストールして修正や調整のみ行うと仮定して、メリットデメリットを大きくまとめてみました。
■ブロックテーマのメリット
・編集画面＝プレビュー画面であり、直感的に操作しやすくなった
・ウィジェットやカスタマイズ、メニューなど分割されていたものが1つにまとまり操作感が上がった
・WEBページ内の構造がわかりやすくなった（見出しタグが付いているかなど）
・文字列、リンク、画像修正が簡単になった
■ブロックテーマのデメリット
・（WordPressは専門的な知識がなくてもWEBサイトを自由にできるとの触れ込みですが）大幅なデザインの修正はCSSの追加などが必要になり、専門的な知識が必要
・ブロックを組み合わせる（＝グループ、パターン）ことも前提となっており、複数人で触る場合は情報共有が必要
・パンくずリストなどWEBサイトでは必須機能もデフォルトではブロックにないものもあり、まだまだプラグインにも頼る必要がある
ストレスのない使い方をするなら、やはり気に入ったブロックテーマをインストールする、もしくはデザイナーさんに作成していただき、細かい部分で修正が出てきたらご自身で行うという形がスムーズかなと思いました。その修正がしやすくなったのは間違いなく、WordPressも進化しようとリニューアルをしているのだと感じられました。
まとめ
今回はブロックテーマを取り上げましたが、まだまだブロックテーマの解説も少なく、WordPressからの公式チュートリアルも少ない状況です。今後ブロックテーマでの制作が進むといわれていますが、現段階では未知数だと感じます。
ただWordPressの公式デフォルトテーマがブロックテーマとなっているため、皆さまの中にもご興味、ご関心のある方が増えていると思いましたので今回記事に取り上げてみました。管理画面等、初めてご覧になられた方もいらっしゃったかもしれません。今後の参考にしていただけましたら幸いです。