Reply To: Mobile cart screenshots have irregular borders

I managed to put a product image on the payment screen, only the css code is required for the product information to appear next to the images. If you help with this, we can share it with friends in the group, thank you.

Show product picture at checkout

add_filter( 'woocommerce_cart_item_name', 'db_product_image_on_checkout', 10, 3 );
 
function db_product_image_on_checkout( $name, $cart_item, $cart_item_key ) {
     
    /* Return if not checkout page */
    if ( ! is_checkout() ) {
        return $name;
    }
     
    /* Get product object */
    $_product = apply_filters( 'woocommerce_cart_item_product', $cart_item['data'], $cart_item, $cart_item_key );
 
    /* Get product thumbnail */
    $thumbnail = $_product->get_image( array( 1200, 600 ) );
 
    /* Add wrapper to image and add some css */
    $image = '<span class="db-product-image">'
                . $thumbnail .
            '</span>'; 
    $name = '<span class="db-product-name">' . $name . '</span>';
    /* Prepend image to name and return it */
    return $image . $name;
}

css

/*checkout screen product image and border location  */
.db-product-image img {
    min-width: 80px;
    max-width: 80px;
    border-radius: calc(var(--wd-brd-radius) / 1.5);
 
}

link: https://www.exgeer.com/odeme/

Attachments:

You must be logged in to view attached files.