Image is not as sharp as they should be

There is a difference in image sharpness between using the short code to insert an image versus using manual html “img” tag.

The shortcode always produce sharper image than the “img” tag.

And since I can’t insert the shortcode in widget, I’ve to use “img” which makes the banner image blurry.

Any known plugins that are causing the problem? Anyone?

Martin

Hello There,

Thanks for writing in! Both of them should display sharp image as long as it is the full or original image. Please understand that the Image element will display the full image. With your <img>, please make sure that you are inserting the full image also. Would you mind providing your img code in your next reply?

Thank you in advance.

Any support staffs looking at this? I’ve sent and flag the info for attention but get no response. It’s been 3 days.

Hi there,

We have sent you a reply, you didn’t provide the exact image HTML code, and there is no URL to check. Please provide them and we’ll check.

Thanks!

I thought I have included the image URL and my page as an example or may be I’m doing it wrong.

I’m sorry. Not familiar with how to post hidden message here. So here it is…

Hi there,

There is nothing wrong with your image code. It seems that your image gets a little bit blurry when it is resized. The original size of the image is 330X500, but when you add it in the sidebar as it is responsive and tries to take up the whole container it is resized to 301 X 456:

Same thing will happen if you use the image element. I suggest that you resize the image using a photo editing software such as Photoshop and make it 301 X 456.

That should do the trick. Thank you.

I have resize the image to 301 x 456 but don’t seems to improve much. I have also zeroed on the image settings in wordpress, tried to view on Firefox, Chrome, Vivaldi, Opera…all the same.

The problem is not just on the widget. In post image has the same blurry issue when using the img tag or the Insert image function of wordpress.

If you said it’s a resizing issue then it has got to do with X. What is the right sizing then, to prevent these blurry image issues? And why is it that when used with the shortcode the image will appear sharp.

Where is the resizing function located in X? Is it wise to disable it like I did with wordpress?

Hi there,

X does not have any resizing settings. The one you see in the sidebar is what you will get if you use the Image element as I mentioned before.

You can simply test the case by adding the same image to the Image Element and see the result. The image itself is a little bit blurry and I am sure that you will see the same result.

There is nothing that X can do regarding the images with low quality. I suggest that you check the case by changing the theme of the website and using a theme other than X. See the result then.

There is no magic going on regarding the Image Element, it does render the image which you added in the Cornerstone with the same type of code everyone would do (IMG tag).

Thank you for your understanding.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.