When I insert an image into a static pages it automatically puts its width to 300px and centers it in the view. If I look at the produced code, it hard codes the 300px in its style and adds some classes to it:

<p><img src="/storage/app/media/uploaded-files/my-picture.jpg" style="width: 300px;" class="fr-fic fr-dib"></p>

I was wondering where I could change this default behaviour of restricting the width of the image. I want the editor just to insert the image without any styling. The width is regulated through CSS with a max-width and width=100% etc etc

So producing this code:

<p><img src="/storage/app/media/uploaded-files/my-picture.jpg" class="fr-fic fr-dib"></p>

As a side, what are these classes? I reckon they are produced by the editor and control the behaviour (centering, breaking). Are they documented somewhere?

Thanks in advance for your responses!

Last updated 7 years ago

Might not really be the answer you're looking for (as it's not clear you know about this), but you can delete the 300px width by clicking on the image and delete the width and height options.

Last updated 7 years ago

Actually it appears if you put no height or width in the boxes, after you click on change-size it defaults to 300px again:(

To only solution I found is to go to the source of the page and manually delete the style="..." attribute. But that's not very convenient for non-developer users.

The other thing I was thinking, you can select a 'style' from a dropdown. Would it be possible to alter these style?

farbridge said:

Actually it appears if you put no height or width in the boxes, after you click on change-size it defaults to 300px again:(

This is not expected behaviour. I just tested this and it does not default to 300px width.

Which built?

I tested it on #396 the default is not restored
On #403 it defaults to 300px, whatever I do :)

But that stil is, I think, not a 'proper' solution.

Last updated 7 years ago