# Adding custom class to img tag

**URL:** https://meta.discourse.org/t/adding-custom-class-to-img-tag/21425
**Category:** Feature
**Created:** [10월 22, 2014, 5:06오후 UTC](https://meta.discourse.org/t/adding-custom-class-to-img-tag/21425 "2014-10-22T17:06:10Z")
**Posts on this page:** 8
**Page:** 1

<div class="post-metadata">

### Author: ![mpteng](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mpteng/32/108099_2.png) [@mpteng](https://meta.discourse.org/u/mpteng)
#### Post date: [10월 22, 2014, 5:06오후 UTC](https://meta.discourse.org/t/adding-custom-class-to-img-tag/21425/1 "2014-10-22T17:06:10Z")

</div>

Continuing the discussion from [Suggestion: borders for images](https://meta.discourse.org/t/suggestion-borders-for-images/4224/16):

> [@ampburner](#):
>
> completely agree with @Vilx
> 
> This is not about styling.  
> when you post a (partially white) image in a post with a white background - the image becomes visually indistinguishable from the discussion.
> 
> An example:  
> \<img src=“[//cdck-file-uploads-global.s3.dualstack.us-west-2.amazonaws.com/meta/original/3X/1/2/12d989f3eb62252a244e170ef6f9b9e4288c5c63.JPG](https://global.discourse-cdn.com/meta/original/3X/1/2/12d989f3eb62252a244e170ef6f9b9e4288c5c63.JPG)” width=“508” height=“68”\>
> 
> I’m going to see if I can change this in my own Discourse install’s css - but I think it should be part of the default css.

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](https://global.discourse-cdn.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.

---

<div class="post-metadata">

### Author: ![downey](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/downey/32/166878_2.png) [@downey](https://meta.discourse.org/u/downey)
#### Post date: [10월 22, 2014, 5:19오후 UTC](https://meta.discourse.org/t/adding-custom-class-to-img-tag/21425/2 "2014-10-22T17:19:01Z")

</div>

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?

---

<div class="post-metadata">

### Author: ![mpteng](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mpteng/32/108099_2.png) [@mpteng](https://meta.discourse.org/u/mpteng)
#### Post date: [10월 22, 2014, 5:38오후 UTC](https://meta.discourse.org/t/adding-custom-class-to-img-tag/21425/3 "2014-10-22T17:38:05Z")

</div>

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

![](https://global.discourse-cdn.com/meta/original/3X/f/6/f6418cea1b949bf386b9d23ab5740794e5ddf150.png)

---

<div class="post-metadata">

### Author: ![mpteng](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mpteng/32/108099_2.png) [@mpteng](https://meta.discourse.org/u/mpteng)
#### Post date: [10월 22, 2014, 5:40오후 UTC](https://meta.discourse.org/t/adding-custom-class-to-img-tag/21425/4 "2014-10-22T17:40:50Z")

</div>

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

![](https://global.discourse-cdn.com/meta/original/3X/5/2/5232d7c1ce0d6f505c490c1d64ea62697d272661.png)

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:  
 ![](https://global.discourse-cdn.com/meta/original/3X/8/0/8027bc46b8d454f5df208b4ec4af74ba04a7db36.PNG)

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

---

<div class="post-metadata">

### Author: ![Fazilet\_Ozer](https://avatars.discourse-cdn.com/v4/letter/f/e9c0ed/32.png) [@Fazilet\_Ozer](https://meta.discourse.org/u/Fazilet_Ozer)
#### Post date: [10월 20, 2017, 1:44오후 UTC](https://meta.discourse.org/t/adding-custom-class-to-img-tag/21425/5 "2017-10-20T13:44:22Z")

</div>

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.

---

<div class="post-metadata">

### Author: ![schungx](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/schungx/32/70989_2.png) [@schungx](https://meta.discourse.org/u/schungx)
#### Post date: [10월 20, 2017, 1:56오후 UTC](https://meta.discourse.org/t/adding-custom-class-to-img-tag/21425/6 "2017-10-20T13:56:40Z")

</div>

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:

```plaintext
.cooked img {
    border: go-wild;
}

```

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

---

<div class="post-metadata">

### Author: ![jomaxro](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jomaxro/32/126216_2.png) [@jomaxro](https://meta.discourse.org/u/jomaxro)
#### Post date: [10월 20, 2017, 2:43오후 UTC](https://meta.discourse.org/t/adding-custom-class-to-img-tag/21425/7 "2017-10-20T14:43:50Z")

</div>

This was recently changed:  
[https://github.com/discourse/discourse/commit/9cb088e3f6762df3369e647b1de122edd536fa30](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:

[https://global.discourse-cdn.com/meta/original/3X/9/b/9b413d8b2d4b627944a033057956e11f08520900.mp4](https://global.discourse-cdn.com/meta/original/3X/9/b/9b413d8b2d4b627944a033057956e11f08520900.mp4)

---

<div class="post-metadata">

### Author: ![chapoi](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chapoi/32/537252_2.png) [@chapoi](https://meta.discourse.org/u/chapoi)
#### Post date: [12월 4, 2025, 11:32오전 UTC](https://meta.discourse.org/t/adding-custom-class-to-img-tag/21425/8 "2025-12-04T11:32:29Z")

</div>


