Page 1 of 1

Problems with product images in cart

PostPosted: Sun Sep 17, 2023 5:29 pm
by patbe60
Hello
In VM configuration I have enabled "show product images" in the checkout settings tab.
Since version 2.0.437 I always get error messages instead of the checkout site. The checkout site would work if I would replace in every product the product image with a new image. When I go back to version 2.0.436 everything works fine.
So in the Joomla configuration.php I set debug to true and error_reporting to maximum and got the report, attached here as a jpeg.

When I only replace the components/com_onepage/helpers/image.php with the one of version 2.0.436 everything works fine. The problem remains also in version 2.0.438.

Maybe this is an OPC bug?

Regards
Patrik

Joomla 4.3.4
VM 4.2.2 10908
OPC 2.0.438

Re: Problems with product images in cart

PostPosted: Tue Oct 24, 2023 12:34 pm
by admin
hello, i fixed this in the last opc build where i strictly checked every type of possible image. the third argument was "quality" but it seems to be used only in webp+jpg+png images.

there is a new system in opc to provide responsive images.

example usage from within VM templates overrides is:
Code: Select all

require_once(JPATH_SITE.DIRECTORY_SEPARATOR.'components'.DIRECTORY_SEPARATOR.'com_onepage'.DIRECTORY_SEPARATOR.'helpers'.DIRECTORY_SEPARATOR.'image.php');

$image = $this->product->images[0];
$onf = array();
         $onf['title'] = htmlentities($this->product->product_name);
         $onf['alt'] = htmlentities($this->product->product_name);
         $onf['sizes'] = '(max-width: 750px) 90vw,(max-width: 1300px) 40vw, 20vw';
         
         
         echo OPCimage::displayMediaThumbResponsive($image, $onf);


this code does:
- uses original image in src without resizing it
- uses 100%/50%/25%/5% resized webp version in srcset
- this line $onf['sizes'] = '(max-width: 750px) 90vw,(max-width: 1300px) 40vw, 20vw'; means:
-- for mobile devices use 90% of viewport, for up to 1300px laptops and tablets use 40% viewport and for PC's use 20% viewport
-- browser then calculates which size of the displayed image is best to be shown per device resolution and provided srcset

Code: Select all
<img title="Sun shades Alfa Romeo 147 2000-2010 3-door hatchback Car Shades - set" alt="Sun shades Alfa Romeo 147 2000-2010 3-door hatchback Car Shades - set" sizes="(max-width: 750px) 90vw, 250px" loading="lazy" class="example" srcset="/images/stories/virtuemart/product/resized/webp5/example-car-shades-car-window-shades-set-1.webp 75w, /images/stories/virtuemart/product/resized/webp10/example-car-shades-car-window-shades-set-1.webp 150w, /images/stories/virtuemart/product/resized/webp20/example-car-shades-car-window-shades-set-1.webp 300w, /images/stories/virtuemart/product/resized/webp50/example-car-shades-car-window-shades-set-1.webp 750w, /images/stories/virtuemart/product/resized/webp100/example-car-shades-car-window-shades-set-1.webp 1500w" src="/images/stories/virtuemart/product/example-car-shades-car-window-shades-set-1.jpg" width="1500" height="1000">



best regards, stan

Re: Problems with product images in cart

PostPosted: Wed Oct 25, 2023 5:54 pm
by patbe60
Thanks, works fine with the new version.

Regards
Patrik