03

【WordBench東京】WordPressテーマの基本的な仕組み

どうもEXPコハダこと清野です。
WordBench東京 2月度勉強会でお話した「WordPressテーマの基本的な仕組み」のスライドが見つかったので、3ヶ月も経過していますがフォローアップの記事を書きたいと思います。

WordPressのオリジナルテーマを作りたいと思い始めた入門者の方がまず初めに知っておくとよい事を3つに絞ってまとめました。

WordPressのテーマって?

執筆したWordPressの書籍の宣伝もかねて、「ビジネスサイトをこれからつくる WordPressデザイン入門 サイト制作から納品までのはじめの一歩」から引用。

WordPressでは簡単にサイトの外観を変更できます。この外観を「テーマ」と呼びます。
書いた投稿やコンテンツは変えずに、外観だけを変 更できるので、そのときの気分に合わせてテーマを変 更することもできます。公式の無料テーマは執筆時点で2000以上もあるので、テーマ選びだけでも楽しめます。
ビジネスサイトをこれからつくる WordPressデザイン入門 サイト制作から納品までのはじめの一歩 (Design&IDEA)

WordPressにおける「テーマ」とは「きせかえ機能」のようのものです。
書いたブログや固定ページなどのコンテンツをそのままで、見た目だけを変えるのがテーマ機能です。
引用にもあるとおりWordPressには公式に登録されているだけで、3,877個 ( 2016/05/10時点 ) もあります。
とんでもない数ですね。

公式ディレクトリに掲載されているテーマだけでも様々なサイトを構築することができますが、自分だけのオリジナルテーマが作りたくなりますよね?
既にWordPressのオリジナルテーマを作成する手順を詳しくまとめている記事は沢山あるので、実際に手を動かして作成していきたい方は最後にある参考記事を見てみることをおすすめします。

WordPressテーマの基本的な仕組み

07

WordPressのテーマをつくる上で最初に覚えておきたいのは、テンプレート階層・テンプレートタグ・WordPressループ ( ここでは分かりやすくするために、あえて”WordPressループ”と明記しています )の3つです。

テンプレート階層

12

WordPressはアクセスしたURLによって振る舞いを変えるCMSです。
拡張子がPHPのテンプレートファイルが集まったテーマの中から、自動的に表示するテンプレートファイルを自動的に選んで表示してくれる仕組みをテンプレート階層とよびます。

13

例えばブログのカテゴリーページにアクセスしようとした時に、WordPressはテーマ内にあるものから優先的に読み込んで表示していきます。
テンプレート階層 – WordPress Codex 日本語版に詳しくかかれているので、テーマ作成前に一読しておくとよいと思います。

テンプレートタグ

14

テンプレートタグとは、WordPress内のデータを表示するために予め用意されている関数です。
テンプレートタグを使って呼び出せる情報はWordPressの設定情報、記事のタイトルやリンクなど多岐にわたります。

また情報を呼び出すだけではなく、共通パーツの呼び出しやモバイルの切り替えを行うテンプレートタグもあります。

参考: WordPressテンプレートタグ集|初心者即実践&仕事で使えるコピペ用

WordPressループ

16

WordPressループとは、WordPressに投稿した記事のデータを表示するために使われる記述です。

投稿した記事をテンプレートファイル内で取得するには、上記の画像のようにWordPressループを記述し「内容」と書かれた箇所に繰り返し表示する記事のタイトルやリンクを取得するテンプレートタグを記述します。

参考:ループ – WordPress Codex 日本語版

まとめ

ざっくりではありますが、WordPressテーマの制作を始める上で重要な3つの要素を紹介しました。
これからWordPressのテーマを制作する方は、上記のテンプレート階層・テンプレートタグ・WordPressループから勉強するとスムーズに理解ができると思います。

おまけ

テーマの制作時のおすすめ記事

スライド

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です