在结帐WooCommerce页面上获取购物车产品ID，以显示产品图片 [英] Get Cart products id on checkout WooCommerce page, to display product images

问题描述

我正在工作的网站上使用woocommerce，因此我想在结帐页面的顶部显示当前产品缩略图，以便用户查看要购买的产品.

但是我找不到任何方法.

我得到的最接近的结果是使用 WC::cart->get_cart() ，但这会输出所有产品的列表.

我该如何实现?

谢谢

解决方案

是的，可以编写自定义函数.

要在标题主题之后紧靠结帐页面的开头显示这些图像，请使用以下代码:

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 bellow
            // break;
        }
    }
}

此代码段位于您的活动子主题或主题的function.php文件中

您可以在 get_image()函数.

此代码已经过测试且功能齐全

---

其他用法-您也可以使用它:

1)与以下其他人结帐 WooCommerce 钩子 (用其中一个替换代码段代码的第一行):

•在提供客户详细信息之前:

add_action('woocommerce_checkout_before_customer_details', 'displays_cart_products_feature_image');

•在客户详细信息之后:

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文件上):

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 bellow
            // break;
        }
    }
}

然后，您只需将其中之一粘贴到模板文件中:

• 内部HTML代码:<?php displays_cart_products_feature_image(); ?>
  
• 内部PHP代码:displays_cart_products_feature_image();

参考:

• WC_Cart类| WooCommerce 2.1.x代码参考
• 类WC_Product | WooCommerce 3.x代码参考
• 模板结构+通过主题覆盖模板

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.

The closest I got, is to use WC::cart->get_cart(), but this outputs a list of all products.

How can I achieve this?

Thanks

解决方案

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 bellow
            // break;
        }
    }
}

This code snippet goes on function.php file of your active child theme or theme

You can change the images properties adding some options in get_image() function.

This code is tested and fully functional

---

OTHER USAGES - You can also use it:

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');

• Before order review:

add_action('woocommerce_checkout_before_order_review', 'displays_cart_products_feature_image');

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 bellow
            // break;
        }
    }
}

Then you will just paste one of this inside the template file:

• inside HTML code: <?php displays_cart_products_feature_image(); ?>
  
• inside PHP code: displays_cart_products_feature_image();

Reference:

• Class WC_Cart | WooCommerce 2.1.x Code Reference
• Class WC_Product | WooCommerce 3.x Code Reference
• Template Structure + Overriding Templates via a Theme

这篇关于在结帐WooCommerce页面上获取购物车产品ID，以显示产品图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！