如何从 WP 中的 ACF 图像字段的数组中获取信息?

Question

我对WP很陌生，所以这似乎是一个非常简单的问题。 我正在尝试通过 css 类和高级自定义字段提供背景图像 URL。 我想这样做，这样我就可以保持我的课堂清洁和干燥。该图像作为自定义字段图像存储在WP管理中。 这是我的英雄模板代码：

<?php
if (have_posts()) : while (have_posts()) : the_post();
?>
<?php
$hero_img = get_field('hero_image');
?>
<h3>ACF Field Data: <?php the_field('hero_image');?></h3> // just to see what it is

<section class="panel--hero panel--bg-image" <?php $hero_img ? print 'style="--background-image: url("hero_img[5]");"' : ''; ?>>
<div class="panel__content">
<div class="container container__grid page-heading">
<div class="container__col">
<h2 class="page-title center--flex text-white"><?php the_title() ?></h2>
</div>
</div>
<div>
</section>
<?php
endwhile;
endif;
?>

和 scss：

&--bg-image {

position: relative;
height: 50vh;


&::after {
background-image: var(--background-image);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
bottom: 0;
content: '';
display: block;
opacity: var(--opacity);
left: 0;
right: 0;
position: absolute;
top: 0;
z-index: -1;
}
}

未显示任何图像。 绝对路径是该数组中的第五项，它不会通过。 在 JS 中，我通常会遍历它，但我认为我已经使用变量声明上方的"if/while"循环做到了这一点。 我现在也需要循环 $hero_img 变量吗？ 如果是这样，这是WP/PHP中最传统的方法吗？ foreach是一种选择吗？ 也许我不清楚数据是否仅通过运行 if/while 循环即可获得。 任何帮助将不胜感激！ 谢谢。

Answer 1

选项 1 - 使用数组键

假设您使用的是 ACF 并且该字段设置为返回"图像数组"，您可以使用数组键url获取图像 url，即：

$hero_img_url = $hero_img['url'];

选项 2 - 仅从 ACF 返回 URL

如果您只想获取图像的 URL，则可以在字段的 ACF 设置中将返回格式更改为">图像 URL"。然后get_field只返回 url，你可以像你已经一样得到它，例如：

$hero_img_url = get_field('hero_image');

附加说明

1. 当您使用关联数组(即带有键的数组(时，位置无关紧要，因此您不会尝试获取第 5 个元素。您只需使用键直接获取值。
2. 如果您不确定数组中有什么或键是什么，您可以使用var_dump($hero_img);将它具有的键和值准确地输出到屏幕上。