php - Woocommerce 在产品缩略图上方显示产品类别缩略图
问题描述
我想在商店页面的产品缩略图上方显示类别缩略图。我尝试使用此代码,但它不起作用。
请帮助我,我需要完成这项工作。任何帮助将不胜感激。谢谢。
/**
* Display product category thumbnail.
*
* @param mixed $product_category Category term Id, term name or term slug.
*/
<?php
$thumbnail_id = get_term_meta( $cat->term_id, 'thumbnail_bid', true );
$image_url = wp_get_attachment_url( $thumbnail_id ); ?>
解决方案
/**
* Display product category thumbnail.
*
*/
add_action('woocommerce_before_shop_loop_item_title', 'display_product_category_thumbnail', 20);
function display_product_category_thumbnail()
{
global $product;
$productFirstCategory = reset(get_the_terms($product->get_id(), 'product_cat'));
$small_thumb_size = 'woocommerce_thumbnail';
$dimensions = wc_get_image_size($small_thumb_size);
if ($thumbnail_id = get_term_meta($productFirstCategory->term_id, 'thumbnail_id', true)) {
$image = wp_get_attachment_image_src($thumbnail_id, $small_thumb_size);
if (is_array($image)) {
$image = reset($image);
}
$image_srcset = function_exists('wp_get_attachment_image_srcset') ? wp_get_attachment_image_srcset($thumbnail_id, $small_thumb_size) : false;
$image_sizes = function_exists('wp_get_attachment_image_sizes') ? wp_get_attachment_image_sizes($thumbnail_id, $small_thumb_size) : false;
} else {
$image = wc_placeholder_img_src();
$image_srcset = false;
$image_sizes = false;
}
if ($image) {
$src_set = '';
if ($image_srcset && $image_sizes) {
$src_set = '" srcset="' . esc_attr($image_srcset) . '" sizes="' . esc_attr($image_sizes);
}
echo '<img src="' . esc_url($image) . '" alt="' . esc_attr($productFirstCategory->name)
. '" width="' . esc_attr($dimensions['width']) . '" height="'
. esc_attr($dimensions['height']) . $src_set . '" />';
}
}
- 您必须使用
woocommerce_before_shop_loop_item_title
挂钩您的功能的钩子在产品标题之前执行。 - 全局变量
$product
保存当前循环的产品对象。 - 获取当前产品 id 并将其传递给 WP 函数
get_the_terms
以获取与该产品相关的所有术语作为数组并使用 PHP 函数仅检索第一个术语对象reset
并将其分配给变量$productFirstCategory
- WooCommerce 函数
wc_get_image_size
以数组形式检索维度详细信息 - 下一个
if-else block
用于分配该产品类别图像或默认图像 - final
if condition
用于输出标题之前的图像
推荐阅读
- ruby-on-rails-5 - Rails Polymorphing has_one 关联 redirect_to 控制器
- visual-c++ - 使用 YAML 在本地构建 Azure DevOps 管道
- python-3.x - Dask 分布式客户端需要很长时间才能在 jupyter 实验室中初始化
- javascript - 如何进入对象数组中的类?
- javascript - 如何在 Node.js 中为 oauth 回调配置路由
- sql - SQL | 通过 CONTINUOUS 匹配过程清理数据
- wordpress - 这是我的代码,请任何人告诉我为什么 wordpress 没有在我的数据库中创建表
- amazon-web-services - 如何在 AWS 上运行 docker?
- angular - 反应式表单字段不使用 setValue 或 patchValue 更新
- git - 为什么 git 中的双点与三点对于 diff 和 log 表现不同