企業サイトのテーマを作ろう

WordPress入門コースでは、できあいのテーマを「選んで着る」ところまで学びました。このコースはその先——テーマを自分で作る世界に踏みこみます。題材は、架空の雑貨店「シマエナガ堂」の企業サイト。実務のWeb制作で定番の構成を、1本の道すじで作り切ります。

テーマを自作できると、何が変わる？

「できあいのテーマで十分では？」——もっともな疑問なので、先に答えておきます。

• デザインの自由が手に入る——できあいのテーマは「用意された範囲」でのカスタマイズ。自作なら、HTMLとCSSで書けるデザインは何でもWordPressに載せられます
• 既存テーマの中身が読めるようになる——構造を一度自分で作った人は、他人のテーマも「どこを直せばいいか」が見えます。実務のカスタマイズ案件で効くのはこの力です
• 実務のWeb制作にそのままつながる——「WordPressでオリジナルデザインの企業サイトを作る」は、Web制作の定番の仕事そのものです

つまりこのコースは、「WordPressを使える人」から「WordPressで作れる人」への進級コースです。

完成イメージ

コースを最後まで進めると、こんなコーポレートサイトが「自作テーマ」で動くようになります。

ページ構成は、企業サイトの「型」そのものです。

この表の右列が「テンプレートファイル」。いまは呪文に見えても大丈夫——コースを通じて、1枚ずつ手で書いていきます。

地図の見方：ページには2つの性格がある

上の表をよく見ると、ページは大きく2種類に分かれています。入門コースで学んだ、あの区別です。

• 日付つきで増えていくページ——お知らせ。書くたびに1本増え、一覧に新しい順で並ぶ。WordPressでは投稿の担当
• ずっとそこにあるページ——会社案内。増えないし、日付が本質でもない。担当は固定ページ

そして商品は、この2つのどちらでもない「第3の種類」——カスタム投稿タイプとして、コースの後半で自分の手で定義します。「このページはどちらの性格か？」という問いが、この先どのテンプレートファイルを作るかを決める物差しになります。

学びの道のり（4章）

1. じゅんび——Localで開発環境を作り、最小のテーマを起動し、テーマ用のPHPを最低限おぼえる
2. テンプレート——テンプレート階層という「URLと担当ファイルの対応ルール」を学び、トップ・固定ページ・一覧・詳細を作る
3. functions.php——CSSの正しい読みこみ、管理画面から編集できるメニュー、そしてカスタム投稿タイプとカスタムフィールドで「商品」を実装
4. しあげ——テーマとしての体裁を整えて完成

はじめる前の持ち物チェック

• HTMLとCSS——タグとセレクタが書ければOK（HTMLコース・CSSコース修了レベル）
• WordPressの基本操作——投稿・固定ページ・テーマの意味がわかる（入門コースの内容）
• PHPの知識——不要です。テーマに必要な最小限だけ、このコースの中で学びます

このレッスンのまとめ

1. このコースの成果物はシマエナガ堂の企業サイトテーマ——お知らせ・会社案内・商品を備えた実務の型
2. 道のりはじゅんび→テンプレート→functions.php→しあげの4章。テンプレートファイルを1枚ずつ手で書く
3. PHPの事前知識は不要——HTML/CSSができれば入れるように作ってある