質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Q&A

解決済

1回答

2785閲覧

wordpress front-page.php にメインループが表示できない。

tkm0604

総合スコア552

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

0グッド

0クリップ

投稿2021/11/25 08:17

オリジナルテーマでwordpressサイトを作成しています。

イメージ説明
front-page.phpにてTOPページを作成し、TOPページに添付画像のように 、「ブログ」の記事一覧と、「お知らせ」の一覧を表示したいです。

「ブログ」はwordpressの「投稿」機能より記事を作成しており、メインループで記事一覧を取得。
「お知らせ」はカスタム投稿タイプより記事を作成しているので、サブループ(wp_query)にて記事一覧を作成しました。

HTML

1<div id="contents_area"> 2 <div class="inner contents_inner"> 3 <div class="blog_area"> 4 <h2>ブログ</h2> 5 <?php if (have_posts()) : ?> 6 <?php while (have_posts()) : the_post(); ?> 7 <article class="blog_content"> 8 <div class="blog_img__wrap"> 9 <?php the_post_thumbnail('thumbnail', array('class' => 'blog_img')); ?> 10 <a class="blog_content__link" href="<?php the_permalink(); ?>"></a> 11 <p class="blog_category"><?php the_category(); ?></p> 12 </div> 13 <div class="blog_title_wrap"> 14 <a class="blog_title" href="<?php the_permalink(); ?>"> 15 <h3><?php echo get_the_title(); ?></h3> 16 </a> 17 <p class="blog_date"> <?php echo get_the_date(); ?></p> 18 </div> 19 </article> 20 <!--blog_content--> 21 22 <?php endwhile; ?> 23 <?php endif; ?> 24 </div> 25 <!--blog_area--> 26 <div class="info_area"> 27 <h2>お知らせ</h2> 28 <?php 29 $args = array( 30 'post_type' => 'info', 31 'posts_per_page' => 3, 32 ); 33 $the_query = new WP_Query($args); 34 if ($the_query->have_posts()) : 35 ?> 36 <?php while ($the_query->have_posts()) : $the_query->the_post(); ?> 37 <div class="info_content"> 38 <p class="info_date"><?php the_time('Y.m.d'); ?></p> 39 <a class="info_title" href="<?php the_permalink(); ?>"> 40 <h3><?php the_title(); ?></h3> 41 </a> 42 </div> 43 <!--info_content--> 44 <?php endwhile; ?> 45 <?php endif; ?> 46 </div> 47 </div> 48</div> 49<!--#blog_area--> 50

しかし、上記コードだと、

以下の添付画像のように、メインループの箇所で、front-page.phpが出力されます。

イメージ説明

HTML

1 <?php if (have_posts()) : ?> 2 <?php while (have_posts()) : the_post(); ?> 3 <article class="blog_content"> 4 <div class="blog_img__wrap"> 5 <?php the_post_thumbnail('thumbnail', array('class' => 'blog_img')); ?> 6 <a class="blog_content__link" href="<?php the_permalink(); ?>"></a> 7 <p class="blog_category"><?php the_category(); ?></p> 8 </div> 9 <div class="blog_title_wrap"> 10 <a class="blog_title" href="<?php the_permalink(); ?>"> 11 <h3><?php echo get_the_title(); ?></h3> 12 </a> 13 <p class="blog_date"> <?php echo get_the_date(); ?></p> 14 </div> 15 </article> 16 <!--blog_content--> 17 18 <?php endwhile; ?> 19 <?php endif; ?> 20 </div> 21 <!--blog_area-->

上記コードのメインループの取得でなぜ、「投稿」機能からの記事一覧ではなく、front-page.phpが出力されるのでしょうか?

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

上記コードのメインループの取得でなぜ、「投稿」機能からの記事一覧ではなく、front-page.phpが出力されるのでしょうか?

メインループは、常に「投稿記事一覧」を返すわけではありません。表示するページによって、メインループに引き渡されるデータは異なります。

WordPress では、URL やクエリストリングをもとに表示するページの内容を決定しています。表示するページによって、データベースを検索する条件がかわります。この検索された結果を表示するのがメインループです。

そのため、各テンプレートで検索内容が変わるので、メインループで表示する内容が変わります。

たとえば、ブログインデックステンプレート ( index.php ) では、メインループで投稿記事の一覧を表示します。
固定ページテンプレート ( page.php や page-*.php ) や 個別ページテンプレート( single.php や singler.php 等)の場合は、メインループで指定された「投稿ID」を持つ記事を1件表示します。


質問の場合は、テンプレートの中で、「お知らせ用のサブループ」と「ブログ用のサブループ」を使えば解決できると思います。

投稿2021/11/25 12:43

CHERRY

総合スコア25171

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

tkm0604

2021/11/26 06:29

メインループは投稿記事をループで変えずものだと思っていました。 理解が深まりました!! サブループで実装できました。 丁寧なコメントありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問