Woocomerce如何获得不同尺寸的产品库缩略图

Question

我在客户端网站上找到了这个自定义代码。它正在加载full图像URL，而不是thumbnailURL。

有人能帮我吗？

如何加载thumbnail链接而不是full图像URL？

global $product;
$attachment_ids = $product->get_gallery_image_ids();
if ( $attachment_ids && $product->get_image_id() ) {
echo '<ol class="flex-control-nav flex-control-thumbs custom_product_thumbnail">';
foreach ( $attachment_ids as $attachment_id ) {
$image_url = wp_get_attachment_url($attachment_id);
$image_alt = get_post_meta($attachment_id, '_wp_attachment_image_alt', TRUE);
$image_title = get_the_title($attachment_id);
?>
<li>
<a href="<?php echo $image_url; ?>" data-rel="prettyPhoto[photo-gallery]">
<img src="<?php echo $image_url; ?>" alt="<?php echo $image_alt; ?>" title="<?php echo $image_title; ?>"></a>
</li>
<?php
//echo apply_filters( 'woocommerce_single_product_image_thumbnail_html', wc_get_gallery_image_html( $attachment_id ), $attachment_id ); // phpcs:disable WordPress.XSS.EscapeOutput.OutputNotEscaped
}
echo '</ol>';
}
?>

Answer 1

您可以使用wp_get_attachment_image_url^Docs函数，而不是使用wp_get_attachment_url。CCD_ 7将接受CCD_。

所以，替换这行：

$image_url = wp_get_attachment_url($attachment_id);

使用此行：

$image_url = wp_get_attachment_image_url($attachment_id, 'thumbnail');

---

如果你想/需要，这些是你可以使用的其他尺寸：

$image_url = wp_get_attachment_image_url($attachment_id, 'medium');

或

$image_url = wp_get_attachment_image_url($attachment_id, 'full');

---

评论中提出的第二个问题的更新：

如果要获取锚点标记的full大小并获取image标记的缩略图，请使用以下代码：

global $product;
$attachment_ids = $product->get_gallery_image_ids();
if ($attachment_ids && $product->get_image_id()) {
echo '<ol class="flex-control-nav flex-control-thumbs custom_product_thumbnail">';
foreach ($attachment_ids as $attachment_id) {
$image_url_full = wp_get_attachment_image_url($attachment_id, 'full');
$image_url_thumbnail = wp_get_attachment_image_url($attachment_id, 'thumbnail');
$image_alt = get_post_meta($attachment_id, '_wp_attachment_image_alt', TRUE);
$image_title = get_the_title($attachment_id);

?>
<li>
<a href="<?php echo $image_url_full; ?>" data-rel="prettyPhoto[photo-gallery]">
<img src="<?php echo $image_url_thumbnail; ?>" alt="<?php echo $image_alt; ?>" title="<?php echo $image_title; ?>"></a>
</li>
<?php
// echo apply_filters('woocommerce_single_product_image_thumbnail_html', wc_get_gallery_image_html($attachment_id), $attachment_id); // phpcs:disable WordPress.XSS.EscapeOutput.OutputNotEscaped
}
echo '</ol>';
}

---

如果您想将锚定标签的href更改为产品永久链接，您应该更改此行：

<a href="<?php echo $image_url; ?>" data-rel="prettyPhoto[photo-gallery]">

这个：

<a href="<?php echo get_the_permalink($product->get_id()); ?>" data-rel="prettyPhoto[photo-gallery]">