#361 – Stretched image in editor

Hello.
Econa change image when I save article. Image is stretched in editor JCE.
This is example.
Small image add to article.
https://prnt.sc/moqrgt
After save image is stretched.
https://prnt.sc/moqrre
Code after save look like this.

<img style="display: block; margin-left: auto; margin-right: auto;" src="/images/samall-image.jpg" sizes="100vw" srcset="/images/samall-image_L.jpg 900w, /images/samall-image_M.jpg 600w, /images/samall-image_S.jpg 300w" alt="samall image" /></p>

Testing URL.
https://optymalizacja.mjmartino.eu/abstraction/dziennikarz

Any advice?
Regards,

Hi,

This is caused by your template CSS code. The rule is on line 1293 of the file https://optymalizacja.mjmartino.eu/templates/t3_bs3_blank/css/template.css.

Regards

No no no.
Problem is econa not select correct basic image /images/samall-image.jpg is size 212 x 245 to be the default size. I want loading small image to big screen. Nobody uses always big images.
Browsers ignore "100vw" must be add width to default image. Another all small images will always be stretched.

If I choose image 100px width i want show only 100px ;) This is ont problem CSS template. If I turn on econa and add image is work correctly but not add set srcset which is obvious.

You are messing the actual loaded image size with the image display. Econa will load the appropriate image size depending on the settings you have provided. You can verify this by opening the developer tools on Chrome and see which file is actually loaded.

Regards

OK.
Lets try explain.

I upload image size 200x200
Econa convert image size Small x Medium x Large depend on configuration.
Small = 240 width q60
Medium = 480 width q70
Large = 700 width q75
I total understood if screen view larger than 700 will be load image L.

BUT.

1. Every each images should be only scaled down. Because scaled up quality is worse and the image has artifacts.

You don't tell me this image look good.

2. Image in editor should be original size after save image. [not like this]



How I can prevent scaled up images. And if image is small to load original size for all width.

OK now I understand. You don't want Econa to upscale images when the source image is small. Is that right?

YES! Yes :D Please :)

That's a double issue:

1. The first issue is that Econa upscales the image when it's not needed.
2. The sizes attribute we add affects the way the image is displayed if there is no CSS rule or width attribute. This is what happens in Joomla backend editors.

I have applied a fix and now Econa checks if the image should be resized or not. In addition to that, Econa now adds the width attribute to the image. We are using the original image width. This way the images should get displayed fine in backend editors. In front-end the display is 99% controlled by the template so this should be fine.
If you have any other ideas for handling this, please let me know.
The fix will get included in the next update. Note that this issue only occurs for content images (images inside the editor) when the responsive method is selected at the options.
Thank you for reporting!

Regards

I think is fine.
When can expect update?

Can't tell for sure, we are in the process of fixing some more issues before releasing.

Regards