2013「テーマ構築チュートリアル」非ライブ版この記事は投稿されてから1年以上過ぎています。技術情報の場合は最新の情報の検索をしていただき、正しい情報を習得されることをおすすめします。それ以外の場合はどうぞこの記事をお楽しみください。2013の「テーマ構築チュートリアル」セッションに僕(@gouten5010)も解説役として登壇をさせていただきました。2013の「テーマ構築チュートリアル」セッションに解説役(...と言っても補助程度)として僕(@gouten5010)も登壇させていただきました。このセッションが終わってから数人ほどですが「実は見たかった」というありがたい要望がありまして、実際にコーディングをされた@___kikiiiさんとの相談の結果、このブログにてセッション内容を公開することにしました!スライド使って説明するセッションじゃなかったからね、仕方ないね。2013のセッション時点でWordPressのバージョンは3.5.1でした。今回の説明も3.5.1をベースに進めていき、配布テーマもそれに準じます。!はじめに今回のセッションは構築の一例をライブで見て、要求されたワイヤーフレームやサイト構造を実現するためにはどのようにすればいいのかを、制作のヒントとして学んでいただく目的をもって進めました。実際のコーディングは@___kikiiiさん、解説と言う名の補助要員はGOUTENでお送りしました。今回のセッションではベースのhtmlは完成した状態(←大事なことなので言うのは2回目)で進行させて頂きました。作成サイトに関して今回のセッション用に作成したサイトの完成形は画像のような感じです。設計事務所という想定で作成しました。DEMO一部画像リンクが切れている箇所がありますが、原因調査中です。気にしないでください。サイト構成に関してサイトマップは以下の画像のような構成になっています。フロントページはフロントページのことです。サイドバーに関してはフロントページのみの表示です。下層ページには6つのコンテンツがあり、そのうち制作実績を載せるworksページと新着情報を載せるinformationページをWordPressで言うところの「投稿」で実装し、カテゴリーで分類します。本来コンテンツ内容の登録が大幅に違う場合はカスタム投稿タイプをつかって投稿を分けるのがいいのですが、今回は別のコンテンツでカスタム投稿タイプを使用するのに加えて、カテゴリーの条件分岐も使いたかったのでカテゴリーで分けるようにしました。その他のページは、404ページ以外は固定ページの機能を使います。会社概要等を載せるaboutページに関しては、表示する項目が多いので専用のテンプレートを用意します。テンプレートの構成に関してテンプレートは以下の画像のような構成になっています。フロントページ(トップページ)はfront-page.phpを使って表示します。共通するパーツであるヘッダー(header.php)・フッター(footer.php)・サイドバー(sidebar.php)は分割して各テンプレートに読み込ませます。カテゴリーアーカイブに関して、informationページはindex.phpを使用し、worksページはindex.phpの中で条件分岐タグを使用してカテゴリーの場合のみサムネイル(アイキャッチ)を表示するようにしています。個別ページはaboutスラッグの場合のみpage-about.phpを呼び出すようにします。10コメントは受け付けていません。