Twenty Twentyの特徴と使い方を徹底解説：Gutenbergに最適化されたWordPressテーマの魅力と注意点

WordPressのデフォルトテーマ「Twenty Twenty」を徹底解説。ブロックエディター（Gutenberg）への完全対応や、シンプルで洗練されたデザインの特徴、具体的な使い方からカスタマイズの注意点まで、初心者にも分かりやすく紹介します。

Twenty Twentyとは

WordPressテーマ「Twenty Twenty」は、WordPress 5.3のデフォルトテーマとして2019年11月12日にリリースされました。

このテーマは、ブロックエディター（Gutenberg）の柔軟性を最大限に活用するように設計されています。特に、ビジネスや組織のウェブサイトで、サービスや製品を魅力的に見せるための動的なレイアウトを簡単に作成できる点が特徴です。

Twenty Twentyの主な特徴

• ブロックエディターへの完全対応: ブロックエディターの全幅エディタースタイルに対応しており、エディターでの見た目が実際のサイトとほとんど変わらないため、コンテンツ作成が直感的に行えます。
• シンプルなデザイン: 無駄を省いたミニマルなデザインで、コンテンツそのものを際立たせます。
• カスタマイズ性:
  • サイトロゴ: ビジネスロゴやアバターとして表示できるサイトロゴ設定があります。
  • カラーオプション: 背景色やアクセントカラーを変更できます。選択した色に基づいて、サイト上のすべての要素の色が自動的に調整され、高いコントラストが保たれるよう設計されています。
  • メニューオプション: デスクトップ向けに、常に表示される伝統的な横並びのメニューと、メニューボタンに隠れる拡張可能なメニューの2種類を選べます。
• カバーテンプレート: アイキャッチ画像上に投稿のタイトルを表示する「カバーテンプレート」と呼ばれるページテンプレートが含まれています。
• 多言語対応: WordPressコミュニティからのフィードバックにより、多くの言語で最適なスタイルが含まれています。

Twenty Twentyは、WordPressがブロックエディターを主要な編集ツールとして推進していく中で、その能力を示すための基盤となるテーマとして開発されました。現在もメンテナンスされており、最新のWordPress環境でも問題なく利用できます。

Twenty Twentyの使い方

「Twenty Twenty」は、WordPress 5.3以降に標準搭載されている公式テーマです。ブロックエディタ（Gutenberg）に最適化されており、シンプルながらもカスタマイズ性の高いデザインが特徴です。

Twenty Twentyの基本的な使い方とカスタマイズ方法について説明します。

Twenty Twentyの有効化

1. WordPress管理画面にログインします。
2. 「外観」>「テーマ」に移動します。
3. 「Twenty Twenty」テーマを見つけ、「有効化」をクリックします。

Twenty Twentyの主な特徴と使い方

Twenty Twentyは、以下の主要な要素で構成されています。

1. サイトタイトルとキャッチフレーズ:
   • 「カスタマイズ」>「サイト基本情報」で設定できます。サイトの顔となる部分なので、分かりやすく設定しましょう。
2. ヘッダー:
   • Twenty Twentyのヘッダーは、サイトタイトル、キャッチフレーズ、そして必要に応じてロゴ画像を表示できます。「カスタマイズ」>「ヘッダー」から設定可能です。
3. ナビゲーションメニュー:
   • メインメニューは、ヘッダーの下に表示されます。「外観」>「メニュー」でメニューを作成し、「メニュー設定」の「ヘッダー」に割り当てることで表示されます。必要に応じてフッターメニューなども設定できます。
4. コンテンツエリア:
   • 投稿や固定ページの内容が表示されるメインの部分です。Twenty Twentyはブロックエディタに最適化されているため、ブロックを効果的に活用することで、柔軟なレイアウトが可能です。
5. サイドバー:
   • Twenty Twentyにはデフォルトでサイドバーがありません。ウィジェットを表示したい場合は、フッターに表示される「フッター1」と「フッター2」のウィジェットエリアを使用します。「外観」>「ウィジェット」から設定できます。
6. フッター:
   • 著作権情報や、先述のウィジェットエリアが表示されます。「カスタマイズ」>「フッター」から調整できます。

Twenty Twentyのカスタマイズ

Twenty Twentyは、WordPressのカスタマイザー（「外観」>「カスタマイズ」）から、多くの設定を変更できます。

1. サイト基本情報:
   • サイトのタイトル、キャッチフレーズ、サイトアイコンの設定。
2. 色:
   • 背景色、リンクの色、プライマリ色など、サイト全体の配色を変更できます。特にプライマリ色は、見出しやボタンの色に影響します。
3. メディアヘッダー:
   • ヘッダー部分に画像や動画を表示できます。
4. メニュー:
   • グローバルナビゲーション（ヘッダーメニュー）、フッターメニューなどの設定。
5. ウィジェット:
   • フッターのウィジェットエリアに表示するコンテンツ（テキスト、最近の投稿、カテゴリなど）を設定。
6. ホームページ設定:
   • トップページを「最新の投稿」にするか、固定ページにするかの設定。
7. CSSを追加:
   • 独自のCSSコードを追加して、さらに細かくデザインを調整できます。

ブロックエディタ（Gutenberg）の活用

Twenty Twentyはブロックエディタに最適化されているため、ブロックを最大限に活用することが重要です。

• グループブロック: 複数のブロックをまとめることで、レイアウトの調整がしやすくなります。
• カラムブロック: 記事内で複数のカラムを作成し、情報を整理して表示できます。
• メディアとテキストブロック: 画像とテキストを並べて表示するのに便利です。
• カバーブロック: 全幅の背景画像の上にテキストを重ねて表示するなど、インパクトのあるセクションを作成できます。
• 再利用ブロック: よく使うブロックの組み合わせを登録しておき、簡単に再利用できます。

その他のヒント

• 子テーマの利用: Twenty Twentyを大きくカスタマイズしたい場合は、直接テーマファイルを編集するのではなく、子テーマを作成してカスタマイズすることをお勧めします。これにより、テーマのアップデート時にカスタマイズ内容が失われるのを防げます。
• プラグインの活用: Twenty Twentyはシンプルであるため、機能を追加したい場合は、WordPressプラグインを活用します。例えば、お問い合わせフォーム、SEO対策、画像最適化など、様々なプラグインがあります。
• デモサイトの確認: Twenty Twentyの公式デモサイトや、他のTwenty Twentyを利用しているサイトを参考にすると、カスタマイズのヒントが得られます。

Twenty Twentyは、シンプルであるがゆえに、使い方次第で多様なサイトを構築できる柔軟性を持っています。ブロックエディタの機能を理解し、カスタマイザーを使いこなすことで、目的に合ったウェブサイトを作成できるでしょう。

Twenty Twentyの注意点

WordPress のデフォルトテーマである Twenty Twenty は、シンプルでミニマリストなデザインが特徴で、ブロックエディタの機能を最大限に活用できるように設計されています。しかし、利用にあたっていくつか注意点があります。

Twenty Twenty の主な注意点

1. カスタマイズ性の低さ（初期状態）:
   • Twenty Twenty は、WordPress のデフォルトテーマとして、基本的な機能に絞られています。そのため、テーマ単体でのカスタマイズ項目は非常に少ないです。
   • 思い通りのデザインやレイアウトを実現するためには、CSSを記述したり、WordPress のブロックエディタやブロックテーマに関する知識が必要になります。
   • WordPress のカスタマイズに慣れていない初心者の方には、少しハードルが高く感じられるかもしれません。
2. 子テーマの利用が推奨される:
   • Twenty Twenty をカスタマイズする場合、直接テーマファイルを編集すると、テーマのアップデート時に変更内容が上書きされてしまいます。
   • そのため、カスタマイズを行う場合は必ず「子テーマ」を作成し、子テーマ側で変更を加えることが強く推奨されます。
3. デフォルトテーマとしての役割:
   • Twenty Twenty は、WordPress のインストール時に最初から入っている「デフォルトテーマ」の一つです。
   • サイトで現在使用しているテーマに何らかの問題が発生した場合、WordPress は自動的にデフォルトテーマ（Twenty Twenty など）に切り替わることがあります。そのため、万が一に備えて Twenty Twenty は削除せずに残しておくことが推奨されます。
4. 特定のページテンプレートの挙動:
   • template-canvas.php のような特定のページテンプレートを使用する場合、サイトヘッダーやモーダルメニューが取り入れられないなど、通常の挙動と異なる場合があります。
5. パフォーマンスに関する懸念（Font Awesome）:
   • 一部の情報源では、Twenty Twenty に含まれる Font Awesome がパフォーマンスに影響を与える可能性があると指摘されています。サイトの表示速度を重視する場合は、この点に留意し、最適化を検討する必要があるかもしれません。

まとめ

Twenty Twenty は、WordPress の進化に合わせてブロックエディタの機能を最大限に引き出すように設計された、シンプルで強力なテーマです。しかし、そのシンプルさゆえに、自由なカスタマイズにはある程度の知識や技術が必要になります。

• WordPress やブロックエディタの学習を深めたい方や、ノーコードでのサイト構築に関心がある方にとっては、良い学習材料となるでしょう。
• デザインの自由度を重視する方や、手軽にデザインを変更したい方は、Twenty Twenty をベースにするのではなく、より多くのカスタマイズオプションを持つ他のテーマを検討する方が良いかもしれません。

ご自身のWordPressの習熟度や、サイトの目的に合わせて、Twenty Twenty の利用を検討してみてください。