最初のテーマをアクティブにする

テーマを構築する方法を理解する最良の方法の一つは、既存のテーマを見て学ぶことです。

高度な開発のサークルにおいても、健全な開発の基礎の一つはコードの再利用です。これは、開発者が物事を効率的に進める最も良い方法であることを理解しているからであり、多くの人が「車輪を再発明しない」というマントラに従おうとします。

あなたが開発者であろうとなかろうと、これは健全なアドバイスです。すべてをゼロから構築する必要はありません。あなたがやりたいことのほとんどは、すでに他の誰かによって作成されている可能性が高いです。

したがって、次のステップは既存のテーマをアクティブにすることです。

学ぶためのテーマを選ぶ

WordPressのバージョン3.0以降のすべてのバージョンにパッケージされているデフォルトテーマは、テーマがどのように構築されているかを学ぶのに最適なものの一部です。これは、広範な使用を考慮して設計されており、WordPressのコーディング基準に完全に準拠しているからです。

このハンドブックは主に現代のブロックテーマに焦点を当てているため、最新のデフォルトテーマのいずれかを選択するべきです:

通常、最新のデフォルトテーマを使用するのが最善です。これは、最新の機能を考慮して構築されているからです。また、最近WordPressをインストールした場合は、すでにアクティブになっているはずです:

WordPressの外観 
> テーマ管理画面、Twenty Twenty-Fourテーマがアクティブになっていることを示しています。

また、公式のテーマディレクトリから学ぶために任意のテーマを選択することもできますが、このガイドの目的のためには、ブロックテーマである必要があります。テーマのインストールとアクティブ化に関する詳細は、テーマを使うドキュメントをお読みください。

クラシックなWordPressに興味がある場合は、クラシックテーマの構築に関する詳細について、クラシックテーマの章に進むべきです。

テーマのカスタマイズ

ブロックテーマをアクティブにしたら、サイトエディタの利用可能なオプションを探索し、いじって楽しむ時間を取ってください。基本的に、これはWordPress管理画面におけるテーマの編集可能な視覚的表現です。

そして、前の「はじめに」章で約束したように、コードの1行にも触れずにこのインターフェースから完全にテーマを構築することができます。

サイトエディタは、WordPress管理メニューの外観
> エディタ
から見つけることができます。開くと、画面は次のようになります:

WordPressサイトエディタ、左パネルにデザインメニューが表示されています。プレビューパネルにはTwenty Twenty-Fourテーマのホームページが表示されています。

これには多くの要素があり、サイトエディタでいじっているだけで何時間も迷ってしまうことがあります。楽しいことができ、ハンドブックを読み進めるにつれて、これがテーマとどのように統合されるかについてもっと学ぶことができます。今は「テーマを作成する」基本に進みましょう。

この旅のこの部分は完全に自己主導で行うことができるので、自分のペースと方法で自由に行ってください。しかし、ほとんどの人はデザインを調整することから始めたいと思うでしょう。

これを行うには、まずメニューパネルのスタイル項目を選択します:

WordPressスタイル画面、管理下のサイトエディタ。左パネルにはいくつかのスタイルバリエーションオプションが表示されています。

Twenty Twenty-Fourテーマ(および他の多くのブロックテーマ)には、上記のスクリーンショットのサイドバーに表示される事前設計されたスタイルバリエーションが含まれています。これらのバリエーションについては、グローバル設定とスタイルの章で詳しく学ぶことができますが、独自のカスタマイズの出発点として1つを使用することを自由に行ってください。

次のステップは、スタイルブックアイコン(目のように見えます)を選択することです。この画面を開くと、サイトのグローバルスタイルを変更するための完全なアクセスが得られます:

WordPressサイトエディタの下にあるスタイルブック画面。さまざまなブロックを含むタブ付きオーバーレイが表示されています。

この時点で、世界はあなたのものです—言い換えれば、自由に創造性を発揮してください。しかし最も重要なのは、インターフェースで利用可能な設定やスタイルを把握することです。この親しみは、ハンドブックのより高度なセクションに入る際に役立ちます。

スタイルブックの使用についての詳細は、WordPress開発者ブログのこのガイドをお読みください:スタイルブック:ブロックテーマのスタイリングのためのワンストップショップ

テーマのエクスポート

テーマを好みにカスタマイズしたら、必ず保存ボタンを押してください。準備ができたら、最初のテーマを「作成」します。

これを行うための2つのオプションがあります。最初は、WordPressのサイトエディタから内蔵のエクスポーターを使用することです。2つ目は、より広範なオプションが利用可能なCreate Block Themeプラグインを使用することです。以下に両方の方法の手順があります。

スタイルインターフェースからのエクスポート

サイトエディタインターフェースからテーマをエクスポートするには、ヘッダーエリアの⋮(オプション)ボタンをクリックします。利用可能なオプションのドロップダウンが表示されます。以下のようにエクスポートオプションをクリックします:

WordPressサイトエディタ、オプションメニューのドロップダウンが開いています。エクスポートオプションが強調表示されています。

これにより、完全なテーマが含まれたZIPファイルが生成されます。ファイル名は、作業していたテーマの名前と一致します。デフォルトのTwenty Twenty-Fourテーマの場合、twentytwentyfour.zipになります。

おめでとうございます! あなたは今、最初のWordPressテーマを成功裏に作成しました。

コードに触れずにテーマを作成できると保証されていました。それは真実でした。あなたは、他のテーマと同様に、任意のWordPressウェブサイトにアップロードできるテーマを構築しました。

しかし、小さな嘘—無害な白い嘘—がその真実に混ざっていました。

ダウンロードしたテーマはまだ「Twenty Twenty-Four」と名付けられており、作成したものを表すように名前を変更するのが最善です。これを行うには、twentytwentyfour.zipフォルダーを解凍し、your-theme-nameに名前を変更します。

次に、そのフォルダー内のstyle.cssファイルを開きます。ファイルの先頭に次のようなものが表示されるはずです:

  1. /*
  2. Theme Name: Twenty Twenty-Four
  3. Theme URI: https://wordpress.org/themes/twentytwentyfour/
  4. Author: the WordPress team
  5. Author URI: https://wordpress.org
  6. ...

少なくとも、最初の4行、特にTheme Nameの値を調整する必要があります。そして、それがあなたが本当に触れなければならないすべてのコードです。

最後のステップとして、ZIPファイルを作成するためにコンピュータにある任意のユーティリティプログラムを使用して、再度ファイルを圧縮します。

Create Block Themeプラグインの使用

Create Block Themeプラグインは、WordPressの貢献者が維持する公式のファーストパーティプラグインです。新しいテーマのエクスポートアイデアがWordPressに実装される前に、ここで試され、テストされることがよくあります。

このプラグインは、コアのWordPressで見つかるものよりも堅牢であり、テーマをエクスポートするための多くのオプションがあります。このガイドでは、テーマをエクスポートする基本のみをカバーしますが、プラグインの機能をより詳細に探索することを自由に行ってください。

Create Block Themeをアクティブにすると、サイトエディタにレンチアイコンとして表示される新しいボタンが表示されます。このボタンをクリックしてCreate Block Themeメニューを開きます。

変更を保存するためのいくつかのオプション、ZIPをエクスポートする、テーマ情報を編集する、新しいテーマを作成するためのオプションが表示されます:

WordPressサイトエディタ、右上に「ツール」アイコンがあります。「Create Block Theme」というタイトルのメニューが開いており、いくつかのオプションがあります。

以前と同様に、エクスポートZIPオプションを使用してテーマをエクスポートできます。

しかし、Create Block Themeは、真にカスタムテーマを作成するために使用したいより多くのカスタマイズオプションを提供します。テーマを作成オプションをクリックします:

WordPressサイトエディタ、Create Block Theme 
> テーマを作成メニューが開いています。メニューパネル内にいくつかのフィールドが表示されています。

そこから、テーマに関するすべての情報をカスタマイズしてユニークにすることができます。完了したら、新しいテーマのためにテーマをエクスポートボタンをクリックします。

Create Block Themeがまだ行わない唯一のことは、カスタムスクリーンショットをアップロードできることです。他の人に配布するつもりなら、テーマ内にユニークなscreenshot.[png|jpg]ファイルを追加する必要があります。