WordPress

✅【初心者向け🔰】WordPressのループ(The Loop)をやさしく解説!

WordPressのカスタマイズを始めると必ず出てくるのが、
「ループ(The Loop)」という言葉です🔄

でも最初は「ループって何?何してるの?💦」ってなりがちですよね。
この記事では、初心者向けにループの意味と使い方をやさしく解説していきます!


WordPressのループ(The Loop)とは?🌀

ループ(The Loop)とは、
WordPressが記事(投稿や固定ページ)を1件ずつ取り出して表示する仕組みのことです✨

たとえばブログ一覧ページでは、
✅ 記事タイトル
✅ 記事本文の一部(抜粋)
✅ 投稿日やカテゴリ名

こういった情報を繰り返し一覧表示しますよね?

この「繰り返す処理」が、WordPressでいう「ループ」です♻️


ループの基本構造を覚えよう🧱

WordPressのループは、基本的にこの形です!

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

    <!-- ここに記事ごとの表示内容を書く -->
    <h2><?php the_title(); ?></h2>
    <div><?php the_content(); ?></div>

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

  <p>記事が見つかりませんでした。</p>

<?php endif; ?>

📝ポイントまとめ

  • have_posts() → 投稿が存在するかチェック!
  • the_post() → 投稿データを1件セット!
  • the_title() → 記事タイトルを出力!
  • the_content() → 記事本文を出力!

have_posts()trueならwhileで繰り返し、
なければelseで「記事がありません」と表示します📜


具体的なイメージ例📚

例えば、3つ記事があるときはこんなイメージになります!

1️⃣ 最初のhave_posts()チェック → OK → 1記事目を表示
2️⃣ 次のhave_posts()チェック → OK → 2記事目を表示
3️⃣ 次のhave_posts()チェック → OK → 3記事目を表示
4️⃣ 次のhave_posts()チェック → NG → 繰り返し終了!

こんなふうに、投稿があるかぎりぐるぐる回るのが「ループ」です🔄


よくあるカスタマイズ例🎨

ループの中では、いろんな記事情報を取り出せます!

<article>
  <a href="<?php the_permalink(); ?>">
    <h2><?php the_title(); ?></h2>
  </a>
  <time datetime="<?php echo get_the_date('c'); ?>">
    <?php echo get_the_date(); ?>
  </time>
  <p><?php the_excerpt(); ?></p>
</article>

ここでは、

  • the_permalink() → 記事のリンクURLを出力
  • get_the_date() → 投稿日を取得
  • the_excerpt() → 抜粋(要約)を出力

こんなふうに、記事ごとに色々な情報を表示できるんです!🎉


【注意点】ループは正しく閉じること🛑

ループは、
if ( have_posts() )
while ( have_posts() )
endwhile;
endif;

このように、**きちんと閉じる(終わらせる)**ことが大事です!

忘れると表示崩れやエラーにつながるので、注意しましょう⚡


まとめ🧹

WordPressのループ(The Loop)は、
投稿を一覧表示したり、記事を1件ずつ取り出して表示するための超基本です✅

覚えるポイントは、

  • have_posts()the_post()をセットで使う
  • the_title()the_content()で情報を表示する
  • ループはきちんと閉じる

これだけ押さえておけば、
カスタマイズも怖くなくなりますよ!💪✨

ぜひ手を動かして、ループをマスターしていきましょう!


【次に読みたい関連記事📚】


✨おわりに

ループは「最初はちょっとややこしいけど、一回理解すれば超シンプル」です!
何度もコードを書いて、体で覚えていきましょう✍️💥


✉️ あなたのリクエスト教えてください!

「この記事わかりやすかった!」
「他にもこんな記事書いてほしい!」
そんな声を、ぜひXのDMで教えてください!😊📩

できるだけリクエストにお応えして、今後の記事作成に活かしていきます

▶️ Xもフォローしてもらえるとめちゃくちゃ嬉しいです!

hisa

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA