为奇数和&更改HTML偶数foreach循环中的项目

时间:2017-03-24 12:09:52

标签: php wordpress foreach meta-boxes

我的PHP不是很棒! 我在wordpress网站上有一些显示列类型布局的元文件。我可以按如下方式输出元数据内容:

<?php 
	// Group ID
    $columns_values = rwmb_meta( 'columns_solutions' );
    if ( ! empty( $columns_values ) ) : ?>

<section class="columns">

  <?php foreach ( $columns_values as $columns_value ) {

        	// Grab the image
            $columns_imgs = isset( $columns_value['_rtl_column_solutions_image'] ) ? $columns_value['_rtl_column_solutions_image'] : array();
            foreach ( $columns_imgs as $columns_img ) {
            	// Set each image size for the responsive background
                $column_image_lg = RWMB_Image_Field::file_info( $columns_img, array( 'size' => 'column-lg' ) );
                $column_image_md = RWMB_Image_Field::file_info( $columns_img, array( 'size' => 'column-md' ) );
                $column_image_sm = RWMB_Image_Field::file_info( $columns_img, array( 'size' => 'column-sm' ) );
                $column_image_xs = RWMB_Image_Field::file_info( $columns_img, array( 'size' => 'column-xs' ) );
            } 

            // Grab the title, oversized text and general text
            $column_title = isset( $columns_value['_rtl_columns_title'] ) ? $columns_value['_rtl_columns_title'] : array();
            $column_oversized = isset( $columns_value['_rtl_columns_oversized'] ) ? $columns_value['_rtl_columns_oversized'] : array();
            $column_general_txt = isset( $columns_value['_rtl_columns_general_text'] ) ? $columns_value['_rtl_columns_general_text'] : array();

        ?>
  <div class="columns-wrapper">
    <div class="column">
      <?php if(!empty($column_title)) { ?>
      <div class="section-title">
        <h2>
          <?php echo $column_title; ?>
        </h2>
      </div>
      <!-- /.section-title -->
      <?php } ?>

      <?php if(!empty($column_oversized)) { ?>
      <div class="oversized">
        <?php echo $column_oversized; ?>
      </div>
      <!-- /.oversized -->
      <?php } ?>

      <?php if(!empty($column_general_txt)) { ?>
      <?php echo wpautop($column_general_txt); ?>
      <?php } ?>
    </div>
    <!-- /.column -->

    <div class="column">
      <div class="image min-height cover bg-responsive" style="background-image: url(<?php echo LAZY_IMG; ?>);" 
            data-lg="<?php echo $column_image_lg['url']; ?>" 
            data-md="<?php echo $column_image_md['url']; ?>" 
            data-sm="<?php echo $column_image_sm['url']; ?>"
            data-xs="<?php echo $column_image_xs['url']; ?>">
      </div>
      <!-- /.image -->
    </div>
    <!-- /.column -->
  </div>
  <!-- /.column-wrapper -->

  <?php } ?>
</section>
<!-- /.columns -->
<?php endif; ?>

输出如下:

enter image description here

这是一个可克隆的元组,我希望能够将每个奇数甚至是foreach循环/数组的内容和图像(左和右)交换。

1 个答案:

答案 0 :(得分:1)

我觉得很蠢,我只需要计算帖子并输出替代html。

我将上面的代码包装在此:

&#13;
&#13;
<?php $counter = ""; 
      foreach ( $columns_values as $columns_value ) {
      $counter +=1; 
            
      // all my var stuff here
            
?>

<?php if($counter == 1) { ?>
<div class="columns-wrapper odd">
  <!-- HTML here for the first loop -->
</div>

<?php }
      // If the second item in the loop
      elseif($counter == 2) { 
      // Reset the counter
      $counter = 0; 
      ?>


<div class="columns-wrapper even">
  <!-- Other HTML here for the second loop -->
</div>

<?php } //end the elseif $counter ?>

<?php } //end the foreach stuff ?>
&#13;
&#13;
&#13;