1. ゼロからつくるWordPressテーマ#9
ループ関数と投稿記事
http://hitsuji.me

2. 目次
1. 今回の内容
2. 投稿表示の仕組み
1. サイトアクセスから表示まで
2. サイト生成のフロー
3. クエリ作成
4. テンプレート実行
5. フローチャートにまとめ
6. コードにする
3. 今回のまとめ＆次回予告
ゼロからつくる WordPress テーマ #9 http://hitsuji.me 2

3. 1. 今回の内容
記事を表示する仕組みを理解する
コレ
<?php if(have_posts()): while(have_posts()): the_post(); ?>
<h2><a href="<?php the_permalink(); ?>">
<?php the_title(); ?></a></h2>
<?php the_content(); ?>
<?php endwhile; endif; ?>
ゼロからつくる WordPress テーマ #9 http://hitsuji.me 3

4. 2-1. サイトアクセスから表示まで（連載:第4回より）
functions.php
WordPress初期化
テーマで利用する機能を
(functions.phpを読み込み) 追加, 定義, 設定する関数が記述
index.phpなど テンプレートフォルダ
テンプレート選択
(テンプレート階層に従って選ばれる)
読み込まれたfunctions.phpに記述された
サイト生成 設定内容を反映した形で、
選択されたテンプレートを解釈して
htmlコードが生成させる。
今回はこの詳細を考えます
ゼロからつくる WordPress テーマ #9 http://hitsuji.me 4

5. 2-2. サイト生成のフロー
サイト生成
サイト表示する投稿を
クエリ作成
リストアップする
WordPressが自動的に
やってくれる
リストアップした投稿を
テンプレート実行
順次表示する
テンプレートファイルに
自分でコードを書く
ゼロからつくる WordPress テーマ #9 http://hitsuji.me 5

6. 2-3. クエリ作成（WordPressが自動的にやってくれる）
サイトURLから表示すべき記事の種類を決めて、
ダッシュボード表示設定から表示する投稿数を決めて、ストック
サイトURLから
表示すべき記事の種類を判断
投稿ページ / カテゴリページ / タグページ or…に合わせて
ストックする記事の種類を決める
記事#1
ダッシュボード表示設定から
記事#2
表示する投稿数を決定
記事#3
ゼロからつくる WordPress テーマ #9 http://hitsuji.me 6

7. 2-4. テンプレート実行（テンプレートにコードを書く）
ループ内で、投稿を１つずつ取り出して、WP関数でその投稿のタイトルや
記事内容を出力する
ループ内の処理
the_post()
the_permalink ()
取り出した投稿のURLを出力
投稿#1
投稿#2 the_title ()
投稿#3 記事を１つ取り出す 取り出した投稿のタイトルを出力
the_content()
取り出した投稿の記事を出力
ゼロからつくる WordPress テーマ #9 http://hitsuji.me 7

8. 2-5. テンプレート実行(前ページ)のフローチャート
NO
投稿がある？
YES
NO
投稿がある？
YES
投稿を１つ取り出す
投稿のURLを出力
投稿のタイトルを出力
投稿の記事本文を出力
END
ゼロからつくる WordPress テーマ #9 http://hitsuji.me 8

9. 2-6. テンプレート実行をコードで記述
NO
1 投稿がある？
YES
NO
2 投稿がある？ 1 2 3
YES <?php if(have_posts()): while(have_posts()): the_post(); ?>
4
3 投稿を１つ取り出す <h2><a href="<?php the_permalink(); ?>">
5
4 投稿のURLを出力 <?php the_title(); ?></a></h2>
6
<?php the_content(); ?>
5 投稿のタイトルを出力
<?php endwhile; endif; ?>
6 投稿の記事本文を出力
END
ゼロからつくる WordPress テーマ #9 http://hitsuji.me 9

10. 3. 今回のまとめ＆次回予告
今回のまとめ
 サイトにアクセスすると、WordPressが自動
的にクエリを作成する
 the_post()関数で、クエリの１つの投稿が
ロードされる。
 the_title()やthe_content()関数で、ロード
された投稿のタイトルや記事本文を出力する。
次回予告
 次回も引き続き、クエリと投稿記事表示につ
いて紹介します。
ゼロからつくる WordPress テーマ #9 http://hitsuji.me 10