在 foreach 循环中使用 wp_get_attachment_image_src
using wp_get_attachment_image_src in foreach loop
我通过高级自定义字段将 10 张图像添加到 post,它们的名称从 1 到 10,例如 'image_*',ACF 设置为 return ID。
我正在尝试获取循环中每个图像的全尺寸图像 URL 并将其用作 href
属性以打开图像的全尺寸弹出窗口,但是我没有不明白 wp_get_attachment_image_src 是如何工作的。
由于我无法使用 Advanced Custom Field 的 Repeater,这是我用来获取自定义图像大小为 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-viewer
的 href
设置为正确的 URL?其次,为什么我的代码会失败? (调试已打开但未出现错误)。
我意识到我在这里误解了一些东西,我是一个 PHP 新手,所以任何关于我的方法的建议都将不胜感激。
在您的第一个块中,在您的循环中,您将 $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。
以下是适合您的 updated/corrected 代码:
<?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 } ?>
我通过高级自定义字段将 10 张图像添加到 post,它们的名称从 1 到 10,例如 'image_*',ACF 设置为 return ID。
我正在尝试获取循环中每个图像的全尺寸图像 URL 并将其用作 href
属性以打开图像的全尺寸弹出窗口,但是我没有不明白 wp_get_attachment_image_src 是如何工作的。
由于我无法使用 Advanced Custom Field 的 Repeater,这是我用来获取自定义图像大小为 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-viewer
的 href
设置为正确的 URL?其次,为什么我的代码会失败? (调试已打开但未出现错误)。
我意识到我在这里误解了一些东西,我是一个 PHP 新手,所以任何关于我的方法的建议都将不胜感激。
在您的第一个块中,在您的循环中,您将 $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。
以下是适合您的 updated/corrected 代码:
<?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 } ?>