WordPressのテーマを自作しよう

WordPressにはたくさんの有料・無料テーマがあるのはこのページをご覧になる方なら当然ご存じかと思います。

テーマには主に以下のような種類があります。

  1. WordPress公式サイトで配布されている完全無料テーマ
  2. WordPress公式サイトで配布されていて、一部有料化されているテーマ
  3. 「ha-Basic(当サイトで配布)」のように個人または企業サイトで無料配布されているテーマ
  4. 個人または企業サイトで有料販売(買い取り)されているテーマ
  5. 個人または企業サイトで継続契約による有料販売(サブスクリプション契約)されているテーマ

逆に選択肢があり過ぎて、何を選んだらいいのか?何が違うのか?を見極めるのはなかなか難しいですね。中には有料テーマを買ってみたものの「どうやって使うの?」「全然デモみたいにならない..」というようなものもあり、何となく損をした気分になった..なんて方もいるのではないでしょうか?

決してテーマ作者を養護するつもりではありませんが、私も無料テーマですがこのサイトで【ha-Basic】というテーマを配布させていただいている一人として、何もカスタマイズを加えず、完全にノーマル状態のままをデモとしてご覧いただくのはなかなか難しいことも理解できるものの、それならそれでどうやったらデモのようになるのかも示してほしいなぁとも感じます。逆に特に有料テーマを選ぶ際はそうしたものがあるテーマなのかどうかというのも見極め方の1つではないかと思います。

ただ、無料にせよ有料にせよ、配布されているテーマでは、いろいろな形のサイトが作れるように、さまざまなスイッチ(有効・無効)や設定変更ができる項目を設けたり、こんな時、あんな時にも対応できるよう過分にデザイン用のコードが書かれていたりする(逆にそうしないと汎用にならない)ため、ページの容量が大きくなったり、コンテンツ(投稿や固定ページ、カテゴリーやタグ分けなど)が増えるに従って、呼び出してページを呼び出すまでの処理に時間がかかり、表示速度が低下することもあります。

これは汎用なのでいわば仕方ないことで、デモやテーマの配布サイトはすごい速度で表示されているのに自分のサイトは...という状況になることも少なくありません。

そこでぜひチャレンジしていただきたいのが、自作テーマづくりです。自分のサイトに必要なものを必要なだけ記述して動作させるので、余分に処理を行う(はい/いいえの判定を含む)ことが少なく、安定して動作させることができます。

1つ1つ確認しながら進めていただけるよう、数ページに分けてWordPress用自作テーマの作り方を紹介していきますので、頑張っていきましょう!

本ページおよび、制作過程のページは、実際に作成しながら進めています。前後ページへの挿入を行う必要性、内容を忘れないように書き留めていく必要があることから、公開済みの状態で内容を充実させていっていますので、お見苦しい点が多々あるかとは思いますが、ご容赦ください。

WordPressテーマの自作に必要なスキル

まずはご自身のスキルで、今回紹介していくWordPressテーマの自作が可能かどうかを判断していただければと思います。以下の項目で1つでも難しいようでしたら、誰かが作成されたテーマをお使いいただくのが無難だと思います。

偉そうなこと言ってますが、私も数年前までは既存テーマを少しカスタマイズできる位のレベルでしたので、一度すべて読んでからどうなのかを判断いただければ大丈夫でしょう

自作テーマ制作に必要なスキル

  • テスト環境(テスト用サイト)を手動でインストールできるか?
  • テキストエディタを使ってファイルを作ることができるか?
  • FTPクライアントツールを使ってサーバー内のファイルを操作することができるか?
  • 簡単なCSSの書き方、使い方を理解しているか?(ある程度は解説します..)
  • PHPというプログラムに関して多少の知識があるか?(基本コピペでなんとかですが一応)

WordPress用自作テーマ作成手順

以下の各ページで解説していきますので、順に進めていってください。

1.基本編

  1. テーマ制作環境(テストサイト)を作ろう
  2. テーマの作成に必要なツール、あると便利なツール
  3. テーマとして使うために最低限必要なファイルと必要な記述
  4. テーマ内のPHPコードの書き方、方法を決定しよう
  5. header.php、footer.phpを作ろう
  6. index.phpを作ろう
  7. single.php、page.phpを作ろう
  8. CSSを記述しよう(CSSの書き方を統一しよう)
  9. sidebar.phpを作って2カラムにしてみよう、サイドバーへ独自ウィジェットエリアを作ろう

ここまで行うと、WordPressで作成した情報を表示できるようになります

2.応用編

ここでは通常プラグインなどを使って実装する機能を実装する方法をいろいろ紹介します

  1. ヘッダー内に画像スライダーを表示させよう

3.汎用化編

ここではいろいろな選択肢を設けて、他の人が使える汎用テーマにしていく方法を紹介します

次ページ:テストサイトを作ろう →