专注于外贸建站,分享WordPress教程和Elementor教程

WooCommerce:在结帐页面上显示产品图片

更新日期:2023-08-03
同系列教程
加入读者学习群
我用的页面编辑器
让我的客户网站GTmetrix测分A\A的主机Cloudways
独家优惠前3个月7折, 戳上方按钮注册即可自动带入优惠码LOYSEO
所赠主题插件价值>$49
主机送Astra Pro不限站点1年
gmail.comsina.com邮箱,注册易通过
遇到问题,联系我
来开通 SEO工具20+

WooCommerce 结账页面的订单审查部分显示了产品名称、数量和费用,但没有产品图像,产品图像对于识别/区分相似产品或产品变体非常有用。

这个简单的代码段将帮助你在订单审查页面中展示产品的特色图片。

woocommerce product image checkout page 1024x619 1

通过添加下面的PHP代码段,您可以在结帐页面中的产品名称快速显示产品特色图片

PHP代码段:添加产品特色图片到woocommerce的结帐页面的订单审核表中

请注意,下面的片段将生成一个尺寸为50*50像素的缩略图(请随意改变数组()内的尺寸),并将其向左对齐(移除包含class的array则可以避免左对齐)。

/**
* @snippet       Product Images @ Woo Checkout
*/

add_filter( 'woocommerce_cart_item_name', 'bbloomer_product_image_review_order_checkout', 9999, 3 );

function bbloomer_product_image_review_order_checkout( $name, $cart_item, $cart_item_key ) {

if ( ! is_checkout() ) return $name;

$product = $cart_item['data'];

$thumbnail = $product->get_image( array( '50', '50' ), array( 'class' => 'alignleft' ) );

return $thumbnail . $name;

}

外贸建站技术姐Bonnie
外贸建站技术姐Bonnie

Bonnie是LOYSEO的创始人,在建站领域有着超过14年的经验,热爱能将想法变为现实的WordPress,更是Elementor的忠实用户~

LOYSEO
让我的客户网站GTmetrix测分A\A的主机Cloudways
独家优惠前3个月7折, 戳上方按钮注册即可自动带入优惠码LOYSEO
所赠主题插件价值>$49
主机送Astra Pro不限站点1年
gmail.comsina.com邮箱,注册易通过
遇到问题,联系我
来开通 SEO工具20+