Twenty Twenty-Fourのトップページの作り方

新しいブロックベースによるテーマ Twenty Twenty-F​​our は、本質的には、テンプレートとパターンのコレクションであり、すべて組み合わされてテーマが構成されます。これらのパターンには、概要ページ、プロジェクト概要、出欠確認、ランディング ページなど、さまざまなユースケースに対応したさまざまなホーム テンプレートが含まれています。

これまでのWordPressテーマは導入後テーマカスタマイザーを使ってカスタマイズをしてデザインを仕上げてきましたが、Twenty Twenty-F​​our はブロックエディタを使用し編集を行います。その為非常に柔軟性の高いものになっていますが、反面従来のテーマに慣れた方は戸惑ってしまうかもしれません。

WordPress.org	Twenty Twenty-Four
有効インストール	900,000+
WordPressバージョン	6.4
PHPバージョン	7.0

トップページ（ブログホーム）を作る

ダッシュボードで外観 > エディタ と進めるとサイドバーに次の デザインが表示されます。

• ナビゲーションはグローバルナビゲーションを設定、ページやカテゴリーを設定できます。
• スタイルは異なるスタイルの組み合わせ（フォントや背景色・色）を選択できます。
• 固定ページはサイトのトップページを固定ページにしたい場合作成できます。固定ページ > 新規固定ページの下書き > タイトル（例：トップページ） > 下書きを作成 > ページのパターンが表示されるので選択し修正を行います。サイトのトップページとして表示する場合は、 設定 > 表示設定で固定ページを設定する必要があります。編集は従来の固定一覧から記事を開いて編集することができます。
• テンプレートは、新しいテンプレートを作成するか、テーマによって提供されるテンプレートに加えられたカスタマイズをリセットします。
• パターンは、サイト編集時に利用可能なパターンを管理します。

スタイルの編集や追加css

スタイルの編集を行うには　外観 > エディター > スタイルと進み、下図の鉛筆アイコンをクリックします。

スタイル編集画面では、フォントや色など変更できます。

テーマカスタマイザーには目立つところに表示されていた追加CSSは下部に配置されています。

【まとめ】
固定ページでサイトトップ（HOME）を作るには、従来の固定ページにテンプレート、パターンを組み合わせて作り上げてゆくイメージになります。WordPresssサイトを運用されている方で、ブロックエディタで編集をされている場合は比較的なれることができると思いますが、そうでない方も、パターンによってパーツをページに貼り付けて仕上げてゆくものと理解できると利便性を感じることができるのではないでしょうか？

WordPressのテーマを変更する手順

テーマを変更するには、管理画面からダウンロードし有効化するという流れになるのですが、いきなり有効化するのは少しリスクがあります。ウイジェットなどはテーマによって取り扱いが異なります、そこで以下の手順で変更されることを推奨します。

1. 変更前にバックアップする
2. ダッシュボード・外観　よりテーマディレクトリにアクセスする
3. ライブプレビューを確認し表示の調整を行う
4. 有効化して公開
5. 公開後の確認作業を行う

※ライブプレビューで確認して表示の調整をするには、ダッシュボードの　外観　画面でインストールしたテーマの有効化ボタンの右側　ライブプレビューボタンをクリックします。

テーマカスタマイザーによる調整ができるので、修正が終わったら左上部の「有効化して公開」ボタンをクリックします。公開後にはスタイルシートを修正、確認、設定します。以下の点については公開後早期にチェックするようにしましょう。

• 外部のツールと連携している場合は正しく動作しているか
• スタイルシートが正しく設定されているか
• 不要なプラグインは削除する。

テーマの選び方

テーマを選ぶ際にはにはレスポンシブデザインかどうかは着目しましょう。レスポンシブデザインとは、スマートフォンやタブレット・PC別に１つのデザインで表示できるようにしたものです。サイトの内容によってはスマホユーザーが少ないこともあるでしょうが、Googleはモバイル端末での表示を標準と考えていますので、この点からも対応すべきポイトです。

• レスポンシブデザインなのか
• デザインをカスタマイズしやすいか
• ダウンロード数（利用されている数）が多いのか
• ブロックエディタに対応しているのか
• 日本語に対応しているのか
• テーマは安全なのか

有料テーマ	無料テーマ	公式テーマ
WordPress有料テーマはおしゃれでカスタマイズしやすいのが大きなメリットです。 WEBサイト運用するための機能も標準として装備されているので、プラグインの追加をしなくても十分使用することが可能です。 無料テーマはシンプルなものが多く、他のサイトとデザインが同じようになってしまうこともあります。 しかし、有料テーマであればカスタマイズしやすくなっているため、好みのサイトを作成しやすいのが特徴です。	WEB制作会社から配布される無料テーマもあります。無料とは思えないほど機能やデザインが充実しているテーマもあります。ただし、無料がゆえに途中で更新がストップしたり、開発が終了されることもあります。無料テーマは開発者の宣伝や有料版へのステップとして提供されていることもあると認識しておきましょう。 無料テーマのデメリットとしては、製品版のお試し（機能が制限されたり）として配布されたり、個人的に配布されたりしていて、サポートや更新が終了してしまうことがあります。	公式テーマは、日本語に対応しているのか確認しましょう、開発が海外の場合、日本語表示等に考慮されていない場合もあります。また、テーマ内の説明も日本語でないことも多いようです。 ディレクトリ登録時に事前に審査が行われるので、製作者サイトからの直ダウンロードに比較すれば安全といえるでしょう。 デザインや機能は育て上げる面もあり初心者にはハードルが高いかもしれません。サポートはありませんのでwordpress.orgやネットから情報か自力で解決しなければなりません。

テーマを安全に運用する

WordPressのテーマとは、サイト全体のテンプレートのことです。テーマは複数のファイルの集合体で、デザインなどの内容が一式セットになっています。そのため、テーマを変更すれば複雑な処理を行うことなく、デザインや構成、機能などを変えることができます。テーマは、インターネット上で無料ダウンロードできるものから、有料で販売されているものもあります。また、自分で作成したテーマをアップロードして使用することも可能です。

テーマの更新には、機能の追加・変更などのほかに、セキュリティ向上や不具合の修正なども含まれるため、常に最新の状態にアップデートしておくことです。また、テーマを更新すると、カスタマイズは初期化してしまいます。更新する度にカスタマイズし直すのは手間がかかるので、「子テーマ」の利用が推奨されています。子テーマを作る理由はテーマを直接カスタマイズしてしまうと、テーマのバージョンアップによって変更した内容が上書きされてしまうからです。子テーマは、親テーマの機能やスタイルを引き継いでいます。子テーマにカスタマイズしたい部分だけを付け加えておけば、テーマを更新した後もカスタマイズした状態をそのまま引き継げます。

レンタルサーバーのバックアップ

エラーによって不測の事態に陥ってしまった場合、やはり安心なのはレンタルサーのバックアップ機能です。レンタルサーバーによっては高機能なバックアップが装備され毎日自動でバックアップしてくれるものもあります。

ロリポップ！	自動バックアップ・無料
ConoHa WING	自動バックアップ期間14日間
リトルサーバー	バックアップ期間7日間
WordPress最適化SSDサーバー	自動バックアップ
KAGOYA のWordPress専用サーバー	指定したスケジュールでバックアップ
さくらのレンタルサーバ	8世代の自動バックアップ

※サービス内容は変更されることがありますので、公式サイトで確認してください。

◆有料テーマは最初からデザインやレイアウトが完成されています。カスタマイズせずほぼそのままの状態で使えるので、サイト運営で最も重要な仕事であるコンテンツ作成に集中できます。トップページのレイアウトやコンテンツを自由自在に調整できたり、サイト全体のデザインやSEOを一括設定できたりと、高度なサイト作成機能が搭載されているのも有料テーマのメリットの一つです。