ACF图库中的ACF中继器渲染不正确

时间:2017-10-21 19:49:37

标签: php html wordpress wordpress-theming advanced-custom-fields

我正在将ACF字段添加到我的猫头鹰旋转木马中。在获取要显示的图像时起作用。我遇到了一个问题,我的代码将每个幻灯片的转发器的所有结果都吐出来,而不是一个接一个。下面是代码(一切都正确链接到Wordpress ACF字段),我附上了滑块外观的图像。

有关如何解决此问题的任何建议?

<div class="owl-carousel" id="owl-single-example">
<?php foreach ($homepage_slideshow_gallery as $homepage_slideshow_gallery):?>
    <div class="slide" style="background-image: url('<?php echo $homepage_slideshow_gallery['url']; ?>')" />
        <div class="container caption">

        <?php if( have_rows('homepage_slideshow_repeater') ): ?>
          <?php while( have_rows('homepage_slideshow_repeater') ): the_row(); ?>
            <p><?php the_sub_field('homepage_slideshow_repeater_company'); ?></p>
            <h1 class="textblock"><span><?php the_sub_field('homepage_slideshow_repeater_title'); ?></h1>
            <a class="btn" href="<?php the_sub_field('homepage_slideshow_repeater_url'); ?>">View Work</a>
          <?php endwhile; ?>
        <?php endif; ?>

        </div>
    </div>
<?php endforeach;?>

The error where all results from the repeater (Company name, title and URL) all get spit out into each slide, rather than one by one.

1 个答案:

答案 0 :(得分:1)

您的图片和字幕之间没有直接的关系,因为它们位于不同的ACF字段中,因此您自己更难以正确地创建该关联。

我的建议是将图片字段直接添加到您的图片中 homepage_slideshow_repeater转发器字段,而不是使用单独的库字段。

1:使用以下设置编辑包含转发器的字段组,并为其添加另一个子字段:

  • 字段类型:内容:图片

  • 返回值:图片网址

只返回图片网址,我们就可以直接将其用于背景图片网址。

2:接下来编辑您的主页,并将相应的滑块图像直接添加到转发器的标题,标题等旁边

3:现在在您的代码中,您只需要循环一次,因为所有相关信息都在同一个转发器行中。你会使用这样的东西(使用字段名称&#34; slide_image&#34;用于图像):

<?php if( have_rows('homepage_slideshow_repeater') ): ?>
   <div class="owl-carousel" id="owl-single-example">
    <?php while( have_rows('homepage_slideshow_repeater') ): the_row(); ?>

       /* get the image from the repeater - the content will be just the url so we can use it directly */
       <div class="slide" style="background-image: url('<?php the_sub_field('slide_image'); ?>')" />

           /* now add the caption etc for this image to the slide */
           <div class="container caption">
             <p><?php the_sub_field('homepage_slideshow_repeater_company'); ?></p>
             <h1 class="textblock"><span><?php the_sub_field('homepage_slideshow_repeater_title'); ?></h1>
             <a class="btn" href="<?php the_sub_field('homepage_slideshow_repeater_url'); ?>">View Work</a>    
          </div>
       </div>

    <?php endwhile; ?>
  </div>
<?php endif; ?>

请注意,这只是我的头顶和未经测试,但它应该让你知道所需要的是什么。