WordPressブロックエディタのクエリーループで記事一覧を作る
WordPressのクエリーループで記事一覧を作成する方法
WordPressで記事一覧を表示するには、主にWordPressループ(The Loop)を使用します。これは、指定した条件に合致する投稿を順番に表示するための基本的な仕組みです。
1. 基本的なクエリーループの構造
WordPressループの最も基本的な形は以下のようになります。
<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();
// ここに各記事の表示内容を記述
endwhile;
else :
// 投稿がない場合の処理
echo '投稿が見つかりませんでした。';
endif;
?>Code language: HTML, XML (xml)
2. クエリのカスタマイズ(WP_Queryの使用)
特定の条件で記事を抽出したい場合は、WP_Queryクラスを使用します。これにより、カテゴリ、タグ、カスタム投稿タイプ、表示件数など、様々な条件で記事をフィルタリングできます。
以下に、よく使われるWP_Queryのパラメータと使用例をいくつかご紹介します。
例1:特定のカテゴリの記事を10件表示
<?php
$args = array(
'category_name' => 'news', // 'news'というスラッグのカテゴリ
'posts_per_page' => 10, // 表示件数
);
$the_query = new WP_Query( $args );
if ( $the_query->have_posts() ) :
while ( $the_query->have_posts() ) : $the_query->the_post();
?>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<p><?php the_excerpt(); ?></p>
<p>カテゴリー: <?php the_category(', '); ?></p>
<p>投稿日: <?php the_time('Y年n月j日'); ?></p>
<hr>
<?php
endwhile;
wp_reset_postdata(); // ループ後にグローバルな投稿データをリセット
else :
echo 'このカテゴリには投稿がありません。';
endif;
?>Code language: HTML, XML (xml)
例2:カスタム投稿タイプ「product」の記事をすべて表示
<?php
$args = array(
'post_type' => 'product', // カスタム投稿タイプ名
'posts_per_page' => -1, // すべての投稿を表示
);
$the_query = new WP_Query( $args );
if ( $the_query->have_posts() ) :
while ( $the_query->have_posts() ) : $the_query->the_post();
?>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<p><?php the_excerpt(); ?></p>
<hr>
<?php
endwhile;
wp_reset_postdata();
else :
echo '製品が見つかりませんでした。';
endif;
?>Code language: HTML, XML (xml)
3. クエリーループの実装場所
これらのコードは、WordPressテーマのテンプレートファイルに記述します。一般的な場所としては以下のようなものがあります。
index.php: トップページやブログのメインページarchive.php: カテゴリ、タグ、日付などのアーカイブページcategory.php: 特定のカテゴリページpage-〇〇.php: 特定のスラッグを持つ固定ページ(テンプレートとして使用)single.php: 各記事の個別ページ(関連投稿の表示など)
4. よく使うテンプレートタグ
ループ内で各記事の情報を表示するために、以下のテンプレートタグがよく使われます。
the_permalink(): 記事のパーマリンク(URL)the_title(): 記事のタイトルthe_excerpt(): 記事の抜粋the_content(): 記事の本文the_post_thumbnail(): アイキャッチ画像the_category(): 記事が属するカテゴリthe_tags(): 記事に付与されたタグthe_author(): 記事の著者名the_time('Y年n月j日'): 記事の投稿日時(表示形式は指定可能)
5. 注意点
WP_Queryを使用した後には、必ずwp_reset_postdata()を呼び出して、グローバルな投稿データをリセットしてください。これを怠ると、後続のWordPressの機能(例: ページネーションなど)に悪影響を及ぼす可能性があります。- ループ内でのHTML構造は、表示したいデザインに合わせて自由に記述できます。CSSでスタイルを整えることを忘れずに。
WordPressテーマ 立ち上げ・運用スムーズさ比較表
一般的な評価や評判に基づいた「設定の容易さ・運用時の手間」の視点で順位付けを試みましたが、個人の経験や求める機能によって感じ方は異なりますので、あくまで参考としてご覧ください。
| 順位 | テーマ名 | 評価されるスムーズさの理由(一般的な傾向) |
| 1位 | STORK SE(ストークSE) | シンプルな設定項目と、ブログ運営に必要な機能に絞り込まれており、直感的な操作性で特に初心者から評価が高いです。 |
| 2位 | Emanon(エマノン) | シリーズによりますが、多機能ながらも設定画面が整理されており、ビジネス・ブログ向けに洗練された設計で運用しやすいという声が多いです。 |
| 3位 | LIQUID PRESS(リキッドプレス) | シンプルでモダンなデザインが多く、必要最小限の設定でサイトを構築できます。レスポンシブ対応も万全で、設定の煩雑さが少ない傾向にあります。 |
| 4位 | GOLD BLOG(ゴールドブログ) | ブログ運営に特化した機能が多く、アフィリエイトなどの収益化機能が整備されています。特定用途においては設定がスムーズです。 |
| 5位 | RE:DIVER(リダイバー) | 多機能でカスタマイズ性が高い反面、その機能の多さから設定項目も多く、使いこなすまでにやや時間がかかる場合があります。 |
| 6位 | GOLD MEDIA(ゴールドメディア) | 複数のサイトタイプに対応できる多機能テーマです。機能が豊富な分、初期設定や細かなカスタマイズに手間がかかる可能性があります。 |
| 7位 | THE THOR(ザ・トール) | SEO・高速表示・デザインカスタマイズにおいて非常に多機能・高性能です。その分、設定項目が非常に多く、初心者にとっては操作が複雑に感じられる場合があります。 |
📌 【補足】
- STORK SEやEmanonは、シンプルさと機能のバランスが良く、導入後の「書くこと」に集中しやすいという点で評価が高いです。
- THE THORは、細部までこだわりたい方には最強のテーマの一つですが、機能の多さが立ち上げのスムーズさという点ではデメリットになる傾向があります。



