בחלק זה בסדרת המאמרים "בניית תבנית WordPress" נלמד מהי The Loop, ואיך משתמשים בה על מנת להדפיס את תוכן העמוד, רשימת פוסטים וכד׳.

The Loop

The Loop, או בעברית ״הלולאה״, הוא קוד אשר בעזרתו WordPress תציג את הפוסטים שבאתר, וגם את התוכן של העמוד בו אנו צופים.
הלולאה מחולקת למספר שלבים, אך לפני שנסביר, נציג את קוד הלולאה:

<?php if ( have_posts() ) : ?>

  <?php while ( have_posts() ) : ?>

    <?php the_post(); ?>

  <?php endwhile; ?>

<?php endif; ?>

בקוד הנ״ל אנחנו שואלים קודם כל אם יש פוסטים להציג בכלל, במידה וכן, אנחנו מתחילים לרוץ בין הפוסטים, ובכל ריצה של הלולאה, אנחנו מגדירים את ה-Template Tags שישאבו את המידע מהפוסט הנוכחי ע״י שימוש בפונקציה the_post().

שימו לב! אם לא תשימו את הפונקציה הזאתי, אתם תהיו תקועים בלולאה אין סופית מכיוון שהפונקציה דואגת לקדם את מצביע המערך.

Template Tags

על מנת להציג את המידע אודות הפוסט הנוכחי, אנחנו נשתמש בפונקציות אשר אחראיות לאחזר את המידע הספציפי אודות הפוסט, לדוגמא:

  • the_title() – תדפיס את שם הפוסט
  • the_permalink() – תדפיס את הקישור לפוסט
  • the_category() – תדפיס את רשימת הקטגוריות בהם הפוסט מתוייג.

החוק היבש אומר שכל פונקציה שמתחילה עם the_ היא פונקציה אשר תדפיס את הערך. במידה ונרצה לאחזר את המידע בשביל לשמור במשתנה או לעשות מניפולציה כלשהי נשתמש בפונקציה שמתחילה ב-get_the_.

לדוגמא – the_title() תדפיס את שם הפוסט, בעוד ש-get_the_title() תחזיר את שם הפוסט.

על מנת לראות את רשימת ה-Template Tags המלאה, ניתן להיכנס ל-Codex של WordPress בקישור הבא.

חיבור הלולאה לתבנית

כעת אחרי שלמדנו בקצרה מהי הלולאה ומה הפונקציות שעוזרות לנו לאחזר את המידע על הפוסט, נחבר את הקוד לתבנית שלנו.

נפתח את הקובץ index.php ונחליף את התוכן שלו בקוד הבא:

<?php get_header(); ?>

  <!-- Main Content -->
  <section id="wrapper">

    <?php if ( have_posts() ) : ?>

      <section id="four" class="wrapper alt style1">
        <div class="inner">
          <h2 class="major"><?php esc_html_e( 'Latest Posts', 'solid-state' ); ?></h2>
          <section class="features">

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

              <?php get_template_part( 'templates/regular-post' ); ?>

            <?php endwhile; ?>

            <ul class="actions">
              <li><?php next_posts_link(); ?></li>
              <li><?php previous_posts_link(); ?></li>
            </ul>
          </section>
        </div>
      </section>

    <?php endif; ?>

  </section>
  <!-- /Main Content -->

<?php get_footer(); ?>

ובנוסף ניצור קובץ חדש בשם regular-post.php תחת התיקייה templates ונכניס בו את הקוד הבא:

<article <?php post_class(); ?>>
  <a href="<?php the_permalink(); ?>" class="image"><?php the_post_thumbnail(); ?></a>
  <h3 class="major"><?php the_title(); ?></h3>
  <?php the_excerpt(); ?>
  <a href="<?php the_permalink(); ?>" class="special"><?php esc_html_e( 'Learn more', 'solid-state' ); ?></a>
</article>

כמו שניתן לראות ב-index.php יצרנו את הלולאה אשר בכל ריצה שלה קוראת לתת-תבנית regular-posts.php אשר בתוכה אנו מציגים את התוכן של הפוסט.

אנחנו משתמשים בפונקציה post_class() על מנת להדפיס את מחלקות ה-CSS של הפוסט. בנוסף אנו משתמשים בפונקציה the_permalink() על מנת להדפיס את הקישור של הפוסט עצמו, על מנת שנוכל להיכנס ולקרוא את הפוסט עצמו. על מנת להדפיס את שם הפוסט אנו משתמשים בפונקציה the_title() ובשביל התיאור הקצר של הפוסט נשתמש בפונקציה the_excerpt(). על מנת להציג את התמונה הראשית של הפוסט (במידה והוגדרה), אנו נשתמש בפונקציה the_post_thumbnail().

סיכום

הלולאה וה-Template Tags הם שתי נושאים אשר בלעדיהם לא ניתן לבנות תבנית WordPress, הם הבסיס שלה ואנו נשתמש בהם על מנת להציג את המידע של העמוד הרלוונטי או רשימת של פוסטים.

במאמר הבא נלמד על סוגי התבניות השונות שיש ל-WordPress, מתי נשתמש בהן, והאם אנחנו באמת צריכים לבנות את כולן.

תגובות לפוסט

כתיבת תגובה

תגובה אחת

  1. אורלי

    מאמר מעולה, ממש אוהבת את הכתיבה שלך, ברורה ומסבירה בשפה פשוטה.

    1. מחבר
      דור צוברי

      תודה רבה אורלי, שמח לשמוע! 🙂

  2. אייל בורגמן

    מאמר מעולה כרגיל!
    אחד הכלים החשובים ביותר בפיתוח וורדפרס.

    1. מחבר
      דור צוברי

      תודה רבה אייל!

  3. לולה

    מעולה!
    מחכה למאמר הבא

    1. מחבר
      דור צוברי

      תודה רבה!
      מוזמנת להירשם לניוזלטר על מנת להתעדכן מתי יוצא המאמר הבא 🙂