猿でもわかるWordPressオリジナルテーマ作成完全攻略の道〜その2〜
こんにちは。KGEです。
さてさて、前回に続き、猿でもわかるWordPressオリジナルテーマ作成完全攻略の道、ということでやっていきたいと思います。
まずは前回のおさらいとしまして、最初に既存のHTMLファイルを全てPHPファイルに変換しました。
index.htmlとあれば、そいつをindex.phpに。グローバルメニューによくある何々石材店について、みたいなページを作っているのがabout.htmlであればそいつをabout.phpに。
要するにまずは拡張子だけを変えてファイルを作り、まんま同じ内容をコピッちゃえばいいと、前回お話しさせて頂きました。
じゃあ、そのあとどうなるんだ？？っていう話なんですが、結論から言うと、どうもなりません。
どうもならないどころか、リンクはどこにも飛べねーわ、imagesフォルダの画像が全然反映されてねーわで、一体全体どうなってんだこりゃ？？
ってな具合です。
まあ、当たり前っちゃ当たり前ですけど。
だってWordpress内に潜んでいる、それぞれのPHP君達から見れば、なんだお前。ここに何しに来たんだ？？
って感じです。
要するに、ファイルの中身変わんねーなら、Wordpressにする意味ねーじゃん。普通にHTMLファイルでサーバーにアップしとけ！！
って言うことです。まあ確かに。
テーマ内に、たかだか拡張子を変えたファイルをアップするくらいで、WP特有の記事の新規投稿システムや、いろんなプラグインを活用させてくれるほど、奴らは甘くなかったのです。。
じゃあ分かったと。
郷に入っては郷に従え、英語でいうとWhen in Rome、do as the Romans do！！（違うかな。。。）
ということで、なんとかこっちもPHPをぶっ刺してWordpressの世界に殴り込みかけてやろうと、こう思ったわけです。
嘘だけど。
と、能書きはこの辺にしまして、さっさとその手順を説明していきたいと思います。
まず、PHP言語で形成されてるWordpressには、いろんなPHPによるテンプレートタグが用意されていて、オリジナルテーマを作るときには、このテンプレートタグがとても重要な役割を担っていきます。
簡単にいうと、Wordpress君は、テンプレートタグ無しじゃ、ファイル内に、どんなにaタグがあろうが、どこにも飛んでくれないし、imagesフォルダの中にどんだけpngやらjpgなんかの拡張子が入っていても、それらを認識してくれないんです。
俺から言わせりゃ、しらばっくれてるんですね。
最近の若い奴に多いアフィリエイト気取りの屁理屈プログラマーみたいなものです。
分かってるくせに、こっちがちゃんとロジック通り言ったりやったりしねえと動かねえ。みたいな。
そういう奴多いですね。まあいいか。
で、そういう奴は、めんどくせえから、まずは上からちゃっちゃとやることやっちまおう、ってことで、最初に紹介する商品がこちらです。
<?php wp_head(); ?>
こちらはなんと、ど頭の<!DOCTYPE html>から、body内の</header>までを全ファイルに落とし込んでくれるというなんとも便利な代物！
この便利な代物の使い方も簡単！
ど頭の<!DOCTYPE html>から、body内の</header>までを一旦コピッて、別ファイル、その名も、header.phpに落とし込んでやるんです。
（このファイル名は、お決まりです。peppar.phpとかではダメです）
以下コードで示すと、、
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<header>
<h1>うんちゃらかんちゃら</h1>
<p>どうたらこうたら</p>
<ul>
<li>top</li>
<li>***</li>
<li>***</li>
</ul>
</header>
くらいまで、こいつ（<?php wp_head(); ?>）が担ってくれるっつうわけです。
なんていい奴なんだ。
ってことはfooterに対しても同じことが言えるんじゃなかろうか？？
そう踏んだ私は早速いろんなクレイツを掘り探りました。
そうしたらやっぱりあった！！同じような奴が！
はいこれ。
<?php wp_footer(); ?>
きた。
Black Moon見つけてぶち上がってたら、今度はSmif-N-Wessun見つけちゃった！的な。
違うか。まあいいや。
こいつもこいつで、<?php wp_head(); ?>と同じような役割を担ってくれます。
用途は全く一緒。
HTML 内のfooterの部分を丸々コピッて、今度はfooter.phpとしちゃいましょう。
こっちはもう分かりやすく、、
<footer>
<p>コピーライト的な奴<p>
</footer>
</body>
</html>
こんな感じでいいでしょう。
で、あとは、同じようなテンプレートタグでimagesフォルダの中身や、リンクタグなんかをどう反映させればいいのかってことなんですが、ちょっと長くなってきちゃったので続きはまた次回にしましょう。（ドットインストール風の終わり方）