New added product preview image (in 720) is not shown in product details page.
Forum rules
Always add your Laravel, Aimeos and PHP version as well as your environment (Linux/Mac/Win)
Spam and unrelated posts will be removed immediately!
Always add your Laravel, Aimeos and PHP version as well as your environment (Linux/Mac/Win)
Spam and unrelated posts will be removed immediately!
New added product preview image (in 720) is not shown in product details page.
PHP: 8.2.7
Laravel Framework: 10.48.4
System: Debian GNU/Linux 12
Aimeos Laravel v2023.10
I had an issue in opening (new added) product details page, when I get an array error. So I temporary fixed it by adding
into the aimeos-core/config/controller.php file. Now I have another issue. The details page opens normal, but I get only the image URI instead of image itself. In the shop front-end image is shown normal.
Images are automatically stored in public/aimeos/1.d ... directory and when I inspect the page by console, in the error string I see that URI of the image is something like
In this example the ".../ear-phones/..." I suppose is the product Label. The URI of the image from 1.d/... etc is OK and it matches the file name.
So I have two questions:
1. Where problem of opening image in Details page can be in my case?
2. Where actually we must to keep the product images or we can keep them as is?
Laravel Framework: 10.48.4
System: Debian GNU/Linux 12
Aimeos Laravel v2023.10
I had an issue in opening (new added) product details page, when I get an array error. So I temporary fixed it by adding
Code: Select all
[
'maxwidth' => 720,
'maxheight' => 960,
'force-size' => 1,
],
Images are automatically stored in public/aimeos/1.d ... directory and when I inspect the page by console, in the error string I see that URI of the image is something like
Code: Select all
GET http://oursite/shop/ear-phones/1.d/preview/b/e/becf8efe_ear_phones_1000px.webp
So I have two questions:
1. Where problem of opening image in Details page can be in my case?
2. Where actually we must to keep the product images or we can keep them as is?
Re: New added product preview image (in 720) is not shown in product details page.
Can you share the complete configuration in your controller.php file?
Did you overwrite the catalog/detail template?
After you've changed the preview file sizes, you have to regenerate the preview images to take effect by executing:
When you upload images in the admin backend, they are stored in the ./public/aimeos/<siteid>/ folder. If you want to keep them elsewhere, you should create a link in the ./public/aimeos/ folder to your real image folder.
Did you overwrite the catalog/detail template?
After you've changed the preview file sizes, you have to regenerate the preview images to take effect by executing:
Code: Select all
php artisan aimeos:jobs media/scale
Professional support and custom implementation are available at Aimeos.com
If you like Aimeos, give us a star
If you like Aimeos, give us a star
Re: New added product preview image (in 720) is not shown in product details page.
Thank you for your replay.
> Can you share the complete configuration in your controller.php file?
- Yes. I share the config/controller.php file in attachments.
> Did you overwrite the catalog/detail template?
- Yes. We are using our own theme in package and the template was modified by another developer. And I assume that problem is the template. Because when I switch to the Aimeos demo theme - everything is OK. I share it in the attachments.
> After you've changed the preview file sizes, you have to regenerate the preview images to take effect by executing:
- No. I did not used this command. But now, when I try to use it, I don't get the end of result in the terminal (it looks like terminal is in infinity loop).
> When you upload images in the admin backend, they are stored in the ./public/aimeos/<siteid>/ folder.
- Yes. After uploading the image, the files are stored in ./public/aimeos/1.d/ in my case.
> Can you share the complete configuration in your controller.php file?
- Yes. I share the config/controller.php file in attachments.
> Did you overwrite the catalog/detail template?
- Yes. We are using our own theme in package and the template was modified by another developer. And I assume that problem is the template. Because when I switch to the Aimeos demo theme - everything is OK. I share it in the attachments.
> After you've changed the preview file sizes, you have to regenerate the preview images to take effect by executing:
- No. I did not used this command. But now, when I try to use it, I don't get the end of result in the terminal (it looks like terminal is in infinity loop).
> When you upload images in the admin backend, they are stored in the ./public/aimeos/<siteid>/ folder.
- Yes. After uploading the image, the files are stored in ./public/aimeos/1.d/ in my case.
- Attachments
-
- topic_files.tar.gz
- (5.45 KiB) Downloaded 167 times
Re: New added product preview image (in 720) is not shown in product details page.
Configuration looks OK.
Check what the difference is between the files regarding the image section.Sabir_Ali wrote: ↑08 May 2024, 05:56 > Did you overwrite the catalog/detail template?
- Yes. We are using our own theme in package and the template was modified by another developer. And I assume that problem is the template. Because when I switch to the Aimeos demo theme - everything is OK. I share it in the attachments.
How many images do you have that will be rescaled?Sabir_Ali wrote: ↑08 May 2024, 05:56 > After you've changed the preview file sizes, you have to regenerate the preview images to take effect by executing:
- No. I did not used this command. But now, when I try to use it, I don't get the end of result in the terminal (it looks like terminal is in infinity loop).
Professional support and custom implementation are available at Aimeos.com
If you like Aimeos, give us a star
If you like Aimeos, give us a star
Re: New added product preview image (in 720) is not shown in product details page.
- One image. I added only one image to test. And the commandHow many images do you have that will be rescaled?
Code: Select all
php artisan aimeos:jobs media/scale
But when I corrected the preview column value in the mshop_media table by adding `\/aimeos\/` prefix into JSON values it works. The picture appeared on the page. So in the preview column value it looks something like
Code: Select all
... "720":"\/aimeos\/1.d\/preview\/b\/e\/becf8efe_ear_phones_1000px.webp", ...
But one interesting fact is that on the Aimeos demo theme it works fine, even without this prefix. The code part related to looking for previews in the image.php file in our package is:
Code: Select all
<?php
if (($imgNum = count($this->get('mediaItems', []))) > 0) { ?>
<?php
$index = 0;
foreach ($this->get('mediaItems', []) as $id => $mediaItem) {
$mediaUrl = $mediaItem->get('media.url');
$mediaMediumImg = $mediaItem->get('media.previews')[720];
?>
<img class='' src="<?= htmlspecialchars($mediaMediumImg) ?>" alt="<?= htmlspecialchars($mediaMediumImg) ?>"
data-zoom-image="<?= htmlspecialchars($mediaUrl) ?>">
<?php
$index++;
} ?>
<?php
} ?>
Re: New added product preview image (in 720) is not shown in product details page.
I used your original templates/client/html/catalog/detail/image.php file in trying fix the problem. And now I see the image but only in original (large) size. Still not in 720px of width.
Then I added the following configuration into config/shop.php file with hope that this will fix (I'm not sure that this is correct, but any ways)
There is a image() function, which I think is crucial in the detail image code with the following parameters:
I also tried to modify it like this:
While inspecting the image in browser, the code in <img> is following:
Size of the image is 960x1280
Then I added the following configuration into config/shop.php file with hope that this will fix (I'm not sure that this is correct, but any ways)
Code: Select all
return [
'client' => [
'html' => [
'catalog' => [
'detail' => [
'imageset-sizes' => '(min-width: 2000px) 1920px, (min-width: 960px) 960px, (min-width: 720px) 720px, 100vw'
]
]
]
]
];
Code: Select all
$this->image( $mediaItem, $this->config( 'client/html/catalog/detail/imageset-sizes', '(min-width: 2000px) 1920px, (min-width: 500px) 960px, 100vw' ), true )
Code: Select all
image( $mediaItem, $this->config( 'client/html/catalog/detail/imageset-sizes', '(min-width: 2000px) 1920px, (min-width: 960px) 960px, (min-width: 720px) 720px, 100vw' ), true )
Code: Select all
srcset="/aimeos/1.d/preview/0/4/04cbbc51_red-hat.webp?v=20240512080850 240w, /aimeos/1.d/preview/a/c/ac20f0a0_red-hat.webp?v=20240512080850 480w, /aimeos/1.d/preview/2/4/2485b091_red-hat.webp?v=20240512080850 720w, /aimeos/1.d/preview/c/7/c7c60362_red-hat.webp?v=20240512080850 960w, /aimeos/1.d/preview/5/6/56aa6a8e_red-hat.webp?v=20240512080850 1920w"
- Attachments
-
- topic_files.tar.gz
- (8.84 KiB) Downloaded 26 times
Re: New added product preview image (in 720) is not shown in product details page.
Everything is correct but the browser selects itself which image it will use. You can only influence that partially with a different imageset-sizes configuration.
Professional support and custom implementation are available at Aimeos.com
If you like Aimeos, give us a star
If you like Aimeos, give us a star
Re: New added product preview image (in 720) is not shown in product details page.
Do I understand correctly that this problem cannot be solved? And what actually is correct?
Re: New added product preview image (in 720) is not shown in product details page.
You can influence what the browser is choosing by removing e.g. the 960px image size to force the browser to use the next best one, which is 720px in your case.
Professional support and custom implementation are available at Aimeos.com
If you like Aimeos, give us a star
If you like Aimeos, give us a star
Re: New added product preview image (in 720) is not shown in product details page.
Everything is OK, except the fact, that browser looks for image without the '/aimeos/' prefix to URL. If I add it manually or hard code it into our template's image src it works as expected.
When I debug the media Item, media.previews array contains all previews without this directory. If I phisically move the site ID directory outside '/aimeos/' directory (for testing purpose), preview files doesn't work.
So, I think, hard coding the '/aimeos/' directory is not a normal practice. And doing the same think in the core.
Is there a configuration where I can change it? Or it's better to create a link to the directory (I didn't test it yet)? So I need your advice.
When I debug the media Item, media.previews array contains all previews without this directory. If I phisically move the site ID directory outside '/aimeos/' directory (for testing purpose), preview files doesn't work.
So, I think, hard coding the '/aimeos/' directory is not a normal practice. And doing the same think in the core.
Is there a configuration where I can change it? Or it's better to create a link to the directory (I didn't test it yet)? So I need your advice.