douping7975 2016-10-12 02:55
浏览 42
已采纳

ACF奇/偶中继器

I'm trying to create a two column element using ACF repeater fields. The only thing is I'm trying to alternate this so that the content in the two columns switches left/right depending on the row being even or odd.

The output will look something like:

Row 1: Image (left column), Description (right column)

Row 2: Description (left column), Image (right column)

Row 3: Image (left column), Description (right column)

Row 4: Description (left column), Image (right column)

.

.

.

This is how I looped it:

<section id="projects" class="container specific-margin-1">
        <div class="row specific-padding-4">
            <div class="container col-lg-12">
                <center><h2>FEATURED PROJECTS</h2></center>
            </div><!-- col-lg-12  --> 
        </div><!-- row  -->

            <!-- Repeater --> 
            <div class="row">
            <?php $row = 0; //<-- set your counter to 0
                        if(get_field('featured_projects')): ?>
            <?php while(has_sub_field('featured_projects')): ?>

                <?php if ($counter % 2 === 0) :?>
                <div class="row">
                    <!-- right column -->
                    <div class="col-lg-9 col-md-8 col-sm-6">
                        <img src="<?php the_sub_field('project_image'); ?>" />
                    </div>

                    <div class="col-lg-3 col-md-4 col-sm-6">
                            <?php the_sub_field('project_details'); ?>
                    </div><!-- right column -->
                </div>

                <?php else: ?>

                <div class="row">
                    <!-- left column -->
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <?php the_sub_field('project_details'); ?>
                    </div>

                    <div class="col-lg-9 col-md-8 col-sm-6">
                        <img src="<?php the_sub_field('project_image'); ?>" />
                    </div><!-- left column -->
            </div>
            <?php endif; ?>

            <?php $row++; endwhile; ?>

            <?php endif; ?>
        </div><!-- Repeater -->
    </section>
  • 写回答

1条回答 默认 最新

  • dongpu9481 2016-10-12 06:07
    关注

    Make sure to change your ACF Image field to 'Image Array':

    ACF Image Field

    <!-- Repeater -->
    <div class="row">
      <?php $i=0 ; if(get_field( 'featured_projects')): ?>
      <?php while(has_sub_field( 'featured_projects')): $i++; ?>
      <?php $image=get_sub_field( 'project_image'); ?>
      <div class="row">
        <!-- right column -->
        <div class="col-lg-9 col-md-8 col-sm-6">
          <?php if (($i % 2)==0 ): ?>
          <?php the_sub_field( 'project_details'); ?>
          <?php else: ?>
          <img src="<?php echo $image['url']; ?>" />
          <?php endif; ?>
        </div>
    
        <div class="col-lg-3 col-md-4 col-sm-6">
          <?php if (($i % 2)==0 ): ?>
          <img src="<?php echo $image['url']; ?>" />
          <?php else: ?>
          <?php the_sub_field( 'project_details'); ?>
          <?php endif; ?>
        </div>
        <!-- right column -->
      </div>
    
      <?php endwhile; ?>
    
      <?php endif; ?>
    </div>
    <!-- Repeater -->

    </div>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 关于#hadoop#的问题
  • ¥15 (标签-Python|关键词-socket)
  • ¥15 keil里为什么main.c定义的函数在it.c调用不了
  • ¥50 切换TabTip键盘的输入法
  • ¥15 可否在不同线程中调用封装数据库操作的类
  • ¥15 微带串馈天线阵列每个阵元宽度计算
  • ¥15 keil的map文件中Image component sizes各项意思
  • ¥20 求个正点原子stm32f407开发版的贪吃蛇游戏
  • ¥15 划分vlan后,链路不通了?
  • ¥20 求各位懂行的人,注册表能不能看到usb使用得具体信息,干了什么,传输了什么数据