Twenty Twenty-FourはWordPress 6.4の新しいデフォルトテーマ

目次
Twenty Twenty-Fourとは
Twenty Twenty-Fourは、WordPress 6.4と同時にリリースされたデフォルトテーマです。これまでのデフォルトテーマとは異なり、特定の用途に特化するのではなく、多様なウェブサイトに対応できる汎用性の高いブロックテーマとして設計されています。
主な特徴は以下の通りです。
主な特徴
- フルサイト編集 (Full Site Editing) に完全対応: WordPress 5.9以降で導入された「サイトエディタ」を最大限に活用し、ヘッダー、フッター、固定ページコンテンツなど、ウェブサイト全体のあらゆる要素をブロックで編集できます。これにより、細部にわたるデザインのカスタマイズが容易になります。
- 豊富なパターンとテンプレート: これまでのデフォルトテーマの中で最も多くのブロックパターンを搭載しています。ビジネスオーナー、フォトグラファーやアーティスト、ブロガーやライターなど、さまざまなユーザーのニーズに合わせたテンプレートやフルページデザインが用意されており、サイト構築のプロセスを大幅にスピードアップできます。
- 例: 「About」ページ、ポートフォリオ、ブログの投稿一覧、お問い合わせフォーム、チームメンバーの紹介、お客様の声など。
- スタイルバリエーション: 複数のスタイルバリエーションが用意されており、色やタイポグラフィを簡単に切り替えることができます。これにより、デザインの雰囲気を手軽に変更し、サイトのブランドイメージに合わせることが可能です。
- 柔軟なフォント設定: デフォルトでは「Cardo」(見出し)とシステムフォントのサンセリフ体(本文)が使用されていますが、「Inter」や「Jost」、「Instrument Sans」などの代替フォントも選択できます。また、ブラウザの表示領域に応じてフォントサイズが変化する「流体タイポグラフィ(Fluid typography)」も採用されています。
- アクセシビリティ対応: アクセシビリティに配慮した設計がされており、より多くのユーザーが利用しやすいウェブサイトを構築できます。
- レスポンシブデザイン: あらゆるデバイスで適切に表示されるよう、レスポンシブデザインに対応しています。
Twenty Twenty-Fourが想定する主なユーザー
Twenty Twenty-Fourは、特に以下の3つのタイプのユーザーを念頭に置いてデザインされています。
- 小規模ビジネスオーナー
- フォトグラファーやアーティスト
- ライターやブロガー
これらのユーザーが、専門知識がなくても簡単にプロフェッショナルなウェブサイトを構築できるよう、機能が充実しています。
Twenty Twenty-Fourは、サイトエディタとブロックパターンの強力な組み合わせにより、コーディングの知識がなくても、ドラッグ&ドロップでサイトを構築できるというWordPressの新しい方向性を示すテーマと言えるでしょう。
Twenty Twenty-Fourの使い方
WordPress のデフォルトテーマである Twenty Twenty-Four は、WordPress 5.9 から導入された「サイトエディター(フルサイト編集)」機能を最大限に活用するように設計されたブロックテーマです。これにより、従来のテーマカスタマイザーに頼らず、サイト全体をブロックで編集・カスタマイズできます。
Twenty Twenty-Four の主な使い方と特徴は以下の通りです。
1. サイトエディター(フルサイト編集)によるカスタマイズ
Twenty Twenty-Four は、サイトのヘッダー、フッター、コンテンツエリアなど、すべての要素をブロックで編集できる「サイトエディター」を使用します。
- アクセス方法: WordPress ダッシュボードの「外観」→「エディター」からアクセスできます。
- テンプレートの編集: 「すべてのアーカイブ」「ブログホーム」「ページ」などのテンプレートを編集して、各ページのレイアウトをデザインできます。例えば、固定ページのテンプレートを「タイトルなし」や「サイドバー付き」などに変更することも可能です。
- ヘッダーとフッターの編集: ヘッダーにはロゴやサイトタイトル、ナビゲーションメニュー、フッターには著作権情報などをブロックとして配置し、直接編集できます。ナビゲーションメニューには、既存のページへのリンクや、検索ボックスなどのブロックを追加できます。
- テンプレートパーツの活用: ヘッダーやフッターなど、サイト内で繰り返し使用する部分を「テンプレートパーツ」として保存し、再利用することで効率的にサイトを構築できます。
2. ブロックパターンを活用したデザイン
Twenty Twenty-Four には、あらかじめデザインされた様々な「ブロックパターン」が豊富に用意されています。これらを活用することで、簡単に魅力的なページを作成できます。
- ページ作成時のパターン選択: 新しいページや投稿を作成する際に、白紙の状態から始めるのではなく、用意されたフルページパターン(例:About ページ、ブログホーム、ポートフォリオホームなど)を選択して挿入できます。
- 部分的なパターンの追加: 記事やページの途中に、特定の機能を持つブロックの組み合わせ(例:お問い合わせセクション、チームメンバー紹介、ギャラリーなど)をパターンとして挿入することも可能です。
- パターンの保存と再利用: 自分で作成したブロックの組み合わせを「パターン」として保存し、後で再利用することもできます。
3. スタイルバリエーションによる全体的なデザイン変更
Twenty Twenty-Four には、サイト全体の配色やフォントなどを一括で変更できる「スタイルバリエーション」が用意されています。
- スタイルの選択: サイトエディターの「スタイル」パネルから、プリセットされたスタイルバリエーション(例:Default、Onyx、Mint、Rustなど)を選択するだけで、サイトの見た目をガラッと変えることができます。
- 個別のカスタマイズ: スタイルバリエーションを選択した後でも、特定のブロックや要素の色、フォント、タイポグラフィなどを個別に調整することが可能です。Twenty Twenty-Four では、Inter や Cardo といったフォントがデフォルトで利用できます。
4. その他の特徴
- 柔軟性と汎用性: ビジネス、ポートフォリオ、ブログなど、様々なタイプのウェブサイトに対応できるように設計されています。
- レスポンシブ対応: あらゆるデバイスで適切に表示されるように設計されています。
- Fluid typography(流体タイポグラフィ): ブラウザの表示領域に応じてフォントサイズが変化し、より柔軟な表示が可能です。
- ブロックバリエーション: リストのチェックマーク、ナビゲーションリンクの矢印、見出しのアスタリスクなど、特定のブロックにバリエーションが追加されています。
基本的な使い方フロー
- Twenty Twenty-Four を有効化する: WordPress ダッシュボードの「外観」→「テーマ」から Twenty Twenty-Four を有効化します。
- サイトエディターを開く: 「外観」→「エディター」をクリックしてサイトエディターに入ります。
- グローバルスタイルの設定: サイト全体のフォント、色、レイアウトなどを設定したい場合は、「スタイル」アイコンをクリックして、スタイルバリエーションを選択したり、個別の設定を調整したりします。
- テンプレートの編集: 「テンプレート」タブから、編集したいテンプレート(例:ページ、ブログホームなど)を選択し、ヘッダー、フッター、メインコンテンツなどをブロックで編集します。
- 新しいページや投稿の作成: 「固定ページ」または「投稿」で新規追加を行い、ブロックエディターでコンテンツを作成します。この際、フルページパターンを挿入してカスタマイズすることもできます。
- ブロックパターンの活用: 必要に応じて、ブロックインサーター(「+」ボタン)からブロックパターンを挿入します。
- 保存: 変更を保存するには、画面右上の「保存」ボタンをクリックします。
Twenty Twenty-Four は、WordPress のフルサイト編集機能を学ぶのに最適なテーマです。ブロックエディターに慣れることで、より自由にサイトをデザインできるようになるでしょう。
Twenty Twenty-Fourの注意点
WordPressのデフォルトテーマであるTwenty Twenty-Fourは、ブロックエディターに特化した「フルサイト編集」を前提に設計されており、多くの利点がある一方で、従来のWordPressのカスタマイズに慣れている方にとっては注意すべき点もあります。
以下に主な注意点を挙げます。
1. フルサイト編集への慣れが必要
- 従来のカスタマイザーとは異なる: Twenty Twenty-Fourは、サイト全体のデザインをブロックエディターで編集する「フルサイト編集」が中心です。従来のテーマカスタマイザー(外観 > カスタマイズ)では設定できない項目が多く、慣れるまでに時間がかかる可能性があります。
- ブロックエディターの理解: サイトの構造、ヘッダー、フッター、テンプレートなどをブロックとして捉え、ブロックエディターで編集していくことになります。ブロックの概念や操作に慣れることが重要です。
- テーマユニットテストデータとの相違: フルサイト編集は、既存のコンテンツをテーマに合うように調整するのではなく、テーマのテンプレートにコンテンツを流し込む形になります。既存サイトからの移行や、テーマユニットテストデータを使用する際に、表示崩れや意図しないレイアウトになる可能性があります。
2. 子テーマの作成・カスタマイズ方法の変化
- PHPファイルの直接編集は避ける: 従来のテーマのように
header.phpやfooter.phpなどのPHPファイルを直接編集してカスタマイズすることは推奨されません。テーマのアップデート時に変更が上書きされるリスクが高まります。 - テンプレートやテンプレートパーツの編集: 基本的には、フルサイト編集のサイトエディター内でテンプレートやテンプレートパーツを編集・作成することでカスタマイズを行います。
- functions.phpの役割: 特定の機能を追加したい場合は、子テーマの
functions.phpを利用することになりますが、デザインのカスタマイズは主にサイトエディターで行います。
3. プラグインとの相性
- フルサイト編集対応プラグインの確認: フルサイト編集に完全に対応していないプラグインを使用すると、予期せぬ表示崩れや機能不全が発生する可能性があります。使用したいプラグインがフルサイト編集に対応しているか確認が必要です。
- ブロックベースのプラグインが推奨: レイアウトやコンテンツの追加には、ブロックベースのプラグイン(例: Pattern Libraryを提供するプラグイン)がよりスムーズに連携できます。
4. SEO対策とパフォーマンス
- 初期設定の確認: 必要に応じて、サイトタイトル、キャッチフレーズ、ディスクリプションなどの初期設定が適切に行われているか確認が必要です。
- 画像の最適化: フルサイト編集は画像が多くなりがちなので、画像の最適化(圧縮、適切なサイズ設定)はパフォーマンス向上に不可欠です。
- キャッシュプラグインの活用: サイトの表示速度を向上させるために、キャッシュプラグインの導入を検討しましょう。
5. 既存サイトからの移行
- バックアップの重要性: テーマ変更前に必ずサイト全体のバックアップを取ってください。
- 段階的な移行: 既存サイトのデザインが大きく異なる場合は、テスト環境で十分に確認してから本番環境に適用することをおすすめします。
まとめ
Twenty Twenty-Fourは、今後のWordPressの主流となる「フルサイト編集」を体験・習得するための素晴らしいテーマです。しかし、従来のカスタマイズ方法に慣れていると戸惑うこともあるかもしれません。
これらの注意点を踏まえ、フルサイト編集の概念を理解し、ブロックエディターの操作に慣れることで、Twenty Twenty-Fourの持つ柔軟性と可能性を最大限に引き出すことができるでしょう。
公式テーマと無料テーマのメリット・デメリット
WordPressのテーマを選ぶ際の参考になるよう、公式テーマと無料テーマ(公式ディレクトリ外のものも含む一般的な無料テーマ)の主なメリットとデメリットを比較表にまとめました。
| 項目 | ✅ 公式テーマ (WordPress.org 公式ディレクトリのもの) | ⚠️ 一般的な無料テーマ (サードパーティ製、公式外を含む) |
| 信頼性・安全性 | ✅ 高い:厳しい審査基準を満たしており、セキュリティの懸念が少ない。 | 🔻 低い場合がある:作成者や配布元が不明確な場合、セキュリティリスクや悪意のあるコード(マルウェア)が含まれる可能性がある。 |
| 品質・安定性 | ✅ 高い:WordPressのコーディング標準に準拠しており、動作が安定している。 | ⚠️ ばらつきがある:質の高いものもあるが、コーディングが不適切でサイトの動作を不安定にしたり、表示崩れを起こしたりすることがある。 |
| サポート | ⚠️ 基本的になし:公式フォーラムでのコミュニティサポートが主。開発元による個別サポートはないことが多い。 | ⚠️ 基本的になし:個人開発の場合が多く、突然サポートが終了したり、連絡が取れなくなったりすることがある。 |
| アップデート | ✅ 定期的な更新:セキュリティ修正やWordPress本体のバージョンアップへの対応が比較的速い。 | 🔻 不定期:開発が停止すると、セキュリティリスクが残り、将来的に利用できなくなる可能性がある。 |
| 機能性・デザイン | ⚠️ シンプル:多機能すぎず、カスタマイズの土台として使いやすいように設計されているものが多い。 | ✅ 多機能・デザインが豊富:すぐに使えるように多くの機能やデザインが盛り込まれていることが多い。 |
| カスタマイズ性 | ✅ 高い:子テーマの作成や独自のカスタマイズをしやすいよう配慮されていることが多い。 | 🔻 低い場合がある:独自の機能やフレームワークを使用しており、コードを理解しないとカスタマイズが難しいことがある。 |
| 広告・リンク | ✅ なし:不必要な広告や作成者へのリンクが強制的に挿入されることはない。 | 🔻 ある場合がある:テーマ作成者への非表示にできないクレジットリンクや、勝手に広告が表示されることがある。 |
選ぶ際のポイント
- 安全性を最優先するなら: WordPress.org 公式ディレクトリで配布されている公式テーマを選ぶことを強く推奨します。
- デザインや特定の機能を重視するなら: 信頼できる開発元が提供しており、レビューが多く、定期的に更新されているか確認した上で、一般的な無料テーマを検討しましょう。
- 無料テーマはあくまで自己責任: 公式ディレクトリ外のテーマを使用する場合は、セキュリティとアップデート状況を自己責任で注意深く管理する必要があります。
有料テーマのメリットとデメリット
有料テーマには、無料テーマにはない多くのメリットがありますが、いくつかのデメリットもあります。主なポイントを以下の表にまとめました。
| 特徴 | メリット (Pros) | デメリット (Cons) |
| 費用 | 最初に買い切りで購入すれば、その後は費用がかからないものが多い。デザイン外注などに比べると費用を抑えられる。 | 初期費用がかかる (一般的に5,000円〜20,000円程度)。月額制のテーマもある。 |
| デザイン・品質 | プロ仕様の高品質なデザインを簡単に実現できる。デザイン性が高く、独自性を出しやすい。 | 他のサイトと同じテーマを使っている場合、オリジナリティに欠ける可能性がある。 |
| 機能・SEO | 豊富な機能が標準搭載されている (例: アフィリエイト機能、広告管理機能)。内部SEO対策が最適化されているものが多い。 | 設定項目が多すぎて、特に初心者には機能を全て把握しきれない、または使いこなすのが難しい場合がある。 |
| カスタマイズ性 | コード知識なしでレイアウト変更や機能追加がしやすく、カスタマイズ性が高い。 | 高機能ゆえに、テーマ特有の機能とプラグインが競合する可能性がある。 |
| サポート | 開発元によるサポート体制が充実している (マニュアル、メールサポートなど)。トラブル発生時に安心。 | テーマのサポートが将来的に終了する可能性があり、WordPress本体のアップデートに対応しなくなるリスクがある。 |
| サイト運営 | デザインや機能の構築に時間をかけず、コンテンツ作成に集中できる。 | 一度テーマを選ぶと、テーマ固有の設定が多いため、後からテーマを変更する作業が大変になることがある。 |
まとめとアドバイス
- 初心者の方やサイト運営に集中したい方には、最初からデザインや機能が整っている有料テーマが特におすすめです。時間と労力を節約でき、結果的に効率的になることが多いです。
- 有料テーマを選ぶ際は、価格の安さだけでなく、デザイン性・機能性・操作性、そしてご自身のサイトの運用目的にマッチしているかを総合的に判断することが重要です。
WordPressテーマ目的別比較表
WordPressテーマを選ぶにはデザインだけでなく、汎用性、アップデートの継続性、サポート体制、そして表示速度やSEO対策の強さといった要素を総合的に考慮することが重要です。目的にあった長く安心して使えるテーマを選ぶようにしたいものです。そこで、目的別に整理したWordPressテーマ比較表を以下にまとめました。 各テーマの特徴や利用目的を簡潔に比較できるようにしています。
| テーマ名 | 主な目的・特徴 | 適した用途 |
|---|---|---|
| RE:DIVER(リダイバー) | 高速表示・SEO最適化に強い。アフィリエイトや収益化を意識した設計。 | アフィリエイトブログ、収益化重視の個人ブログ |
| GOLD BLOG(ゴールドブログ) | ブログ運営に特化。シンプルで使いやすく、初心者でも扱いやすい。 | 個人ブログ、情報発信サイト |
| THE THOR(ザ・トール) | SEO・デザイン・収益化機能を網羅したオールインワンテーマ。広告管理やランキング機能も搭載。 | アフィリエイト、企業サイト、収益化ブログ |
| Emanon(エマノン) | ビジネス向けデザイン。企業サイトやサービス紹介に適したテーマ。 | コーポレートサイト、サービス紹介ページ |
| LIQUID PRESS(リキッドプレス) | WordPress公式登録の国産テーマ。企業サイトからブログまで幅広く対応。初心者でも安心。 | 企業サイト、オウンドメディア、ブログ、LP |
| STORK SE(ストークSE) | モバイルファースト設計。1カラムデザインでコンテンツを際立たせる。直感的操作が可能。 | ブログ、アフィリエイト、ブランディングサイト |
| GOLD MEDIA(ゴールドメディア) | メディア運営に特化。SEO内部構造が強力で、収益化や効率的な運営を支援。 | WEBメディア、アフィリエイトサイト、企業サイト |








