这是对 WP_Query 的有效使用吗？

Question

我一直在 Wordpress 中使用高级自定义字段和自定义帖子类型 UI 插件在单页主题上创建可编辑部分。我想知道我所做的是否有效？如果您注意到，我已经打开和关闭了很多循环，仅仅是因为我不希望 HTML 标记获得超出其需要的输出。我只是想知道是否有更好的方法可以做到这一点，或者我什至可以在不使用 WP_Query 和只使用常规 Wordpress 循环的情况下做到这一点？

<?php
  $args = array(
    'post_type' => array(
       'visibility_section',
       'credibility_section',
       'social_media',
       'donations_section',
       'crowdfunding_section'
      )
  );

  $query = new WP_Query( $args );
?>

<section class="row" id="visibility"><!-- Start visibility section -->
  <div class="container">
    <h4 class="text-xs-center m-b-3">Visibility</h4>
    <div class="col-md-6">
      <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
        <?php the_field( 'visibility_left_column' ); ?>
      <?php endwhile; endif; wp_reset_postdata(); ?>
    </div>
    <div class="col-md-6">
      <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
        <?php if( get_field( 'visibility_image' ) ): ?>
            <img class="visibility_image m-b-3 img-fluid" src="<?php the_field( 'visibility_image'); ?>" />
        <?php endif; ?>
      <?php endwhile; endif; wp_reset_postdata(); ?>
    </div>
    <div class="col-md-12 text-xs-center">
      <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
        <?php the_field( 'visibility_bottom' ); ?>
      <?php endwhile; endif; wp_reset_postdata(); ?>
    </div>
  </div>
</section>

<section class="row" id="credibility"><!-- Start Credibility section -->
  <div class="container">
  <hr>
    <h4 class="text-xs-center m-b-3">Credibility</h4>
    <div class="col-sm-12">
      <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
        <?php the_field( 'credibility_top' ); ?>
      <?php endwhile; endif; wp_reset_postdata(); ?>
      <div class="text-xs-center">
        <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
          <img src="<?php the_field( 'credibility_image' ); ?>" class="img-fluid m-x-auto"/>
        <?php endwhile; endif; wp_reset_postdata(); ?>
      </div>
    </div>
</section><!-- End Credibility section -->

<section class="row" id="social-media"><!-- Start Social Media Exposure section -->
  <div class="container">
  <hr>
    <h4 class="text-xs-center m-b-3">Social Media Exposure</h4>
    <div class="col-md-4">
    <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
      <?php the_field( 'social_left_column' ); ?>
    <?php endwhile; endif; wp_reset_postdata(); ?>
    </div>
    <div class="col-md-4">
      <div class="text-xs-center">
        <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
        <img src="<?php the_field( 'social_mid_image' ); ?>" class="img-fluid" />
        <?php endwhile; endif; wp_reset_postdata(); ?>
      </div>
    </div>
    <div class="col-md-4">
      <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
      <?php the_field( 'social_right_column' ); ?>
      <?php endwhile; endif; wp_reset_postdata(); ?>
    </div>
  </div>
</section><!-- End Social Media Exposure section -->

<section class="row" id="donations"><!-- Start Donations Section-->
  <div class="container">
  <hr>
    <h4 class="text-xs-center m-b-3">Donations</h4>
    <div class="col-md-4">
      <div class="text-xs-center">
      <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
        <img src="<?php the_field( 'donations_left_image' ); ?>" class="img-fluid" />
      <?php endwhile; endif; wp_reset_postdata(); ?>
      </div>
    </div>
    <div class="col-md-8">
      <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
      <?php the_field( 'donations_right_column' ); ?>
      <?php endwhile; endif; wp_reset_postdata(); ?>
    </div>
  </div>
</section><!-- End Donations section -->

<section class="row" id="crowdfunding"><!-- Start Crowdfunding Section-->
  <div class="container">
  <hr>
    <h4 class="text-xs-center m-b-3">Crowdfunding</h4>
    <div class="col-md-7">
      <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
        <?php the_field( 'crowd_left_column' ); ?>
      <?php endwhile; endif; wp_reset_postdata(); ?>
    </div>
    <div class="col-md-5">
      <?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
        <img src="<?php the_field( 'crowd_right_image' ); ?>" class="img-fluid" />
      <?php endwhile; endif; wp_reset_postdata(); ?>
    </div>
  </div>
</section><!-- End Donations section -->

Answer 1

这样会更有效，执行一个循环并在该循环中创建所有需要的变量。

<?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
       <?php $x['visibility_left_column'] = get_field( 'visibility_left_column' ); ?>
       <?php $x['visibility_image']       = get_field( 'visibility_image' ); ?>
       <?php $x['visibility_bottom']      = get_field( 'visibility_bottom' ); ?>
       <?php // ... ?>
<?php endwhile; endif; wp_reset_postdata(); ?>

<section class="row" id="visibility"><!-- Start visibility section -->
  <div class="container">
    <h4 class="text-xs-center m-b-3">Visibility</h4>
    <div class="col-md-6">
      <?php echo $x['visibility_left_column']; ?>
    </div>
    <div class="col-md-6">
      <?php $x['visibility_image'] : ?>
            <img class="visibility_image m-b-3 img-fluid" src="<?php echo $x['visibility_image']; ?>" />
        <?php endif; ?>
    </div>
    <div class="col-md-12 text-xs-center">
      <?php echo $x['visibility_bottom']; ?>
    </div>
  </div>
</section>
<!-- ... -->

或者在所有 html 周围包裹一个循环

<?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
  <section class="row" id="visibility"><!-- Start visibility section -->
    <div class="container">
      <h4 class="text-xs-center m-b-3">Visibility</h4>
      <div class="col-md-6">
        <?php the_field( 'visibility_left_column' ); ?>
      </div>
      <div class="col-md-6">
        <?php if( get_field( 'visibility_image' ) ): ?>
            <img class="visibility_image m-b-3 img-fluid" src="<?php the_field( 'visibility_image'); ?>" />
        <?php endif; ?>
      </div>
      <div class="col-md-12 text-xs-center">
        <?php the_field( 'visibility_bottom' ); ?>
      </div>
    </div>
  </section>
  <!-- ... -->

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