-
-
Save dr5hn/10b241076ac3c8ac1e4d84f7ec48866e to your computer and use it in GitHub Desktop.
<?php | |
/* | |
* Showing Product Image on Checkout Page -- By Darshan Gada | |
*/ | |
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 ) { | |
$item = $cart_item['data']; | |
//print_r($item); | |
if(!empty($item)){ | |
$product = new WC_product($item->id); | |
// $image = wp_get_attachment_image_src( get_post_thumbnail_id( $product->ID ), 'single-post-thumbnail' ); | |
echo $product->get_image(); | |
echo $product->name; | |
echo $product->price; | |
// to display only the first product image uncomment the line bellow | |
// break; | |
} | |
} | |
} | |
?> |
@mrrajsoni You need to do this in order to get more product details
$product = new WC_product($item_data->id); echo $product->name; echo $product->price;
Can you tell me how can I add the number of product selection box?
@farinspace
hi, actually my problem is something strange. My website already shows the product thumbnails on a checkout page but only in mobile view but on a desktop view nothing showing. So i try to to copy paste your code in my php using code snippet plugin it starts working perfectly on desktop view but doubled the thumbnails in a mobile view(means show images twice) because in mobile view product thumbnail already shown. kindly solve the issue for me.
@farinspace
same here, I see double thumbnails on mobile. any way to fix it?
As of woocommerce 3.9.3
/** * Show product thumbnail on checkout page. * * @see {templates|woocommerce}/checkout/review-order.php */ add_filter( 'woocommerce_cart_item_name', 'jfs_checkout_show_product_thumbnail', 10, 2 ); function jfs_checkout_show_product_thumbnail( $name, $cart_item ) { if ( ! is_checkout() ) return $name; $thumbnail = '<span class="product-name__thumbnail" style="float: left; padding-right: 15px">' . get_the_post_thumbnail( $cart_item['product_id'], array( 60, 120 ) ) . '</span>'; return $thumbnail . '<span class="product-name__text">' . $name . '</span>'; }
This is perfect for my flatsome theme. Screenshot- https://drive.google.com/file/d/11EkrNQoNkA9K_G2M8p3fZ7Vu_i6h5Waw/view?usp=sharing
Do you have a code for showing image on /checkout/order-received/ page?
Thank you very much for your help
I was able to display the product image in the checkout section
Can you help me how can I add a product attribute to this section?
Help us if you can
@farinspace thank you!
If someone wants the thumbnail to be above the product name, replace
style="float: left; padding-right: 15px;”
withstyle=“display: block; clear: both; max-width:64px;“
. Change size as you please.