WordPressのメイン投稿がメインループ内で出力されません。

Question

初めてWordPressでウェブサイトを作っています。
自分のポートフォリオを載せるため、
single.phpをつかってメイン投稿を作成し、このページ自体はうまく動いているのですが、いざポートフォリオ一覧(portfolio.php)にメイン投稿をループさせようとすると、なぜか一覧の内容が出力されてしまいます...
有識者の方お力添えをお願いいたします...

ポートフォリオ一覧(portfolio.php)のURL:
https://example.com/portfolio-index/
ポートフォリオの詳細として使っているメイン投稿(single.php)のURL:
https://example.com/%postname%/

※煮るに煮詰まって初めて投稿していますので失礼などありましたら申し訳ありません...

portfolio.php内の記述

      <?php if (have_posts()): ?>
      <?php while (have_posts()):
        the_post(); ?>
      <!-- ループしたいHTML -->
      <div class="grid-item">
          <a href="<?php the_permalink(); ?>" class="portfolio__item__detail-link">
            <?php the_post_thumbnail(null, array(‘class’ => ‘grid-item__img’)); ?>
          </a>
      </div>
      <?php
        endwhile;
        else:
      ?>
      <div class="no-post__container">
        <p class="no-post__text">Coming soon...</p>
      </div>
      <?php endif; ?>

###検証で出力される内容

<!-- ループしたいHTML -->
      <div class="grid-item" style="position: absolute; left: 0px; top: 0px;">
          <a href="https://example.com/portfolio-index/" class="portfolio__item__detail-link"></a>
      </div> 
    </div>

尚、single.phpの冒頭には下記の記述が記入されています。

    <?php get_header();
    the_post();

    //カテゴリーの取得
    $cat = get_the_category();
    $slug = $cat[0]->slug;
    $name = $cat[0]->name;
    
    // 投稿者ID取得
    $user_id = get_the_author_meta('ID');?>

single.php内のアイキャッチ画像なども既に指定しています。
試しにthe titleなどを出力したら、やはりportfolio-indexが表示されたので、
一覧ページの中に一覧ページが出力されてしまっています。
別に作っているカスタム投稿(single-news.php)は別で問題なく出力できました。

何卒アドバイスの程よろしくお願いいたします。

Comments

[tabuu]

>いざポートフォリオ一覧(portfolio.php)にメイン投稿をループさせようとすると、なぜか一覧の内容が出力されてしまいます...

どのようにメイン投稿を取得されていますか？

[neue]

すみません…
Single.phpに設定した時点でメイン投稿と判断されて
<?php if (have_posts()): ?>
<?php while (have_posts()):
the_post(); ?>
を書けば取得されると思ってたのですが… 何か他に必要な記述がありましたでしょうか汗

Answer 1

https://example.com/portfolio-index/
は固定ページですかね？

WP_Queryを使ってデータを取得してからループするようにしてください。
ググると解説サイトがたくさんでてきます。

※pre_get_postsをフックしてデータを取得するとテンプレートはそのままで動きますが、難易度は高くなりますのでスキルに合わせて実装方法を選んでください。

Comments

[neue]

WP_Queryで検索して記述追加したらできました！！！
どうもありがとうございました涙

Answer 2

エラーが出て出力されていないのではないでしょうか。

//                     全角     ↓     ↓    ↓              ↓
the_post_thumbnail(null, array(‘class’ => ‘grid-item__img’));

【WordPress初心者におすすめ！デバッグモードの使い方 | Mignon Style】
https://mignonstyle.com/debug-mode/

Comments

[neue]

回答ありがとうございました！
全角になってるとは！見落としてました…が、出力に関しては変わらずでした…