WordPressをオリジナルで開発しよう（オリジナルテーマでデザインをしてみよう）という場合、デザインという作業自体はIllustratorであったりXDであったり、はたまた手書きであったりと、さまざまな方法があります。
しかし、WordPressサイトにオリジナルデザイン（テーマ）を適用しようとした場合は、もれなく「テーマテンプレート」を作らなくてはなりません。
これはどんなに高度なサイトであっても、1ページのみのサイトであっても同様です。つまり「オリジナルテーマを使おう」と考えた時点で、テーマ制作のための開発環境が必要になります。
今回は4回の連載で、WordPressのオリジナルテーマを制作するためのローカル開発環境を整えるところから、AIエージェントと一緒に開発できる状態にするところまでをご紹介します。
途中では、AIエージェントに実際の作業を任せるための環境づくりについても扱います。
このシリーズを読み終え、ローカル環境の整備が完了した暁には、AIと爆速でテーマ制作を始めるための下準備が整います。
少し長いシリーズになりますが、ゆっくりお付き合いください！
Localとは何か・なぜLocalで作業するのか
本番サイトを直接触らない理由
WordPressのテーマを編集するだけなら、本番サーバー上のファイルを直接編集することもできます。
FTPでテーマファイルをダウンロードして編集し、再びアップロードする方法を経験したことがある方もいるかもしれません。
しかし、この方法には大きな問題があります。
失敗した瞬間、本番サイトも壊れる可能性があることです。
PHPの記述を一文字間違えただけでもエラーになる可能性がありますし、CSSの変更によって表示が大きく崩れることもあります。
そこで用意したいのが、自分のパソコンの中だけで動くWordPress環境です。
今回使用する「Local」は、自分のPC内にWordPressを動かすために必要なWebサーバー、PHP、データベースなどをまとめて用意してくれるアプリケーションです。
Localでできること
本番サイトとは切り離された場所なので、
- テーマを編集する
- CSSを書き換える
- プラグインを試す
- PHPを修正する
- AIエージェントにコードを調査・編集させる
といった作業を、本番サイトへ直接影響させずに試すことができます。
今回のゴール
このシリーズではLocalを、単なる「WordPressをPCで動かすソフト」ではなく、WordPressを安全に修繕・開発するための作業場として使っていきます。
Localのインストール
Localの入手・インストール
まずはLocalをPCへインストールします。ここでは、
- Localを入手する
- PCへインストールする
- Localを起動する
ところまで進めます。
初めて起動するとさまざまな項目が表示されますが、この段階ですべてを理解する必要はありません。まずは、「自分のPCの中にWordPressを作れるアプリなんだな」くらいの理解で大丈夫です。詳しい設定については、実際にWordPressサイトを作りながら確認していきましょう。
LocalからWordPressサイトを作成する
Localをインストールしたら、実際にWordPressサイトをひとつ作成してみましょう。今回はまだ本番サイトを移行しません。まずは練習用のまっさらなWordPressを作ります。
Localから新しいサイトを作成し、
- サイト名
- WordPressのユーザー名
- パスワード
- 開発環境
などを設定していきます。
作成が完了すると、普段ブラウザから利用しているWordPressと同じように、管理画面へログインできるようになります。ここで重要なのは、インターネット上のサーバーを契約しなくても、自分のPCだけでWordPressが動いているということです。
Localサイトの構造を確認する
WordPressが動いたところで、少しだけ裏側を覗いてみましょう。
Localで作成したWordPressも、通常のWordPressと同じようにファイルで構成されています。
特に今後よく使うのが、wp-contentです。その中には、
themes・plugins・uploads
などがあります。オリジナルテーマを制作するときに主に触ることになるのが、themesです。LocalではサイトのフォルダをFinderなどから直接開くことができます。
今後AIエージェントへ、「このテーマの構造を調査して」「このCSSがどこから読み込まれているか調べて」とお願いするときにも、このファイルが実際にどこに存在しているのかという理解が重要になります。
まだファイルを変更する必要はありません。まずは、「WordPressの管理画面の裏には、こういうファイル群がある」ということを確認しておきましょう。
Localでデータベースを確認する
WordPressはテーマファイルだけで動いているわけではありません。
投稿、固定ページ、各種設定など、多くの情報がデータベースに保存されています。
Localでは、このデータベースもPC内に作成されます。
LocalのDatabaseから管理ツールを開くと、「wp_posts」「wp_options」「wp_users」など、WordPressが使用しているテーブルを確認できます。最初は何が書いてあるのか分からなくても問題ありません。
ここでの目的はデータベースを編集することではなく、「WordPressにはファイルとは別にデータベースが存在する」と確認することです。次回の記事では、このデータベースを使って実際のWordPressサイトをLocal環境へ移していきます。
Localサイトを起動・終了してみる
最後に、Localで作成したサイトの起動と終了を確認しておきましょう。Localでは、必要なときだけWordPressサイトを起動できます。
サイトを起動すれば、
Open SiteからWebサイトを表示し、
WP AdminからWordPress管理画面へアクセスできます。
作業が終わったらサイトを停止します。そして次回作業するときには、再びLocalを起動してサイトを開始すれば、続きから作業できます。
つまりLocalは、必要なときに開けて、作業が終わったら閉じられるWordPressの作業場と考えると分かりやすいでしょう。
まとめ：修繕作業の準備完了
今回はWordPressを安全に修繕・開発するための最初の準備として、Local環境を作りました。
ここまでで、
- WordPressをLocalに作れる
- WordPressのファイルがどこにあるか分かる
- データベースを確認できる
- サイトを起動・終了できる
という状態になっていれば準備完了です。
まだテーマ制作は始めません。まだデータベースも変更しません。そして、AIエージェントにもまだ作業をお願いしません。
まずは安全に作業できる場所を作ること。
これが、これからWordPressを開発していくための最初の一歩です。次回は、実際に公開されているWordPressサイトのデータを、このLocal環境へ移していきます。