【问题标题】:using wp_get_attachment_image_src in foreach loop在 foreach 循环中使用 wp_get_attachment_image_src
【发布时间】:2018-04-30 08:45:16
【问题描述】:

我通过高级自定义字段将 10 张图片添加到帖子中,它们的名称从 1 到 10,例如“image_*”,ACF 设置为返回 ID。

我正在尝试获取循环中每个图像的全尺寸图像 URL 并将其用作 href 属性以打开图像的全尺寸弹出窗口,但是我不明白 wp_get_attachment_image_src 的工作原理。

由于我无法使用高级自定义字段的中继器,这是我用来获取自定义图像大小为scaled 的图像数组的循环,它可以很好地生成我的响应式图像标记需要:

// args    

$sizeHuge = 'scaled'; // scaled image  
$images = array(); // img array

for($x = 1; $x <= 10; $x++) { 
        $img = get_field('image_' . $x);
   if($img) {
        $images[] = $img; 
   } else {
        break;
   }
 }


<?php foreach($images as $image) { ?>

    <a href="" class="open-viewer">

        <?php echo wp_get_attachment_image( $image, $sizeHuge ); ?>

    </a>

<?php } ?>

我需要使用图像的 URL 设置父 a 元素的 href 属性。这是我用 wp_get_attachment_image_src 尝试过的,它不起作用,它将每个 href 设置为 image_10 的 URL。

// args

$sizeFull = 'full'; // full size image
$sizeHuge = 'scaled'; // scaled image  
$images = array(); // img array

for($x = 1; $x <= 10; $x++) { 
        $img = get_field('image_' . $x);
        $image_array = wp_get_attachment_image_src($img, $sizeFull);
        $link = $image_array[0];                
   if($img) {
        $images[] = $img; 
   } else {
        break;
   }
 }


<?php foreach($images as $image) { ?>

    <a href="<?php echo $link; ?>" class="open-viewer">

        <?php echo wp_get_attachment_image( $image, $sizeHuge ); ?>

    </a>

<?php } ?>

我的问题是:如何将a.open-viewerhref 设置为正确的URL?其次,为什么我的代码会失败? (调试已开启,但未出现错误)。

我意识到我在这里严重误解了一些东西,我是 PHP 新手,所以对于我的方法的任何建议将不胜感激。

【问题讨论】:

  • 您是在转发器字段中添加图像还是创建了 10 个具有不同 id 的不同字段?
  • @Balwant 不,我无法使用中继器扩展,所以我创建了十张具有不同 ID 的图像。

标签: wordpress foreach advanced-custom-fields


【解决方案1】:

在您的第一个块中,在您的循环中,您将 $link 的值设置为 $image_array[0] 的值,但您每次都将其覆盖。你想在这里array_push

$images = array();
for($x = 1; $x <= 10; $x++) { 
  $img = get_field('image_' . $x);
  $image_array = wp_get_attachment_image_src($img, $sizeFull);       

  if($image_array && $image_array[0]) {
    array_push($images, 
        array(
           src => $image_array[0],
           id => $img
        )
    ); 
  } else {
    break;
  }
}

现在,当你遍历第二个数组时,你可以这样做:

<?php foreach($images as $image) { ?>
   <a href="<?php echo $image['src']; ?>" class="open-viewer">
      <?php echo wp_get_attachment_image( $image['id'], $sizeHuge ); ?>
   </a>
<?php } ?>

href的值应该是图片的URL。

【讨论】:

  • 顺便说一句,$sizeHuge$sizeFull 作为常量更易读(并且在语义上更正确)。 const SIZE_FULL = "full";
  • 谢谢,现在完美地创建了a 标签,但是根本没有创建&lt;img&gt; 标记,我怀疑这与不使用wp_get_attachment_imagewp_get_attachment_image_src 有关一起?你给了我一个很好的起点,谢谢你的帮助
  • @DavidAlsbright - 查看更新的答案,wp_get_attachment_image 将图像附件 ID 作为其第一个参数,您似乎是从 get_field 获得的。更新后的代码应该可以让您访问原始循环中的 ID。
【解决方案2】:

以下是适用于您的更新/更正代码:

 <?php

   // args

    $sizeFull = 'full'; // full size image
    $sizeHuge = 'scaled'; // scaled image  
    $images = array(); // img array

    for($x = 1; $x <= 10; $x++) { 
            $img = get_field('image_' . $x);
       if($img) {
            $images[] = $img; 
       } else {
            break;
       }
     }


    <?php foreach($images as $image) { 
          $image_array = wp_get_attachment_image_src($image, $sizeFull);
          $link = $image_array[0];  
         ?>

        <a href="<?php echo $link; ?>" class="open-viewer">

            <?php echo wp_get_attachment_image( $image, $sizeHuge ); ?>
            // or Rather than calling above function, why don't you write <img> tag as you already have image url ? Like:
            <img src="<?php echo $link; ?>" class="">

        </a>

    <?php } ?>

【讨论】:

  • 如果由于任何原因,wp_get_attachment_image_src() 没有找到附件,则返回 false。在这种情况下尝试访问布尔值的数组索引时,此代码将失败。
猜你喜欢
  • 2015-07-04
  • 1970-01-01
  • 1970-01-01
  • 2015-07-15
  • 2017-10-19
  • 2013-07-31
  • 2013-12-26
  • 2015-09-23
  • 1970-01-01
相关资源
最近更新 更多