# Wie kann ich eine Klasse in einem Theme whitelisten?
**URL:** https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520
**Category:** Development
**Created:** [1. Februar 2018 um 04:18 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520 "2018-02-01T04:18:54Z")
**Posts on this page:** 16
**Page:** 1
### Author:  [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [1. Februar 2018 um 04:18 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/1 "2018-02-01T04:18:54Z")
I have a working carousel which I would like to package as a theme:
I’ve been trying to figure out how to whitelist a class or attribute for the script to target that would work with under a theme.
I’ve read:
[https://meta.discourse.org/t/whitelisting-some-html-tags/24280](https://meta.discourse.org/t/whitelisting-some-html-tags/24280)
and
[Whitelist all the code inside of a div tag? - #4 by Alex\_Rabolin](https://meta.discourse.org/t/whitelist-all-the-code-inside-of-a-div-tag/51391/4)
But these topics cover plugin structure and I could not get any of the methods to work in a theme.
I’ve used the `[dir]` attribute - white-listed by default - in another theme [here](https://meta.discourse.org/t/discourse-masonry-gallery-theme-component/79076)
However, that won’t work for two reasons:
1- the Next and Previous buttons will be mixed up based on the text direction
2- The slides can contain text like so:
and I’d really rather not go down that rabbit hole where I override the text direction with CSS - that’s just too hacky even for me.
I’m pretty much stuck here 😅
The current selector I’m using to initialize the script on the container is:
```plaintext
$('.cooked>div[dir*="rtl"]')
```
* * *
So my question is:
**How can I while-list a class or attribute for a div in a theme?**
---
### Author:  [@sam](https://meta.discourse.org/u/sam)
#### Post date: [1. Februar 2018 um 04:33 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/2 "2018-02-01T04:33:15Z")
Oh you can not do that yet, what I would like to do is just have `.theme-[a-z]+` automatically whitelisted, but it requires fiddling with the whitelister a bit.
Assigning this to me, but may take a few weeks to get around to it.
If @angus or @david feel like giving it a shot, be my guest.
---
### Author:  [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [1. Februar 2018 um 04:54 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/4 "2018-02-01T04:54:12Z")
No worries @sam 🌻
Thank you for taking this on - no rush at all I’m sure your plate is full 😅
I have one last followup question.
Does defining new tags like:
```plaintext
[foo]
// slides
[/foo]
```
to be later converted into
```plaintext
// slides
```
in the cooked output also require a plugin for now?
---
### Author:  [@sam](https://meta.discourse.org/u/sam)
#### Post date: [1. Februar 2018 um 04:59 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/5 "2018-02-01T04:59:05Z")
Yeah if you are trying to amend the markdown pipeline I think you need a plugin. One thing that is good security wise with themes is that they are not allowed to run on the server, this would change it.
---
### Author:  [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [1. Februar 2018 um 08:07 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/6 "2018-02-01T08:07:09Z")
I spent a bit more time trying out different things and here's what I found
1- `` is not filtered out even if the value does not match `rtl` or `ltr`
2- `` is also not filtered out
* * *
This line has can be selected with [dir="foo"]
This line can be selected with div[dir=""]
* * *
So I can technically make
```plaintext
// slides
```
work but I have a feeling that you might be interested in preventing this behavior. I will wait and see what you think.
---
### Author:  [@tshenry](https://meta.discourse.org/u/tshenry)
#### Post date: [14. Februar 2018 um 10:43 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/7 "2018-02-14T10:43:54Z")
Wow, this looks fantastic. Really hoping this sees the light of day.
---
### Author:  [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [14. Februar 2018 um 20:03 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/8 "2018-02-14T20:03:48Z")
I wonder if we could adopt this somehow [GitHub - markdown-it/markdown-it-container: Fenced container plugin for markdown-it markdown parser · GitHub](https://github.com/markdown-it/markdown-it-container)
Maybe under a site setting or a plugin.
---
### Author:  [@sam](https://meta.discourse.org/u/sam)
#### Post date: [14. Februar 2018 um 20:15 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/9 "2018-02-14T20:15:36Z")
In general we do blocks in bbcode, so it gets a bit confusing to add another pattern.
The issue here is the whitelister per:
[https://github.com/discourse/discourse/blob/master/app/assets/javascripts/pretty-text/white-lister.js.es6#L114-L179](https://github.com/discourse/discourse/blob/master/app/assets/javascripts/pretty-text/white-lister.js.es6#L114-L179)
But our DSL is a bit too limited atm to add `theme-*` as a whitelisted class so we need to fix that.
---
### Author:  [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [15. Februar 2018 um 03:16 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/10 "2018-02-15T03:16:41Z")
```plaintext
```
Would also work.
This line can be selected with [data-carousel="true"]
And unlike
``
or
``
`` is valid html
Still feels a bit unorthodox though 😶
---
### Author:  [@sam](https://meta.discourse.org/u/sam)
#### Post date: [15. Februar 2018 um 04:55 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/11 "2018-02-15T04:55:52Z")
Oh, I can add data-\* to div quite easily, does that help?
---
### Author:  [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [15. Februar 2018 um 05:04 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/12 "2018-02-15T05:04:46Z")
> [@sam](#):
>
> Oh, I can add data-\* to div quite easily, does that help?
Yes! 🔥
I think that would work and pretty much cover everything.
attribute selectors work with jQuery and CSS just fine. 🍷
---
### Author:  [@riking](https://meta.discourse.org/u/riking)
#### Post date: [15. Februar 2018 um 06:19 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/13 "2018-02-15T06:19:17Z")
Perhaps data-custom-\* or data-c-\* – you don’t want to get stuff confused with data-lazyYT
---
### Author:  [@j.jaffeux](https://meta.discourse.org/u/j.jaffeux)
#### Post date: [15. Februar 2018 um 07:34 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/14 "2018-02-15T07:34:03Z")
yes and AFAIK it doesn’t have any noticeable performance hit
---
### Author:  [@sam](https://meta.discourse.org/u/sam)
#### Post date: [15. Februar 2018 um 08:19 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/15 "2018-02-15T08:19:29Z")
Sure then, can you do a PR to add `data-theme-*` on DIV, I think it makes good sense and will not clash.
---
### Author:  [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [15. Februar 2018 um 08:48 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/16 "2018-02-15T08:48:16Z")
> [@sam](#):
>
> I think it makes good sense and will not clash.
This is great news! 🤩
> [@sam](#):
>
> can you do a PR to add data-theme-\* on DIV
Well I tried anyway 😅
[https://github.com/discourse/discourse/pull/5598](https://github.com/discourse/discourse/pull/5598)
PR submitted
---
### Author:  [@bekircem](https://meta.discourse.org/u/bekircem)
#### Post date: [15. Mai 2020 um 10:37 UTC](https://meta.discourse.org/t/how-can-i-whitelist-a-class-in-a-theme/79520/17 "2020-05-15T10:37:03Z")
Können wir data-theme-\* für p-Tags verwenden?