奇數/甚至在PHP循環中的html不正確交替

Question

我一直在尋找這裏的問題/答案，但似乎無法找到適合我的代碼的東西。

我發現的大多數解決方案都會導致整個頁面出現500錯誤。他們通常只是奇數/偶數的php片段，並不適合我輕鬆整合php自定義的post type循環。我可能只是沒有把它放在正確的地方，但似乎沒有任何工作。

我不是超級棒的php，但這是我一直有一個問題上班的一件事。

目標： 奇怪的職位有左頭像，生物信息在右邊。 即使帖子右側有爆頭，左側是生物信息。

以下是我的代碼，其中確實在頁面上加載了（沒有500錯誤），但不輸出交替佈局，只是輸出相同的佈局，就好像我沒有奇數/偶數代碼一樣。

<?php // theloop 
    if (have_posts()) : while (have_posts()) : the_post(); ?> 
    <?php $loop = new WP_Query(array('post_type' => 'team', 'posts_per_page' => -1, 'order' => 'ASC')); ?> 
    <?php while ($loop->have_posts()) : $loop->the_post(); ?> 
    <?php if ($wp_query->current_post % 2 == 0): ?> 

     <div class="row team-member"> <!--ODD LAYOUT // HEADSHOT LEFT - BIO RIGHT--> 
      <div class="container"> 
       <div class="row is-table-row"> 
        <div class="col-sm-6 headshot" style="background-image:url(<?php the_field('bio_photo'); ?>);"> 
         <div class="box"> 
         </div> 
        </div> 
        <div class="col-sm-6 bio cream-bg"> 
         <div class="box"> 
          <?php if(get_field('additional_logo')): ?> 
            <div class="additional-logo"><img src="<?php the_field('additional_logo'); ?>"></div> 
          <?php endif; ?> 
          <h2><?php the_field('name'); ?></h2> 
          <div class="bio-content"><?php the_field('bio'); ?></div> 

          <div class="contact-container"> 
           <h4>Contact me!</h4> 
           <?php if(get_field('phone_number')): ?> 
            <p><i class="fa fa-phone" aria-hidden="true"></i> <?php the_field('phone_number'); ?></p> 
           <?php endif; ?> 
           <p><i class="fa fa-envelope" aria-hidden="true"></i> <a href="mailto:<?php the_field('email'); ?>" target="_top"><?php the_field('email'); ?></a></p> 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 

    <?php else: ?> 

     <div class="row team-member"> <!--EVEN LAYOUT // HEADSHOT RIGHT - BIO LEFT--> 
      <div class="container"> 
       <div class="row is-table-row"> 
        <div class="col-sm-6 bio cream-bg"> 
         <div class="box"> 
          <?php if(get_field('additional_logo')): ?> 
            <div class="additional-logo"><img src="<?php the_field('additional_logo'); ?>"></div> 
           <?php endif; ?> 
          <h2><?php the_field('name'); ?></h2> 
          <div class="bio-content"><?php the_field('bio'); ?></div> 

          <div class="contact-container"> 
           <h4>Contact me!</h4> 
           <?php if(get_field('phone_number')): ?> 
            <p><i class="fa fa-phone" aria-hidden="true"></i> <?php the_field('phone_number'); ?></p> 
           <?php endif; ?> 
           <p><i class="fa fa-envelope" aria-hidden="true"></i> <a href="mailto:<?php the_field('email'); ?>" target="_top"><?php the_field('email'); ?></a></p> 
          </div> 
         </div> 
        </div> 
        <div class="col-sm-6 headshot" style="background-image:url(<?php the_field('bio_photo'); ?>);"> 
         <div class="box"> 
         </div> 
        </div> 

       </div> 
      </div> 
     </div>  

<?php endif ?>  
<?php endwhile; wp_reset_query(); ?> 

有什麼我做錯了這裏，或較好地解決了呢？我很沮喪，理論上這是一個簡單的請求，我似乎無法正常工作。任何幫助深表感謝！

Answer 1

好的，專業提示：程序員很懶。我們喜歡DRY原則。我們不喜歡重複代碼，也不喜歡維護巨大的重複代碼塊。

所以，下面是你的循環的修改版本，它稍微簡單一些，重複性較低。我鼓勵你考慮其他減少重複的方法，例如，使用CSS類（可能是浮點數）替換左邊或右邊的內容，並且只渲染HTML的一個版本。

具體問題是，您沒有訪問正確查詢對象的$current_post屬性。您應該使用$loop->current_post而不是$wpdb->current_post。然而，爲了超清晰/明確，我會手動設置一個計數器，並使用它來代替：

<?php // theloop 
    if (have_posts()) : while (have_posts()) : the_post(); ?> 
    <?php $loop = new WP_Query(array('post_type' => 'team', 'posts_per_page' => -1, 'order' => 'ASC')); ?> 
    <?php 
     // initialize the counter here 
     $post_count = 0; 
     while ($loop->have_posts()) : $loop->the_post(); ?> 
     <div class="row team-member"> 
      <div class="container"> 
       <div class="row is-table-row"> 
        <?php 
        // move the if condition here to reduce/simplify code 
        // reference (and increment) the counter 
        if ($post_count++ % 2 == 0): ?> 
        <div class="col-sm-6 headshot" style="background-image:url(<?php the_field('bio_photo'); ?>);"> 
         <div class="box"> 
         </div> 
        </div> 
        <div class="col-sm-6 bio cream-bg"> 
         <div class="box"> 
          <?php if(get_field('additional_logo')): ?> 
            <div class="additional-logo"><img src="<?php the_field('additional_logo'); ?>"></div> 
          <?php endif; ?> 
          <h2><?php the_field('name'); ?></h2> 
          <div class="bio-content"><?php the_field('bio'); ?></div> 
          <div class="contact-container"> 
           <h4>Contact me!</h4> 
           <?php if(get_field('phone_number')): ?> 
            <p><i class="fa fa-phone" aria-hidden="true"></i> <?php the_field('phone_number'); ?></p> 
           <?php endif; ?> 
           <p><i class="fa fa-envelope" aria-hidden="true"></i> <a href="mailto:<?php the_field('email'); ?>" target="_top"><?php the_field('email'); ?></a></p> 
          </div> 
         </div> 
        </div> 
       <?php else: ?> 
        <div class="col-sm-6 bio cream-bg"> 
         <div class="box"> 
          <?php if(get_field('additional_logo')): ?> 
            <div class="additional-logo"><img src="<?php the_field('additional_logo'); ?>"></div> 
           <?php endif; ?> 
          <h2><?php the_field('name'); ?></h2> 
          <div class="bio-content"><?php the_field('bio'); ?></div> 

          <div class="contact-container"> 
           <h4>Contact me!</h4> 
           <?php if(get_field('phone_number')): ?> 
            <p><i class="fa fa-phone" aria-hidden="true"></i> <?php the_field('phone_number'); ?></p> 
           <?php endif; ?> 
           <p><i class="fa fa-envelope" aria-hidden="true"></i> <a href="mailto:<?php the_field('email'); ?>" target="_top"><?php the_field('email'); ?></a></p> 
          </div> 
         </div> 
        </div> 
        <div class="col-sm-6 headshot" style="background-image:url(<?php the_field('bio_photo'); ?>);"> 
         <div class="box"> 
         </div> 
        </div> 
        <?php endif; ?>  
       </div> 
      </div> 
     </div>  
<?php endwhile; wp_reset_query(); ?>