在“添加到购物车”按钮旁边添加一些图像

Question

我需要使用高级自定义字段插件在 WooCommerce 产品页面的“添加到购物车”按钮旁边显示一张图片。据我所知，为了显示值，必须将 the_field 函数添加到某些页面模板中。 the_field 函数应该放在哪个模板文件中？

Answer 1

这取决于您使用的“添加到购物车”类型（简单产品、变量等）。

不管怎样，每个都在这个目录下（单品）：templates/single-product/add-to-cart。

您应该（为了获得最佳效果）为您的 ACF 内容使用图像数组。

你可以这样写（把get_field('image')改成get_field('your_field_name')：

<?php 

$image = get_field('image'); // assigns the image field to the variable of $image

if( !empty($image) ): ?> <!--if the $image variable isn't empty, display the following:-->

    <img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" /> <!--displays the URL for the image variable and also the alt tag which is entered in the WordPress media library-->

<?php endif; ?> <!--ends the if statement -->

如果您想要一个基本的显示，您可以使用图像 URL 并执行以下操作：

<?php if( get_field('image') ): ?> <!--only shows the image field if it exists (an image was uploaded through ACF)-->

    <img src="<?php the_field('image'); ?>" /> <!--displays the URL of the image if it is not an array/ID set in ACF field parameters, but a URL -->

<?php endif; ?> <!-- end the IF statement -->

我更喜欢尽可能使用 alt 标签。