ブログ

  • ブログ
  • WordPressがページを表示する仕組みとテンプレートの基本

WordPressがページを表示する仕組みとテンプレートの基本

  • WordPress
2026/09/24 | R.T.

こんにちは!Web制作会社のスタッフ、R.T.です。

Webサイトを運用していると、「ブログ記事の見た目を少し変えたい」「お問い合わせページのレイアウトを調整したい」といった場面が出てきます。

WordPressで構築されたサイトを調整・カスタマイズする際、最初に知っておくと非常に役立つのが「WordPressがどのようにして画面を作っているのか(仕組み)」です。

今回は、難しいプログラムコードは一切使わずに、WordPressの基本構造である「テンプレート」と「ループ」の概念、そして「どのページがどのテンプレートファイルで作られているかの一覧表」をまとめました。

全体の概要をサクッと把握するためのガイドとしてご活用ください。

1. WordPressの「テンプレート」とは?

通常のホームページ(静的なHTMLサイト)は、1つのページに対して1つのファイル(about.html や contact.html など)を作成します。

一方、WordPressは「データベースに保存された文章や画像」と「デザインの骨組み(テンプレートファイル)」を、ユーザーがアクセスした瞬間に組み合わせ、1つのページを出力しています。
データベースに登録された「この記事の3行目のテキスト」を、テンプレートファイルの該当箇所に流し込む、みたいなイメージです。

同じ「投稿ページの型」を使い回しながら、中身の「記事データ」だけを差し替えることで、何百ページあるブログでも効率よく表示できるのがWordPressの最大の強みです。

2. 情報を順番に流し込む「ループ」の仕組み

WordPressの仕組みを語る上で欠かせないのが「ループ」と呼ばれる処理です。

たとえば、ブログ記事の一覧ページを開いたとき、最新の記事が5件や10件ずらりと並びますよね。あれはWordPressが裏側で以下のような「繰り返し作業」を自動で行っているからです。

  1. 「表示すべき記事(データ)はあるか?」と確認する
  2. 記事があれば、1件分のタイトルや本文を取り出す
  3. あらかじめ決めたデザイン枠(見出しタグや画像枠)にデータを流し込む
  4. 次の記事へ移動し、同じ作業を繰り返す
  5. 指定した件数(10件など)が終わったら繰り返しを終了する

この「1件ずつ順番に取り出して画面に並べるサイクル」のことを「ループ」と呼びます。

トップページの新着情報一覧、カテゴリー別の一覧、関連記事の表示など、サイト内のあらゆる「記事の一覧」はすべてこのループの仕組みで動いています。

3. ページとテンプレートファイルの関係一覧表

WordPressは、ユーザーが開こうとしているページの種類(トップページ、記事詳細、一覧画面など)に応じて、使うテンプレートファイルを自動的に判断して呼び出します。

Web制作やカスタマイズの現場でよく使われる主なテンプレートファイルの一覧です。

(※WordPressのテーマフォルダ内にあるファイル名です)

ページ・部位の種類ファイル名役割・表示されるページ
ヘッダー共通部分header.phpサイト最上部のロゴやメインナビゲーション
フッター共通部分footer.phpサイト最下部のコピーライトや共通リンク
トップページfront-page.phpサイトの玄関となるトップページ
個別記事single.phpブログなどの「投稿」の詳細ページ
固定ページpage.php会社概要やお問い合せなどの単独ページ
記事一覧archive.phpカテゴリー別や月別の記事一覧ページ
検索結果search.phpサイト内検索を実行した時の結果ページ
404エラー404.php存在しないURLにアクセスした時の案内画面
最終予備ファイルindex.php専用ファイルがない場合に代わりに呼ばれる最優先ファイル

※WordPressには「テンプレート階層」というルールがあり、たとえば front-page.php が存在しない場合は代わりに home.php や index.php が呼ばれる仕組みになっています。

仕組みを知ると運用がスムーズになる

WordPressの仕組みの基本は、とてもシンプルです。

  • サイトは「デザインの型(テンプレート)」と「データ」が合体してできている
  • 記事一覧などは「ループ」という繰り返し処理で並べられている
  • ページの種類ごとに読み込まれる「ファイル名」が決まっている

この大枠(概要)さえ知っておけば、制作会社やエンジニアとやり取りをする際にも「ブログ記事のレイアウトを変えたいから single.php を調整するんだな」「全ページ共通のメニューを変えるなら header.php だな」といった会話がスムーズにできるようになります。

自社サイトの構造を理解するための第一歩として、ぜひ参考にしてみてください!

当社サービスに関するご相談・お見積もりなど、お気軽にお問い合わせください。

お問い合わせフォーム
この記事の執筆者
R.T.

2013年に道洋行東京支店へ入社。Webチームに所属し、主にHTML/CSSやJavaScriptを用いたコーディングを担当しています。きちんとした文書構造をフロントエンドエンジニアの誉れとし、今はWEBアクセシビリティの勉強中です。Web制作のご相談やお問い合わせは、お気軽にどうぞ。