在结帐 WooCommerce 页面上获取购物车产品 ID，以显示产品图片 [英] Get Cart products id on checkout WooCommerce page, to display product images
问题描述
我在我正在开发的网站上使用 woocommerce，我想在结帐页面的顶部显示当前产品缩略图，以便用户可以查看他要购买的商品.
I'm using woocommerce on a site I'm working on and I want to display the current product thumbnail at the top of the checkout page, so the user could take a look at what his going to buy.
但是我找不到任何方法来这样做.
However I can't find any way to do so.
我得到的最接近的是使用 WC::cart->get_cart()，但这会输出所有产品的列表.
The closest I got, is to use WC::cart->get_cart(), but this outputs a list of all products.
我怎样才能做到这一点?
How can I achieve this?
谢谢
推荐答案
是的，可以编写自定义函数.
Yes it's possible writing a custom function.
要在结帐页面的开头显示标题主题之后的图像，请使用以下代码:
To display those images at the beginning of checkout page just after your header's theme, use this code:
add_action('woocommerce_before_checkout_form', 'displays_cart_products_feature_image');
function displays_cart_products_feature_image() {
foreach ( WC()->cart->get_cart() as $cart_item ) {
$product = $cart_item['data'];
if(!empty($product)){
// $image = wp_get_attachment_image_src( get_post_thumbnail_id( $product->ID ), 'single-post-thumbnail' );
echo $product->get_image();
// to display only the first product image uncomment the line below
// break;
}
}
}
此代码片段位于活动子主题或主题的 function.php 文件中
您可以更改图像属性，在 get_image() 中添加一些选项 函数.
You can change the images properties adding some options in get_image() function.
此代码经过测试且功能齐全
其他用途 - 您也可以使用它:
1).使用以下其他结帐 WooCommerce 钩子 (用其中一个替换代码段中的第一行):
1). With the following others checkout WooCommerce hooks (replacing the first line in the snippet code with one of this):
• 在客户详细信息之前:
• Before customer details:
add_action('woocommerce_checkout_before_customer_details', 'displays_cart_products_feature_image');
• 在客户详细信息之后:
• After customer details:
add_action('woocommerce_checkout_after_customer_details', 'displays_cart_products_feature_image');
• 订单审核前:
add_action('woocommerce_checkout_before_order_review', 'displays_cart_products_feature_image');
2).直接在您的 woocommerce 模板 (这段代码在 function.php 上)您的活动子主题或主题的文件):
2). Directly inside your woocommerce templates (this snippet code goes on function.php file of your active child theme or theme):
function displays_cart_products_feature_image() {
foreach ( WC()->cart->get_cart() as $cart_item ) {
$product = $cart_item['data'];
if(!empty($product)){
// $image = wp_get_attachment_image_src( get_post_thumbnail_id( $product->ID ), 'single-post-thumbnail' );
echo $product->get_image();
// to display only the first product image uncomment the line below
// break;
}
}
}
然后您只需将其中一个粘贴到模板文件中:
Then you will just paste one of this inside the template file:
- 在 HTML 代码中:
<?php display_cart_products_feature_image();?> - 在 PHP 代码中:
displays_cart_products_feature_image();
参考:
这篇关于在结帐 WooCommerce 页面上获取购物车产品 ID，以显示产品图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
