記事はループのテンプレートタグと組合せる

投稿した記事を表示させる<?php the_title(); ?>や<?php the_content(); ?>は投稿したデータベースを参照させなければなりません。以下のループのphpコードの中に記事を表示するphpコードを記述すると投稿した全ての記事を表示します。

<?php if (have_posts()) : ?>
      <?php while (have_posts()) : the_post(); ?>

//ここに投稿した記事を表示させるphpコードを記述

<?php endwhile; ?>
      <?php else : ?>
          //記事が無い時にここの文章が表示する
      <?php endif; ?>

このループのコードは投稿した記事を参照する時に必ず使います。
ループのコードはこれだけ覚えて下さい。当面は大丈夫です。
しかも短くてシンプルで覚えやすいですが念のためコピペして使っていきましょう。
今のうちに言っておきますがphpは一文字あるいは１つの記号が間違っていたらブラウザで表示した時に真っ白になります。特にアラートとか出てきません。管理画面にも戻れなくなりますのでプチ・パニックになります。そんな時は慌てずブラウザで戻るで１つ前に戻り、記述したphpコードもMacでいう⌘＋Zキーで１つ前に戻るか削除して保存しましょう。

上記を踏まえて具体的に記述してみます。

<?php if (have_posts()) : ?>
      <?php while (have_posts()) : the_post(); ?>

        <div class="box1">
          <h3><a href="#"><?php the_title(); ?></a></h3>
          <p><a href="#"><?php echo wp_trim_words( get_the_content(), 20, '...' ); ?></a></p>
        </div>

      <?php endwhile; ?>
      <?php else : ?>

        <div>
          <h6>記事が投稿されていません</h6>
        </div>

      <?php endif; ?>

これで記事が表示するようになりました。