WordPressでの独自テーマ作成＃5（記事の詳細・一覧表示）

<?php get_header(); ?>
<div class="l-container">
      <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
                  <div class="c-ploduct__image">
                        <?php the_post_thumbnail('thumbnail'); ?>
                  </div>
                  <p class="c-ploduct__category"><?php $the_terms = get_the_terms($post->ID, "greengrocery_category");
                                                      echo $the_terms[0]->name; ?></p>
                  <p class="c-ploduct__title"><?php the_title(); ?></p>
                  <p class="c-ploduct__price"><?php echo get_field("price"); ?>円</p>
      <?php endwhile;
      endif; ?>
</div>
<?php get_footer(); ?>

<?php get_header(); ?>
<div class="l-container">
  <ul class="c-ploduct">
    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
        <li>
          <a href="<?php the_permalink(); ?>">
            <div class="c-ploduct__image">
              <?php the_post_thumbnail('thumbnail'); ?>
            </div>
            <p class="c-ploduct__category"><?php $the_terms = get_the_terms($post->ID, "greengrocery_category");
                                            echo $the_terms[0]->name; ?></p>
            <p class="c-ploduct__title"><?php the_title(); ?></p>
            <p class="c-ploduct__price"><?php echo get_field("price"); ?>円</p>
          </a>
        </li>
    <?php endwhile;
    endif; ?>
  </ul>
</div>
<?php get_footer(); ?>