Question, today we used Media translations to upload a variation of a product image. But once this is done we get a different ratio for the image on the product overview page
I ran the Regenerate Thumbnail plugin but it did not fix the issue. But what I noticed is that this plugin is regenerating all the images in the Media folder. But the images I uploaded for the products in the WPML Media Translations do not show up in the Media folder. So it's very logical that these images are not affected by the Regenerate Thumbnail plugin.
I've read this thread and our internal records about the issue you brought up in this ticket. I can see the problem on your site.
You wrote: "I ran the Regenerate Thumbnail plugin but it did not fix the issue. But what I noticed is that this plugin is regenerating all the images in the Media folder. But the images I uploaded for the products in the WPML Media Translations do not show up in the Media folder."
I'm trying to understand what you refer to when you say: "Media folder".
Do you refer to the images you see when in the WordPress admin you go to Media -> Library, or do you refer to the actual folder in WordPress installation located here /wp-content/uploads/?
Also, I want to ask you to share the Debug Information of your site with me. You can read about it here.
------------------------------------
Do you refer to the images you see when in the WordPress admin you go to Media -> Library, or do you refer to the actual folder in WordPress installation located here /wp-content/uploads/?
------------------------------------
Yes I was referring to the images within the Admin Media -> Library. But if I take a look at the actual folder (/wp-content/uploads/) on the server then I can see that the images are there. But after the Regenerate Images plugin was finished I couldn't see these images in the log. So that is strange. Why is the plugin not picking up these images?
Hi, Richard, and thanks for answering my questions and adding the debug information.
I've researched and investigated this issue. My conclusions are the following.
A. I see no point in debugging the provided workaround to use the Regenerate Thumbnails plugin. The next point will explain more.
B. I've found that from the beginning, there was a basic misunderstanding of the cause of the difference between the original image in Dutch and the "translated image" in English. You mentioned that the ratio is different. I assume that you meant what is referred to as "Aspect ratio". hidden link).
I've found out that the aspect ratio of both images is roughly (but not precisely) the same, 4:5. So it is not the aspect ratio that matters here. The image's size (width X height) is what matters here. For the original image in Dutch, you uploaded (back in 08/2020) an image with the size of 225 X 281 px. Please see the attached screenshot nl-225-281.jpg. And this month, for English, you uploaded an image of 800 X 1000 px, which was rendered into 302 X 377 px. Please see the attached screenshot en-800-1000.jpg. And this is what makes the difference. Here are the links to the Dutch and English Images.
Dutch: hidden link
English: hidden link
Please try the following and check if it corrects this problem.
1. On your computer, edit the English image and crop/resize it to the size of 225 X 281 px.
2. On your WordPress site, go to WPML -> Media translation and replace the former uploaded English image with the new cropped/resized image. Save the change.
3. Refresh the English page and check if it is OK now. Note: you may need to update the product or the page.
Thank you for your breakdown and sorry to say that this is not exactly the situation. You are correct that I wrongly used the word "ratio" to describe the issue. This has caused unnecessary confusion. Sorry for that.
You are mentioning that we uploaded the image in 225X281px back in 2020 but we never upload images in that size. We upload all images for products on the product page in 800x1000px and WordPress generates all the thumbnails in other sizes.
If we would have uploaded this image in 225X281px then where does the large image on the product page coming from? Then WordPress should have enlarged the image and the quality would have gone to waste. And that's not the case.
Also, when you use the Media Translation and translate the image for a product then the thumbnail on the category page is replaced but also the larger image on the product page. Have a look on the category page now. You can now see a red bar in the image which you will also see on the product page. This happened after translating just one image in Media Translations.
Also did another test, if I upload an image in 225x281px in Media Translations like you suggested then the following happens: hidden link. The category page is now correct but the product page not.
So it has nothing to do with us uploading the wrong image size because we always use 800x1000px. It's just that for some reason after translating an image in Media Translations that an incorrect image size is being used for the category page image.
Hi, and thanks for further clarifying the processes you took.
You wrote:
You are mentioning that we uploaded the image in 225X281px back in 2020 but we never upload images in that size. We upload all images for products on the product page in 800x1000px and WordPress generates all the thumbnails in other sizes.
If we would have uploaded this image in 225X281px then where does the large image on the product page coming from? Then WordPress should have enlarged the image and the quality would have gone to waste. And that's not the case.
OK, I get this point. In this respect, it was my mistake regarding how things are working with your theme. The image for the product archive pages is probably determined by the OceanWP theme, its add-ons, and Elemento. Of course, it is a good practice you are persistent with uploading the same maximum image size 800X 1000 px for the products.
To investigate this issue further, can you please let me have access to your site and allow me to create a test product?
I want to experience the process of replacing an image for a product on your site when using all the integrated plugins and the OceanWP theme. I tested this scenario on my test site and could not replicate this problem. I suspect a fault with one of the plugins that are not working as expected with WPML and Media translation.
If you need further help with this, please share the access details to your site with me.
I'm enabling a private message for the following reply.
Privacy and Security Policy
We have strict policies regarding privacy and access to your information. Please see: https://wpml.org/purchase/support-policy/privacy-and-security-when-providing-debug-information-for-support/ **IMPORTANT**
- - Please backup the site files and database before providing us access. --
-- If you have a staging site where the problem can be reproduced, it is better to share access to the staging site.--
On your site, I've uploaded a new image to the Dutch media library. Then, in WPML -> Media translation, I switched the image to a different image for the English language. Beforehand, I prepared both images on my computer with the size of 800X1000 px. Then I created a new test product in Dutch and used the uploaded image (previously uploaded to the Dutch media library) as the product's image. I then translated the image into English. The results are good. The images are the same size on the Dutch and English product pages. You can see my test product here.
hidden link hidden link
The result is also good in both languages on the product's category page.
hidden link hidden link
Please see the attached screenshots nl-product-cat-page.jpg and en-product-cat-page.jpg.
I'm not entirely sure why your product result is not good. Maybe you didn't follow the correct procedure of translating/switching images or updating the product after changing its image to the image you uploaded on 2022/02/14. It also may be a caching issue where the old images are being served from the cache, and some backend server operation is needed to refresh the images.
I've recorded a screencast of my finding with more details. You can watch it here.
hidden link
Please let me know if you have any further questions.
Thanks for the test. I noticed in your newly created product that the image size both in NL and EN on the category page is indeed the same. But as you look closely you can see that again they are larger than all the other category images. I tested with a new product myself and uploaded a new 1000x800px image to this product and also this one is giving the larger category image. So it seems that the problem is not so much in WPML but in the category image settings. Maybe, due to an update these have been changed somehow. Although when I check the settings for the category images in the theme they are still 225px, which is correct. 🤔
So every new product has this behaviour now. WPML is probably doing the correct thing in the Media translation and is using the "new" thumbnail size and therefore the images in the other languages are bigger. So somewhere between the last created product and now some settings have been changed. I now need to figure out what setting has been changed and why.
So I think it is not a WPML issue but more a theme thing. Do you agree or could WPML have anything to do with this behaviour?
Thanks again for your test which made clear to me in what area to look now.
Yes, I agree with this. My conclusion is also that WPML is not the cause of this issue. When I was creating the test product on the editing screen, I noticed in the section where you upload the product image that an image file of 1000X1000 or larger is required. This is probably coming from your theme. So maybe the required proportion of the product images is 1:1, and here lies the issue.
In any case, you can validate if WPML is the cause or not of the issue by temporarily deactivating it and then checking if the problem persists.
**** Important! Please make a full site backup (files and DB) before you proceed with those steps****
Best Regards,
Itamar.
This ticket is now closed. If you're a WPML client and need related help, please open a new support ticket.
