WordPress Tema The Loop ile Yazıları Listeleme

🔁 WordPress Döngüsü (The Loop) Nedir?

WordPress’te içerikleri (yazılar, sayfalar, özel gönderi türleri) listelemek için kullanılan yapıya The Loop denir.

Yani, “sitede hangi yazılar var, her biri için başlık ve içerik ne?” gibi soruları yanıtlayan yapı budur.

📄 The Loop Temel Yapısı

<?php if (have_posts()) : ?>
  <?php while (have_posts()) : the_post(); ?>
    <!-- İçerik buraya gelir -->
  <?php endwhile; ?>
<?php else : ?>
  <p>Hiç içerik bulunamadı.</p>
<?php endif; ?>

🛠️ Uygulamalı Örnek: Yazı Başlığı ve İçeriği Listeleme

index.php dosyamızda get_header() ve get_footer() arasında aşağıdaki kodu kullanalım:

<main class="content">
  <?php if (have_posts()) : ?>
    <?php while (have_posts()) : the_post(); ?>
      <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
        <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
        <p class="post-meta">Yayın Tarihi: <?php the_time('d F Y'); ?> | Kategori: <?php the_category(', '); ?></p>
        <div class="excerpt">
          <?php the_excerpt(); ?>
        </div>
      </article>
    <?php endwhile; ?>
  <?php else : ?>
    <p>Henüz yazı eklenmemiş.</p>
  <?php endif; ?>
</main>

📝 Açıklamalar

Fonksiyon	Görevi
`the_post()`	Her yazıyı sırayla çeker
`the_title()`	Yazının başlığını gösterir
`the_permalink()`	Yazının bağlantısını getirir
`the_excerpt()`	İçeriğin kısa özetini verir
`the_time()`	Yazının tarihini biçimli şekilde gösterir
`the_category()`	Kategorilerini listelemek için
`post_class()`	Yazıya özel CSS sınıfları ekler
`the_ID()`	Yazının ID’sini verir

🖼️ Bonus: Öne Çıkan Görsel (Post Thumbnail)

Eğer functions.php dosyana add_theme_support('post-thumbnails') eklediysen, her yazının görselini gösterebilirsin:

<?php if (has_post_thumbnail()) : ?>
  <div class="post-thumbnail">
    <a href="<?php the_permalink(); ?>">
      <?php the_post_thumbnail('medium'); ?>
    </a>
  </div>
<?php endif; ?>

the_post_thumbnail() fonksiyonu ile thumbnail, medium, large, full gibi boyutlar kullanabilirsin.

💄 Stil Önerisi (CSS)

İstersen aşağıdaki gibi bir stil dosyası (style.css) ile yazı listesini biraz şıklaştırabilirsin:

.content article {
  margin-bottom: 40px;
  border-bottom: 1px solid #ddd;
  padding-bottom: 20px;
}
.post-meta {
  font-size: 0.9em;
  color: #888;
}
.post-thumbnail img {
  max-width: 100%;
  height: auto;
}

✅ Kontrol Listesi

Yazıları başarıyla listeliyor muyuz?
Her yazı başlığı tıklanabilir mi?
Özetler ve görseller çalışıyor mu?
Yazılar arasında stil farkı var mı?

🚀 Sonraki Yazı: `single.php` ve `page.php` ile Dinamik İçerik Sayfaları

Bir sonraki yazıda, bir yazıya veya sayfaya tıklanınca ne olacağını kontrol eden şablon dosyalarını (single.php, page.php) oluşturacağız. Ayrıca özel şablonlar (custom templates) ile içerikleri zenginleştirmeye başlayacağız.