このページでは、ワードプレスのテーマを作成する前にまず行うべき準備について解説します。
Contents
ワードプレスのインストール
まずはワードプレスをインストールし、テーマを変更した時のページの表示確認を手軽に行える環境を準備しましょう。
このワードプレスのインストールは MAMP などを用いて自分の PC に行うことをオススメします。
例えば実際にウェブページを公開しているウェブサーバー上でテーマの開発を行なってしまうと、開発時に自分が公開しているウェブページが表示されなくなるなどの不具合が発生する可能性があります。
安心して気軽にテーマ開発を行うために、自分の PC にワードプレスをインストールし、そこでテーマ開発・表示の確認を行える環境を用意した方が良いです。
そして PC 上でテーマの開発が一通り完了した時に、ウェブサーバーにアップしてテーマを公開するのが安全で楽なテーマ開発方法だと思います。
MAMP と MAMPを用いたワードプレスのインストール方法は下のページで解説していますので参考にしてください。私もこの手順でワードプレスをインストールし、そこでテーマ開発を行なっています。
MAMPがあれば「ネット環境なし」でもワードプレスが使える！
開発環境の準備
続いて用意するのが開発環境です。ワードプレスのテーマの実体は PHPです。テーマを作っていくためには PHP の編集を行う必要があります。PHP を編集しやすい環境を用意しておきましょう。
「まずはお試しでテーマをちょっといじってみたい」という方であればテキストエディタなどがあれば十分だと思います。
ただし、テーマ開発に本格的に取り組みたいのであれば、 Eclipse や VSCode などの統合開発環境を用意しておく方が良いと思います。
デバッガーを使用することで、プログラムを停止させながら自分のテーマの動きを確認可能になりますので、自分のテーマやワードプレス自体がどのように動作しているかを確認するのに便利ですし、上手く動作しない時の原因を調査するのにも大変便利です。
実際私も Eclipse や VSCode をインストールしてデバッガーを動かしながらワードプレスの動きを確認していますが、プログラムの動きが分かって楽しいです。
またデバッガーを使うことで上手くページが表示されない時も、原因を調べるのが簡単になります。
Eclipse をインストールした時の手順・デバッガーを動作させるための手順はそれぞれ下のページで紹介していますので、Eclipse やデバッガーを使ってみたい方は是非参考にしてみてください。
ワードプレスのテーマ開発環境にEclipseを導入
Eclipse にデバッガー（Xdebug）を導入
また VSCode に関しても下記ページで紹介していますので、VSCode がお好みの方はこちらを参考にしてください。
Visual Studio Code でワードプレス開発環境を構築する（MacOSX）
VSCode でワードプレスデバッグ環境を構築する
処理が軽い・今時の流行という観点から、個人的に VSCode がオススメです。
スポンサーリンク
ワードプレスの基礎知識の習得
ワードプレスのテーマを作成するのですから、やはりワードプレスの基礎知識はつけておいた方が良いです。
ワードプレスの仕組み
ワードプレスでページ表示を行うときの PHP の動作やファイル構成は知っておいた方が良いと思います。この辺りのワードプレスの仕組みについては下のページで解説していますので、是非読んでみてください。
ワードプレスの仕組みを「構成」と「PHPの動き」から解説
ワードプレスの関数
テーマを構成する PHP プログラムでは、ワードプレス専用に用意された関数が使用可能です。この関数を駆使してテーマを作っていくことになります。どんな関数があるかは下のページで確認することができますので、このページはすぐに参照できるようにしておくと便利です。
参考 関数リファレンスWordPressCodex日本語版スポンサーリンク
PHPの簡単な基礎知識の習得
最低限で良いので PHP のことも知っておくと良いです。深い知識はテーマを作成していくと自然に身につくと思いますし、出来るだけこのウェブサイトでも解説しようと思っていますが、最低限、下記のことは頭に入れておくと良いと思います。
PHPの記述の仕方
PHPでは「PHPの開始タグ」と「PHPの終了タグ」を用意し、その間にプログラムを記述します。PHPの開始タグは「<?php」であり、PHPの終了タグは「?>」です。ですので、PHPを記述するときは下記のようにプログラムを書きます。
<?php
PHPの処理;
>?>また、PHPの処理は「;」で区切ります。例えばPHPの処理を３つ書くのであれば下記のように記述します。
<?php
PHPの処理１;
PHPの処理２;
PHPの処理３;
>?>HTML と PHP の関係
HTML と PHP の関係についても知っておくと良いと思います。
HTML とはウェブページを表示するためのマークアップ言語です。ウェブブラウザは、この HTML に記述内容に従ってウェブページを表示しています。
PHP は HTML の生成に適したプログラミング言語の一つです。ワードプレスの中にはたくさんの PHP ファイルが存在し、この PHP が動作して HTML が生成され、ウェブページ表示が行われています。
PHP の特徴は、HTML の中に組み込むことができることです。この特徴があるので、PHP は HTML 生成に向いています。下の図のように PHPファイルの骨組みは HTML として記述し、PHPやワードプレスの関数を実行したい部分だけ PHP で記述することができます。
PHP でページごとに表示するコンテンツを切り替えることができるため、PHP ファイル１つでたくさんのページ表示を行うことができるようになります。例えば、ワードプレスの投稿記事のページは single.php というPHPファイルが全ての投稿記事を表示する役割を果たしています（複数の PHP が連動して表示している場合もあります）。
スポンサーリンク
PHP で使用できる関数
ワードプレスのテーマの実体は PHP プログラムです。ですので、テーマ開発時には PHP の関数も使用可能です。PHP の関数にどんなものがあるかは下記ページで確認することができますので、このページもすぐに参照できるようにしておくと便利です。
参考 言語リファレンスPHP マニュアル記事の投稿
ワードプレスのテーマ開発においては、実際にページを表示させながら動作確認を行います。ですので、あらかじめページを表示するための記事の投稿をしておくと動作確認がやりやすいです。
ワードプレスのダッシュボードからいくつかてきとうな投稿と固定ページを新規追加しておいてください。
まとめ
このページではワードプレスのテーマ作成を行うための前準備について解説しました。特にローカルPCにワードプレス環境を用意しておくと気軽にテーマ作成ができるようになりますので是非準備しておきましょう。開発環境は色々ありますが、まずはお試しでテーマ作成を始めてみたいという方はテキストエディタでも良いと思います。
下のページの「テーマの作り方①：まずは簡単なテーマを作りページを表示する」からは、いよいよテーマ作成を行なっていきます！
【ワードプレス】テーマの作り方①：まずは簡単なテーマを作ってページを表示する