Adding custom class to img tag

AI-generated summary

Users are discussing the inability to add custom classes to image tags in posts, which is being stripped out by the Markdown editor. mpteng reports that adding a class manually in the post doesn’t work, and screenshots confirm the class is removed upon saving. schungx suggests the new Markdown editor restricts certain attributes like class, which are being stripped. jomaxro references a recent code change (https://github.com/discourse/discourse/commit/9cb088e3f6762df3369e647b1de122edd536fa30) that likely introduced this behavior, noting that classes were previously allowed. The issue is seen as a limitation in the current editor’s handling of HTML attributes.

Continuing the discussion from Suggestion: borders for images:

Is there a way to add a class to the img tag that would then allow me to easily add this optionally? For example, if I could do something like:
<img src=“//cdck-file-uploads-global.s3.dualstack.us-west-2.amazonaws.com/meta/original/3X/1/2/12d989f3eb62252a244e170ef6f9b9e4288c5c63.JPG” width=“508” height=“68” class=“borderon”>

Then I could be able to really easily add the custom CSS to add borders just to that class.

I guess you could just add this manually, right? (Both in your post and in your CSS customizations. I haven’t tried.)

If it works then maybe something simple like a check box for borders in the upload UI could do the same thing?

I tried adding it to the post manually and it seems to get stripped out…

Two screenshots…one of the above post in edit mode…

So you can see that I’ve added a class to the tag.

Then another screenshot of me doing inspect element where the class is gone from the tag:

I’m sure this is intentional, but not sure if there’s a way to workaround it.

We are having the same issue. Can you guys confirm there is a bug? We were able to add custom classes to images before but now when we create a new topic it is removed.

There is a new MarkDown editor and I think it only allows certain tags and attributes…

class may not be one of them and may be stripped.

If you just want a border on all your included images, what’s wrong with:

.cooked img {
    border: go-wild;
}

or something similar? But of course, you’ve got to handle the emoji’s.

This was recently changed:
https://github.com/discourse/discourse/commit/9cb088e3f6762df3369e647b1de122edd536fa30

As there wasn’t a restriction on classes, it would have been possible to do something like this:

3 Curtiram