小時
分鐘
Cloudways 主機獨家優惠:贈金20$+3個月7折,點此前往註冊,才可獲取贈金
專注於企業網站架設,分享WordPress教學和Elementor教學

WooCommerce:在結帳頁面上顯示產品圖片

更新日期:2021-11-09
加入讀者學習群
我用的頁面編輯器
讓我的客戶網站GTmetrix測分A\A的主機Cloudways
獨家優惠前3個月7折,戳上方按鈕註冊即可自動帶入優惠碼LOYSEO
所贈主題外掛價值多為$49+
主機送Astra Pro不限站點1年
用Gmail郵箱,註冊易通過
遇到問題,聯繫我
來開通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;

}

點贊
0 / 5 0

Your page rank:

Bonnie
Bonnie

Bonnie是LOYSEO的創始人,熱愛能將想法變為現實的WordPress,更是Elementor的忠實用戶~

發表回复

您的電子郵箱地址不會被公開。 必填項已用*標註

架設網站學習交流群