開発環境
WordPress テーマを構築する際は、ライブ(つまり、プロダクション)サイトとは別の環境で行うのが良いアイデアです。最初の WordPress テーマを作成する前に、開発環境を設定する必要があります。
初めての方はこのプロセスに怖がらないでください。長い目で見れば、これを設定する方法を学んで良かったと思うでしょう。
なぜ開発環境を設定するのか?
開発環境を使用すると、コードを本番サイトに公開する前にテストできます。何かを変更して公開し、その後に致命的なエラーを作成してウェブサイト全体がダウンしてしまったことに気付くのは避けたいものです。
開発環境を使用することで、公開前に機能することを確認するためにテストできます。
開発環境は、ローカル(コンピュータ上)またはリモートサーバー上に設定できます。しかし、テーマの作業を行うためにローカル環境を構成することは、いくつかの理由から有益です:
- テーマを構築するのにインターネット接続は必要ありません。
- リモートサーバーに依存せずにテーマを構築できます。これにより、構築プロセスが加速し、ブラウザで変更を即座に確認できます。
- 多くの視点からテーマをテストできます。これは、より大きなオーディエンスに公開する予定があり、最大の互換性を望む場合に重要です。
ローカル開発環境の設定
WordPress テーマを開発するには、WordPress に適した開発環境を設定する必要があります。このリストは網羅的ではありませんが、いくつかの選択肢を以下に示します:
- @wordpress/env(ローカル WordPress 環境パッケージ)
- Docker
- Local
- MAMP
- Studio
- Varying Vagrant Vagrants(VVV)
- XAMPP
詳細については、Core Handbook の 開発環境の設定 ドキュメントをお読みください。
WordPress のインストール
開発環境でテーマを構築する前に、WordPress をインストールする必要があります。
いくつかの開発環境には、WordPress のインスタンスを自動的にインストールする方法が含まれています。この場合は、このステップをスキップできます。
自分で WordPress をインストールするには、Advanced Administration Handbook の WordPress のインストール方法 ドキュメントに従ってください。その後、もちろん、ここに戻って WordPress テーマの作成についてもっと学んでください!
コードエディタ
良いコードエディタはその重さに見合う価値があります。
賢者の言葉
真面目な話、良いコードエディタは適切な構文ハイライト、エラーレポート、バージョン管理システム(VCS)との統合などを提供します。これはあなたの生活を楽にするためにあります。
技術的には、プレーンテキストエディタでコードを編集することもできますが、真のコードエディタや IDE(統合開発環境)が提供するすべての最高の機能を逃すことになります。
Visual Studio Code でテーマの single.html
テンプレートを編集
選択できる無料でオープンソースのエディタはたくさんあります。以下は、より人気のあるもののいくつかです:
無料または使用料がかかる多くのプロプライエタリエディタもあります。何を使用するかは、快適に感じるものを選んでください。
その他の開発ツール
コードエディタと開発環境は、WordPress テーマを作成するための基盤となる要素です。しかし、プロジェクトに役立つ他のツールやリソースもあります。
テストデータ
WordPress では、テーマをテストするための実データまたはダミーデータを含む XML ファイルをインポート できます。これにより、さまざまなタイプのコンテンツやレイアウトでテーマがどのように機能するかを確認できます。インポートのオプションは次の2つです:
- WordPress.org テーマテストデータ
- WordPress.com テーマテストデータ(WordPress.com 特有のデータを含む)
他に何もない場合、テーマが実際にどのように見えるかを確認するために、何らかのデモ/テストコンテンツが必要です。自分でテスト投稿やページを作成することもできます!
プラグイン
テストデータに加えて、テーマが標準的なプラクティスに従っていることを確認し、デバッグ通知を生成しないようにするためのいくつかの WordPress プラグインがあります。これらはオプションですが、役立つことがあります:
- Theme Check:最新の WordPress 標準とプラクティスに対するテーマの適合性をテストします。
- Debug Bar:WordPress 管理画面に管理バーを追加し、デバッグのための中央の場所を提供します。
- Query Monitor:テーマページや機能を生成するために使用されるデータベースクエリ、API リクエスト、および AJAX のデバッグを可能にします。
- Log Deprecated Notices:テーマ内の不正な関数使用、非推奨ファイル使用、および非推奨関数使用をログに記録します。
- Monster Widget:コア WordPress ウィジェットを単一のウィジェットに統合し、すべてを一度にテストしやすくします(クラシックテーマのみ)。
WordPress.org テーマレビューガイドライン
WordPress.org テーマチームが提供する テーマガイドライン を最新の状態に保つことは良いアイデアです。これらのガイドラインは、公式の テーマディレクトリ にテーマを提出する予定がある場合に必要ですが、テーマを作成するすべての人にとって良い原則でもあります。
テーマのコードを書く際には、WordPress コーディング基準 に従うべきです。これにより、作成しているものが最低限の品質基準を満たしていることを確認できます。