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公式テーマ（無料） | 有料テーマ |
| 費用 | 無料 | 1万円〜3万円程度の買い切り型、または月額/年額のサブスクリプション型が多い |
| 機能・カスタマイズ性 | シンプルで基本的な機能に限定されることが多い。高度な機能はプラグインで補う必要がある。 | 多機能で、ドラッグ＆ドロップビルダーや豊富なレイアウトオプションなど、高度なカスタマイズ機能が組み込まれていることが多い。 |
| デザイン | シンプルで、他のサイトとデザインが似る可能性がある。 | プロフェッショナルで高品質なデザインが多く、独自性を出しやすい。特定の業種に特化したテーマもある。 |
| サポート | 公式フォーラムなど、コミュニティベースのサポートが中心で、個別対応は期待できないことが多い。 | テーマ開発者による専門的なサポート（メール、チャットなど）が提供されることが多く、初心者には安心。 |
| アップデート | 公式ディレクトリに登録されているため、セキュリティや互換性のチェックはされているが、機能追加の頻度はテーマによる。 | 定期的なアップデートがあり、最新のWordPressやプラグインとの互換性、セキュリティ対策がより迅速に行われる傾向がある。 |
| コードの品質・安全性 | 公式テーマは厳格な審査基準をクリアしているため、一定の品質・安全性は担保されている。 | 評判の良いテーマは高品質だが、中にはコードが複雑すぎたり、セキュリティに問題があるものも存在する可能性があるため、選定に注意が必要。 |
| SEO対応 | 基本的なSEO対策はされているが、高度な最適化はプラグインに依存することが多い。 | 内部SEOが最適化されているテーマが多い。 |
まとめと推奨
| あなたの状況 | 推奨されるテーマ |
| 予算をかけたくない、個人ブログ、シンプルなサイトで十分、自分でカスタマイズできる知識がある | 公式テーマ（無料） |
| ビジネスサイトや本格的なサイトを構築したい、デザインの独自性を出したい、豊富な機能やカスタマイズ性が欲しい、初心者でサポートが必要、時間と労力を節約したい | 有料テーマ |
最終的には、あなたのサイトの目的、予算、求める機能、そしてウェブサイト構築のスキルレベルに応じて、最適なテーマを選択することが重要です。有料テーマを選ぶ場合は、評判やサポート体制、アップデートの頻度をしっかり確認することをお勧めします。
| テーマ名 | 主な特徴・強み | 適したサイト |
| ザ・トール (THE THOR) | 国内最高クラスのSEO最適化と高速表示 プロ仕様の美しいデザインを簡単に実現（着せ替え機能あり） アフィリエイトに役立つランキング作成機能やCTAが充実<記事装飾機能が豊富で、読みやすいコンテンツ作成を支援 | アフィリエイトブログ、本格的なメディアサイト、集客を重視するビジネスサイト |
| エマノン (Emanon) | Web集客・ビジネス利用に特化した機能が豊富 CTA（行動喚起）、LP（ランディングページ）、メルマガ専用ページなどを簡単に作成 企業サイト、オウンドメディアに適したデザイン WooCommerce対応でネットショップにも利用可能（Premium） | コーポレートサイト、企業ブログ、オウンドメディア、リード獲得を目的としたビジネスサイト |
| ストークSE (STORK SE) | 「誰が使っても美しいデザイン」を追求したモバイルファースト設計 シングルカラム（1カラム）レイアウトに特化し、コンテンツへの集中度が高い ブロックエディタに最適化され、直感的な操作が可能 シンプルかつ洗練されたデザインで、汎用性が高い | 商品・サービスのブランディングサイト、ミニマルな企業サイト、シンプルで美しいブログ |
| リキッドプレス (LIQUID PRESS) | 用途別に豊富なテーマ（マガジン、コーポレートなど）が用意されている 高いSEO対策と構造化データ対応 多言語対応機能（LIQUID CORPORATEなど） カスタマイザーでの直感的な編集が可能 | メディアサイト（ブログ）、多言語対応が必要な企業サイト、目的に合わせたテーマを選びたいサイト |
補足情報
- ザ・トール: SEOと収益化を最重視する設計で、アフィリエイターやブロガーに人気が高いテーマです。
- エマノン: 特にBtoBやサービス業など、Webからの顧客獲得（リードジェネレーション）を重視するビジネスサイト構築に適しています。
- ストークSE: モバイルでの見やすさに徹底的にこだわり、余計な装飾を排したデザインが特徴です。商品の魅力を際立たせたいサイトにも向いています。
- リキッドプレス: 豊富なラインナップの中から目的特化型のテーマを選べるのが大きなメリットです。例えば、ニュースサイトならLIQUID MAGAZINE、企業サイトならLIQUID CORPORATEなどがあります。
