「WordPress ブロックテーマ」で検索すると「おすすめブロックテーマ○選」という記事がいくつも出てきますが、そこで紹介されているテーマを一つずつ確かめていくと、ブロックテーマではないものが少なからず混ざっています。原因は「ブロックテーマ」と「ブロックエディター対応」の混同です。この記事では、WordPress公式の定義にもとづく見分け方と、国産テーマがどちらに当たるのかを出典つきで整理します。
WordPress公式の定義は、たった1つのファイル
ブロックテーマかどうかは、好みや程度の問題ではありません。テーマ開発者向けの公式ドキュメント「Theme Structure」には、ブロックテーマとして認識されるために必要なファイルが2つだけ挙げられています。
| ファイル | 役割 |
|---|---|
style.css | テーマのメタ情報 |
templates/index.html | デフォルト/フォールバックテンプレート |
そして templates/index.html について、公式ドキュメントには「This is necessary for WordPress to consider this a block theme.(WordPressがこれをブロックテーマと見なすために必要)」と書かれています。出典は Theme Structure – Theme Handbook です。
templates/index.html があるかどうかで、WordPressがブロックテーマだと見なすかが決まる。解釈の余地はなく、これが唯一の線引きです。公式に示されているブロックテーマの構成は次のとおりです。
- templates/|
index.html404.htmlarchive.htmlsingular.htmlなど、ページの土台になるテンプレート - parts/|
header.htmlfooter.htmlなどのテンプレートパーツ - patterns/|ブロックパターン。中身は .php ファイル
- styles/|スタイルバリエーションのJSON
- theme.json|配色・フォント・余白の全体設定
- style.css / functions.php / README.txt / screenshot.png
「ブロックテーマ」と「ブロックエディター対応」は別物
混同の元になっているのが、この2つの言葉です。
| 用語 | 意味 |
|---|---|
| ブロックエディター対応 | 記事や固定ページの本文をブロックで書ける |
| ブロックテーマ | ヘッダー・フッター・投稿一覧まで含めたサイト全体をブロックで組める |
ブロックエディター(Gutenberg)はWordPress 5.0から標準の投稿エディターです。いま配布・販売されているテーマは、ほぼすべてブロックエディターに対応しています。対応していること自体は、もはや特別なことではありません。
一方ブロックテーマは、WordPress 5.9以降の「サイトエディター(フルサイト編集/FSE)」でサイト全体を編集できるテーマ形式です。「ブロックエディターで記事が書ける」ことと「ブロックテーマである」ことは、まったく別の話です。
見分け方1|管理画面の「外観」メニューを見る
一番かんたんな方法です。テーマを有効化した状態で、管理画面の「外観」を開くだけ。ダウンロードもドキュメント検索も要りません。
| テーマの種類 | 「外観」メニューに出るもの |
|---|---|
| クラシックテーマ | 「カスタマイズ」「ウィジェット」「メニュー」がある |
| ブロックテーマ | 「エディター」がある |
ブロックテーマを有効化すると、WordPressはカスタマイザー・ウィジェット・メニューの各画面を表示しなくなります。ヘッダーやフッターはブロックのテンプレートパーツで作るため、ウィジェットエリアという概念そのものが存在しないからです。
見分け方2|WordPress.orgのタグを見る
WordPress.org公式ディレクトリで配布されている無料テーマなら、テーマページのタグで判定できます。
| タグ | 判定に使えるか |
|---|---|
Block themes | このタグがあればブロックテーマ、なければブロックテーマではない |
Block editor styles | 判定に使えない。ブロックテーマにもクラシックテーマにも付く |
注意したいのが2行目です。Block editor styles を根拠にすると誤判定します。見るのは Block themes の有無だけです。
この方法が使えるのは、WordPress.orgで配布されているテーマだけです。有料テーマの多くと、一部の無料テーマ(unitone、Cocoon、Emanon Freeなど)は公式サイトからの配布なので、この方法では判定できません。また、同じ名前で別のテーマが登録されていることもあります。たとえばWordPress.orgの「Swell」は海外の開発元による別のテーマで、国内で知られるSWELLとは関係ありません。作者名まで確認してください。
見分け方3|ファイル構成を見る
ファイルを直接確認できる場合は、公式の定義そのものなので最も厳密です。ただし、ここには大きな落とし穴があります。
「PHPファイルが入っているからクラシックテーマ」は誤りです。先ほどの公式構成のとおり、ブロックテーマにも functions.php は入りますし、patterns/ フォルダの中身は .php ファイルです。
functions.php|両方にある。判定に使えないstyle.css|両方にある。判定に使えないpatterns/*.php|ブロックテーマにもある。判定に使えないtemplates/index.html|ブロックテーマにのみ存在。これが定義header.phpfooter.phpsingle.phpsearch.php|クラシックテーマにのみ存在
テンプレートPHPはブロックテーマには存在しないので、これらがあればクラシックテーマで確定です。テーマ公式のカスタマイズ解説に「子テーマで header.php を編集してください」といった手順が載っていれば、そのテーマはクラシックテーマだと分かります。
見分け方4|公式が自分を何と呼んでいるか
開発元のドキュメント・FAQ・フォーラムで、そのテーマが自分をどう説明しているかを探します。推測を挟まずに済むので、明言が見つかればこれが一番確実です。
「ハイブリッドテーマ」「モダンテーマ」と書かれていたら
テーマを探していると、こうした言葉にも出会います。読み替え方を整理しておきます。
| 表記 | 意味 |
|---|---|
| ブロックテーマ | ブロックテーマ。「フルサイト編集(FSE)対応」も同じ意味 |
| ブロックエディター対応 | ブロックテーマではない |
| ハイブリッドテーマ | ブロックテーマではない。クラシックにブロック機能を一部取り入れたもの |
| モダンテーマ | 公式の用語ではない。ブロックテーマとは限らない |
WordPressの公式区分にあるのは「ブロックテーマか、そうでないか」だけです。「ハイブリッドテーマ」は公式の分類ではありません。サイトエディターでサイト全体を編集したい場合は、ブロックテーマが必要です。
なお、「ハイブリッド」と名乗ること自体は不正確ではありません。ブロックテーマだと名乗っていないので、むしろ正直な表記です。問題になるのは、それを紹介する側が「ブロックテーマ」として扱ってしまうことのほうです。
国産テーマはどちらに当たるか|ブロックテーマ
よく名前の挙がる国産テーマを、上の基準で整理しました。まずブロックテーマに当たるものです。
| テーマ | 判定の根拠 |
|---|---|
| X-T9 | Vektor。タグ Block themes(無料・WordPress.org掲載)。公式サイトも「フルサイト編集機能に対応した WordPress ブロックテーマ」と明記 |
| unitone | Monkey Wrench。公式サイトが「フルサイト編集に対応したブロックテーマ」と明記。WordPress.orgでは配布されておらず、公式サイトからの直接配布 |
| Hakoniwa | AnimaGate。タグ Block themes(無料・WordPress.org掲載)。説明文も「Block theme」と明記 |
| REALIZER | FUJI PRODUCTION。タグ Block themes Full site editing(無料・WordPress.org掲載) |
| LIQUID AIR | リキッドデザイン。タグ Block themes(無料・WordPress.org掲載) |
| LIQUID PRESS BLOCK | リキッドデザイン。公式サイトが「フルサイト編集対応ブロックテーマです。」と明記(有料・公式サイトで配布) |
| Abira | 369work。タグ Block themes(無料・WordPress.org掲載) |
| Blanky | 369work。タグ Block themes(無料・WordPress.org掲載) |
| Enyoi | 369work。タグ Block themes(無料・WordPress.org掲載) |
| Mobiki | 369work。タグ Block themes(無料・WordPress.org掲載) |
| Abira Academy | 369work。369Themeで配布。個人塾・スクール向け有料ブロックテーマ。 |
| Blanky シリーズ | 369work。369Themeで配布。サイト向けのBeauty/Work/Studio/Nordicの4種類に加え、Link in Bio 向けのLinkがあります |
国産テーマはどちらに当たるか|クラシックテーマ
次に、ブロックテーマではないものです。いずれも優れたテーマですが、サイトエディターでサイト全体を編集する用途には当てはまりません。
| テーマ | 判定の根拠 |
|---|---|
| SWELL | LOOS。公式フォーラムに「SWELLはクラシックテーマです」という回答がある。公式ドキュメントにも header.php への言及がある(編集は推奨されていない)(WordPress.org掲載なし・公式サイトで配布) |
| Arkhe | SWELLと同じ開発元LOOS。Block themes タグがなく、Right sidebar Theme options などクラシックテーマのタグが付く(無料・WordPress.org掲載) |
| Snow Monkey | Monkey Wrench。同じ開発者が unitone公式サイトで「Snow Monkey はフルサイト編集に対応していないクラシックテーマ」と説明している(WordPress.org掲載なし・公式サイトで配布) |
| SANGO | 公式カスタマイズガイドに、子テーマで header.php を扱う手順がある(WordPress.org掲載なし・公式サイトで配布) |
| Emanon | 公式マニュアルが「外観>カスタマイズ>コンテンツ設定」で設定すると案内している(カスタマイザー=クラシックテーマ)。無料版もWordPress.org掲載なし・公式サイトで配布 |
| Cocoon | 公式が「子テーマで上書きカスタマイズ利用できるテンプレートの場所」としてPHPテンプレートを案内している。親テーマ直下にWordPress標準のテンプレートファイルを置く構成(無料・WordPress.org掲載なし・公式サイトで配布) |
| Nishiki | AnimaGate。Block themes タグがなく、「外観 → カスタマイズ」で設定する(無料・WordPress.org掲載) |
| LIQUID | リキッドデザイン。Block themes タグがなく、Custom background Custom header Footer widgets などクラシックテーマのタグが付く(無料・WordPress.org掲載)。下のLIQUID PRESSとは別のテーマです。 |
| LIQUID PRESS | リキッドデザイン。MAGAZINE・CORPORATE ほか。公式サイトが「ブロックエディター対応ハイブリッドテーマです。」と明記。設定はカスタマイザーとウィジェット(有料・WordPress.org掲載なし・公式サイトで配布)。上のLIQUID(無料)とは別の製品です。 |
| AFFINGER | 親テーマの header.php をコピーする手順が複数の解説で共通している(公式ドキュメントでは未確認)(WordPress.org掲載なし・公式サイトで配布) |
| Lightning | Vektor。Block themes タグがなく、Footer widgets Theme options Custom background などクラシックテーマのタグが付く。作者はX-T9と同じ Hidekazu Ishikawa(無料・WordPress.org掲載) |
| EasyChic | 369work。Block themes タグがなく、right sidebar などクラシックテーマのタグが付く(無料・WordPress.org掲載) |
| Movaone | 369work。Block themes タグがなく、custom header などクラシックテーマのタグが付く(無料・WordPress.org掲載) |
最後の2本は、当サイトを運営する369workのテーマです。ブロックテーマを中心に作っていますが、クラシックテーマも出しています。この記事の基準は自分たちにもそのまま当てはまるので、同じように分類しました。
分類は本記事作成時点のものです。テーマは更新されるため、最新の状態は各公式サイトでご確認ください。
各開発元は、正しく説明している
ここが大事なところです。上に挙げたテーマの開発元は、どこも自分の製品を偽っていません。それどころか、国内の主要な開発元は、クラシックテーマとブロックテーマを別々の製品として作り分けています。
| 開発元 | クラシックテーマ | ブロックテーマ |
|---|---|---|
| Vektor | Lightning | X-T9 |
| Monkey Wrench | Snow Monkey | unitone |
| AnimaGate | Nishiki | Hakoniwa |
| リキッドデザイン | LIQUID(無料)/ LIQUID PRESS(有料・ハイブリッド) | LIQUID AIR・PRESS BLOCK |
| 369work | EasyChic・Movaone | Abira・Blanky ほか |
独立した5つの開発元が、同じことをしています。「クラシックテーマがブロック対応で進化した」のではなく、別の製品として作り直しているということです。業界自身が別物として扱っている、何よりの証拠だと言えます。
分かりやすいのがAnimaGateの例です。同じ作者による Hakoniwa と Nishiki は、WordPress.org公式ディレクトリで Block themes タグの有無が分かれています。2つのページを開き比べるだけで確認できます。
リキッドデザインの LIQUID AIR と LIQUID も、まったく同じ関係です。どちらも同じ作者がWordPress.orgで配布していますが、Block themes タグが付くのは LIQUID AIR だけ。LIQUID には Custom background Custom header Footer widgets が付きます。名前が1語違うだけなので、こちらのほうが取り違えやすい組み合わせです。同社はさらに、ハイブリッドテーマには「ブロックエディター対応ハイブリッドテーマ」、ブロックテーマには「フルサイト編集対応ブロックテーマ」と、公式サイトでも言葉を書き分けています。
つまり、混同が起きているのは開発元ではなく、それを紹介する記事の側だということです。
国産ブロックテーマは、まだ数えるほどしかない
調べて分かったのは、国産のブロックテーマを出している開発元が、まだ非常に少ないということです。
| 開発元 | ブロックテーマ |
|---|---|
| Vektor | X-T9(無料) |
| Monkey Wrench | unitone(公式サイトから配布) |
| AnimaGate | Hakoniwa(無料) |
| FUJI PRODUCTION | REALIZER(無料) |
| リキッドデザイン | LIQUID AIR(無料)/ PRESS BLOCK(有料) |
| 369work | Abira・Blanky・Enyoi・Mobiki(無料)/ Abira Academy・Blankyシリーズ(有料) |
国内で名前の知られたテーマの多くがクラシックテーマである以上、サイトエディターでサイト全体を編集したい人の選択肢は、実質この範囲に限られます。海外製のブロックテーマまで広げれば数は増えますが、今度は日本語表示の問題が出てきます。
では、どのブロックテーマを選べばいいか
選択肢が限られるとはいえ、上に挙げたテーマはそれぞれ狙っているものが違います。名前から選ぶより、やりたいことから逆に引くほうが早いので、各開発元が公式に何と説明しているかをもとに整理しました。ここに書いた根拠は、すべて各社の公式サイトまたはWordPress.org公式ディレクトリの記載です。
| やりたいこと | 向いているテーマ | そう言える根拠 |
|---|---|---|
| まず費用をかけずに試したい | X-T9/Hakoniwa/REALIZER/LIQUID AIR/Abira・Blanky・Enyoi・Mobiki | いずれも無料で、WordPress.org公式ディレクトリに掲載されている。管理画面の「外観 → テーマ → 新規追加」から名前で検索してそのまま導入できる |
| 企業・ビジネスサイトを作る | X-T9 | 公式の説明に「This theme is mainly intended for use on business sites.(主にビジネスサイトでの利用を想定)」と明記 |
| レイアウトを自分で細かく組みたい | unitone | 公式サイトが「Every Layout」の設計論を全面採用と説明。ブレイクポイントではなくコンテンツを基準に表示が変わる仕組みで、文字サイズは調和数列・余白はフィボナッチ数列に基づく |
| はじめてで、迷わず作りたい | REALIZER | 公式の説明に「recommended for WordPress beginners(WordPress初心者におすすめ)」と明記。あわせて受託制作での利用にも言及がある |
| ブログをカラム構成で組みたい | Hakoniwa | WordPress.orgのタグに Blog Grid layout Two columns Three columns が付いており、カラム構成の選択肢が多い |
| とにかくシンプルな見た目にしたい | LIQUID AIR | 公式の説明に「perfect for simple designs(シンプルなデザインに最適)」と明記 |
| アクセシビリティ審査を通ったものを使いたい | Abira | WordPress.orgの Accessibility ready タグが付いている。このタグは手動審査に合格しないと付かず、合格するまでテーマ自体が公開されない(Theme Handbook)。ただし公式は「WCAG AAレベルを満たす意味ではなく、レビューチームが定めた最低基準を満たすということ」と明記しています |
| 白紙から自分の色で作りたい | Abira/Blanky | 公式の説明が「minimal block starter theme(最小構成のスターターテーマ)」「simple blank canvas(白紙のキャンバス)」。装飾を剥がす手間がない |
| 用途を選ばず使える有料テーマがほしい | LIQUID PRESS BLOCK | 公式サイトが「フルサイト編集対応ブロックテーマ」「新標準オールラウンドテーマ」と説明。特定の業種に寄せず、汎用の土台として作られている |
| 店舗・美容室・サロン | Enyoi(無料)/Blanky Beauty(有料) | Enyoiは公式の説明が「salons, clinics and small business sites」で、予約用のパターンが同梱。Blanky Beautyは商品ページの向いている用途が「店舗・サロン」 |
| 作品・写真を見せたい | Mobiki(無料)/Blanky Studio(有料) | Mobikiは公式の説明が「mobile-first portfolio theme(モバイル優先のポートフォリオテーマ)」。Blanky Studioは商品ページの向いている用途が「ポートフォリオ」「クリエイター」で、ギャラリー表示に対応 |
| 塾・教室・スクール | Abira Academy(有料) | 商品ページの向いている用途が「塾・スクール」。カード型の一覧を備える |
| 士業・コンサル事務所 | Blanky Work(有料) | 商品ページの向いている用途が「士業・コンサル」「コーポレート」。サービス紹介の構成を備える |
まず無料のもので試してみるのが、いちばん確実です。ブロックテーマはサイトエディターの操作感がクラシックテーマとかなり違うので、文章で読むより、一度触って肌に合うか確かめたほうが早く判断できます。上の表の無料テーマは8本ともWordPress.orgに掲載されているので、管理画面の「外観 → テーマ → 新規追加」から名前で検索すればそのまま入ります。
そのうえで、業種ごとの構成を一から組む時間を省きたい場合に、有料テーマが選択肢に入ります。無料テーマは土台なので、メニュー表や料金表、予約への導線は自分で組み立てることになります。そこを最初から用意しておくのが有料テーマの役割です。逆に言えば、時間をかけて自分で組むつもりがあるなら、無料のままで十分に作れます。
有料テーマを選ぶときの判断材料として、WordPress.orgが公開しているCommercially Supported GPL Themes(有料サポート付きGPLテーマ)の一覧があります。100%GPLで配布していること、公式ディレクトリに現役で保守しているテーマがあること、専門的なサポート窓口があることなどが掲載の条件です。この記事で挙げた開発元のうち、掲載されているのはリキッドデザイン(LIQUID PRESS)と、当サイトを運営する369workの2社です。
ここに挙げた用途は、各開発元が公式に説明している範囲をまとめたものです。テーマは更新されますし、価格や仕様も改定されます。導入前に各公式サイトで最新の内容をご確認ください(369Themeの有料ブロックテーマ一覧)。
まとめ
- ブロックテーマかどうかは
templates/index.htmlがあるかで決まる。WordPress公式の定義 - 一番かんたんな確認方法は管理画面の「外観」メニューを見ること。「カスタマイズ/ウィジェット/メニュー」があればクラシックテーマ
- 「ブロックエディター対応」「ハイブリッドテーマ」はブロックテーマではない
functions.phpやBlock editor stylesタグは判定に使えない。どちらにも存在する- 国内の主要な開発元はクラシックとブロックを別製品として作り分けている
- 国産ブロックテーマは数が限られるので、テーマ名より先に「何を作りたいか」から選ぶほうが早い
使っているテーマがブロックテーマかどうかは、これで判定できます。次に迷うのは「では、どれを選ぶか」だと思います。上の選び方の表で用途からあたりを付けたうえで、日本語表示の確認ポイントまで踏み込みたい場合は、ブロックテーマを日本語で使うなら|おすすめWordPressテーマ12種で、日本語環境で見落としやすい点と、369Themeの各テーマを業種別に紹介しています。
テーマ選びではなく、いま使っているサイトで起きている不具合を解決したい場合は、エラー対応の記事一覧もご利用ください。