今までTwenty Tenのカスタマイズについて書くことが多かったのですが、
「WordPressのオリジナルテーマを作りながらテンプレートタグをしっかり覚えていこう！」
というネタを思いついてしまったので、
自分の勉強のためにも、このテーマで少しずつ書いてみたいと思います。
テンプレートタグやWordPressについてもっともっと理解できるようにがんばるぞ、おーっ！！
というわけで始めは、 WordPressにオリジナルテーマがあるよ、ということを認識させるまでです。
テーマフォルダをつくる
wp-content/themes/の中にテーマフォルダを作ります。
こんな感じですね。好きなフォルダ名（テーマ名でいいと思います）
を付けたフォルダをwp-content/themes/の中に作ります。
WordPressのテーマはすべて、このwp-content/themes/の中におきます。
これ以外の場所においても認識されません。
style.cssをつくる
子テーマやカスタマイズの基本の基本についてちょっとおさらいしてみるやまずは子テーマをつくる準備からなどでも書きましたが、style.cssに決められたコメントを書くことで、
WordPressがこれはテーマだよって、認識してくれます。
@charset "utf-8"; /* Theme Name: Easy Theme Making Theme URI: http://easy-theme-making.webourgeon.net/ Description: 簡単なテーマ作成をしながらWordPressのテンプレートタグを覚えよう！ Author: webourgeon Author URI: http://webourgeon.net/ Version: 1.0 */
Theme Name: テーマの名前
Theme URI: テーマのURI
Description: テーマの説明
Author: テーマの作者
Author URI: テーマの作者のURI
Version: テーマのバージョン
こんな感じですね。
これだけを入れた状態でちょっとWordPressの管理画面を見てみます。
テンプレートは認識されてるけど、「壊れているテーマ」と表示されてますね。
「テーマにはスタイルシートとテンプレートが一つずつ必要です。」
とあります。
WordPressのテーマにはstyle.cssとindex.phpの最低ふたつのファイルが必要とされています。
style.cssだけだとこんなふうになっちゃうわけですね〜。
子テーマの時には親テーマのindex.phpを読みにいってくれるのでstyle.cssだけあればよいのです。
index.phpをつくる
index.phpをつくってみましょう。
index.phpという名前のphpファイルをテーマフォルダの中におきます。
phpとは言っても、基本的にhtmlを表示させるためのものです。
なので中に何も無いhtmlを中に書いてみます。
せっかくなのでhtml5で。。
<!DOCTYPE HTML> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Easy Theme Making</title> </head> <body> </body></html>
これだと何にも表示されなくて寂しいので
とりあえず
<h1>簡単なテーマを作りながらWordPressのテンプレートタグを覚えよう！</h1>
だけいれてみました。
ファイル名はphpだけど何の変哲もないhtmlです。
さぁ、管理画面はどうなったでしょうか。
おお！こんどはきちんと表示されてますね！
早速有効化してみます
サイトを見ると
どーん！
さっき書いたh1の中身が表示されてます。
WordPressの中の物はなにも読み込まれてないけど、
phpもテンプレートタグもひとつも書いてないけど、
テーマとして機能して、
htmlとして表示されてるのがわかっていただけるんじゃないかと思います。
これでテーマのベースのベースが出来ました。
ココにこれからいろんなテンプレートタグをいれたり、
だんだんファイルを増やしたりして、テーマをつくっていきます。
わくわくしますね！
忘れてたので付け足し
必要有るか無いかわかんないけど、Easy Theme makingとして実際に見れるサイトつくってみたよ。