Issue with Image Quality After Upload

Subject: Issue with Image Quality After Upload

Hello,

I created a composition to change the background of slide 1. It’s a JPG file, and on my PC, the image quality is excellent. However, after uploading it to the site, it appears compressed and pixelated, especially when viewed on a 2K screen.

I have taken a screenshot of the site where the image shows as “bad definition,” and I have also attached a second file, which is the original JPG from my PC in high quality.

I would like to maintain a super high resolution for the image.

Thank you in advance for your help.

Best regards,

Attachments:

You must be logged in to view attached files.

Hello,

You need to upload images with a bigger size and high resolution and check the issue.

Best Regards.

Dear Woodmart Support,

Everything I upload to the slider in Woodmart becomes pixelated, and nothing seems to work. You can find access to my site in the admin panel, and I’ve also attached my slide in perfect resolution and very large size. However, when it’s uploaded in Woodmart, you can see on the front end that the image quality is terrible.

Another question I have is about image settings: How can I ensure that the image in the slider retains the correct proportions across different screen sizes, similar to how it works on the Gymshark website? You will notice on that site that when you resize the display, whether viewing it on a 27-inch or 15-inch screen, the background image remains fully visible without being cropped. Unfortunately, this is not the case with Woodmart, and I’m currently very disappointed with the slider functionality.

Could you please provide the best practices and correct settings to achieve a proper result?

Thank you in advance.

Attachments:

You must be logged in to view attached files.

Hello,

For the images to look good on the slide background, they need to meet two criteria: 1. Have good image quality, without compression artifact that may occur after being processed by image compressors. 2. Have an appropriate resolution that covers the entire slide size in height and width on most displays.

The issue with the image on your site is that it has an inappropriate resolution (1600×438 https://monosnap.com/file/3O4D9fIpZpK4ruSMIxSXWupCkBecxg) relative to the slide size (700px in height https://monosnap.com/file/LV0LNWQ40tD2BbGkqEyI5djjBnCmJS). Since the image with a height of 438px is stretched to 700px, it results in poor quality when viewed.

Since you provided the original image in your first message, we decided to test the image handling on your site and found that the images are being converted, resized and compressed when uploaded to your site’s media gallery.

Our steps:
1. We took the image couple-cuisinier-easychr-36BLACK.jpg from your first message.
2. Renamed it to test-image.jpg.
3. Uploaded it to your WordPress media gallery.
4. Downloaded the uploaded image back to the computer.

As a result, we received a file test-image.webp, which was converted, optimized, and reduced in size from 2560×700 281kb in JPG format to 1600×438 60kb in WEBP format. The entire process is shown continuously in this video: https://monosnap.com/file/h5LMJDH0oGlupEXjaretSqmX2RFliD.

From the above, it can be seen that this issue is not related to the WoodMart slider, as the entire process occurs during the image upload to the media gallery. It’s also worth noting that our theme does not have any mechanisms for automatic image processing, optimization, or conversion during upload to the media gallery. In this case, you need to check whether this behavior is caused by installed plugins or certain image optimization settings on your web server.

Kind Regards

Thank you very much! So, it seems that the resizing behavior is happening somewhere in the process. However, I did a complete reset of my configuration using WP Reset, starting from a clean site and only installing your WoodMart theme (which is fantastic, by the way). Could it be something on my hosting server? It seems strange, but I’ll definitely ask them about it.

If you have disabled or never used plugins that affect image optimization, the issue is most likely related to the web server and the hosting it is on. Try checking the server’s control panel for any image settings, and if you don’t see any, then contact your hosting support. As a precaution during debugging, you can install a standard WordPress theme (e.g., Twenty Twenty-One) or the default WooCommerce theme (Storefront) so that both you and the hosting support can be sure that our theme does not cause the issue.

Kind Regards

Thank you, I will clone the site and do a test, so I need to switch to the theme you mentioned and check the image quality? I am the only person working on the site, and I am using no-code tools. I am not a developer, so if you could provide the steps to follow and what to check, that would be helpful.

If you want to ensure that this issue is not caused by the theme, yes, you can test your site with other standard themes on the same web server. However, if this issue is not caused by our theme but by the web server settings, unfortunately, we cannot assist you with configuring the server, as it is outside the scope of WoodMart theme support. We recommend contacting your hosting support for assistance with this matter.

Kind Regards

[Author]

Posts