# Problem to open modal windows for a post and whitelistTag html

**URL:** https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443
**Category:** Support
**Created:** [5월 18, 2016, 3:18오후 UTC](https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443 "2016-05-18T15:18:32Z")
**Posts on this page:** 11
**Page:** 1

<div class="post-metadata">

### Author: ![Alex\_Rabolin](https://avatars.discourse-cdn.com/v4/letter/a/db5fbb/32.png) [@Alex\_Rabolin](https://meta.discourse.org/u/Alex_Rabolin)
#### Post date: [5월 18, 2016, 3:18오후 UTC](https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443/1 "2016-05-18T15:18:32Z")

</div>

Hello , I am part of the team “kitedor.info” with @babyfooter.

I have made a modal window on our discourse.  
She is opened by clicking on a menu link in the header.

This is the HTML of the modal window in the header css section :

```
<!-- Modal One -->
<div class="modal1">
  <input class="modal1-open" id="modal-one" type="checkbox" hidden>
    <div class="modal1-wrap" aria-hidden="true" role="dialog">                   
    <label class="modal1-overlay" for="modal-one"></label>       
          <div class="modal1-dialog">
            <div class="modal1-header"><h2>Les News de KiteDor</h2>
            <label class="btn-close" for="modal-one" aria-hidden="true">×</label></div>
                <div class="modal1-body">...</div>
         </div>
    </div>
  </div>

```

I wish I could open this modal window from a post but the problem is, post does not accept this css tag :  
for=“modal-one” and automatically clears it.

Here is the html that I’ve put in the post :

`<label for="modal-one"><a >News</a></label>`

Can you help me , it is a way to gain acceptance for = " modal -one " in a post without whatsoever erase, to force the CSS to just accept this tag for = “” .

Thank you in advance for your help and sorry for my bad english.

---

<div class="post-metadata">

### Author: ![Alex\_Rabolin](https://avatars.discourse-cdn.com/v4/letter/a/db5fbb/32.png) [@Alex\_Rabolin](https://meta.discourse.org/u/Alex_Rabolin)
#### Post date: [5월 22, 2016, 2:57오후 UTC](https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443/2 "2016-05-22T14:57:20Z")

</div>

Hello , I advance a little on my problem and I think I found the solution, but I can not put in a pratique.  
I need help.  
All my tests are performed locally on my mac and not on the server.  
I think the solution is here:  
[https://meta.discourse.org/t/whitelisting-some-html-tags/24280](https://meta.discourse.org/t/whitelisting-some-html-tags/24280)

But I don’t understand how.  
I have edited the file: **“/var/www/discourse/app/assets/javascripts/discourse/lib/markdown.js”**  
and add this line : **Discourse.Markdown.whiteListTag(‘label’, ‘for’, ‘modal-one’);**  
But `for="modal-one"` disappears again in tag

I write : `<label for="modal-one"><a >News</a></label>` in the post  
**and** the inspector gives that : `<label><a>News</a></label>`

Where I am wrong please ?

Thanks.

---

<div class="post-metadata">

### Author: ![Alex\_Rabolin](https://avatars.discourse-cdn.com/v4/letter/a/db5fbb/32.png) [@Alex\_Rabolin](https://meta.discourse.org/u/Alex_Rabolin)
#### Post date: [5월 27, 2016, 8:29오전 UTC](https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443/3 "2016-05-27T08:29:47Z")

</div>

Nobody for help me ?

---

<div class="post-metadata">

### Author: ![fefrei](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/fefrei/32/119538_2.png) [@fefrei](https://meta.discourse.org/u/fefrei)
#### Post date: [5월 27, 2016, 9:07오전 UTC](https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443/4 "2016-05-27T09:07:02Z")

</div>

Do not manually edit files within the Docker container. Instead, write a small plugin for this as mentioned [here](https://meta.discourse.org/t/whitelisting-some-html-tags/24280).

---

<div class="post-metadata">

### Author: ![Alex\_Rabolin](https://avatars.discourse-cdn.com/v4/letter/a/db5fbb/32.png) [@Alex\_Rabolin](https://meta.discourse.org/u/Alex_Rabolin)
#### Post date: [5월 27, 2016, 9:56오전 UTC](https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443/5 "2016-05-27T09:56:04Z")

</div>

Thanks very mutch fefrei.  
Just ,do You think my line is correct for resolve the problem in making a little plugin : Discourse.Markdown.whiteListTag(‘label’, ‘for’, ‘modal-one’); ?

---

<div class="post-metadata">

### Author: ![fefrei](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/fefrei/32/119538_2.png) [@fefrei](https://meta.discourse.org/u/fefrei)
#### Post date: [5월 27, 2016, 10:15오전 UTC](https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443/6 "2016-05-27T10:15:00Z")

</div>

That looks plausible 🙂

[Here](https://github.com/fefrei/discourse-teamup) is a similar plugin I’m using myself, for reference.

---

<div class="post-metadata">

### Author: ![Mittineague](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mittineague/32/114259_2.png) [@Mittineague](https://meta.discourse.org/u/Mittineague)
#### Post date: [5월 27, 2016, 10:16오전 UTC](https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443/7 "2016-05-27T10:16:49Z")

</div>

> [@Alex\_Rabolin](#):
>
> ?

No

The last parameter is a regular expression, not a string

Try `/modal-one/` _not_ in quotation marks.

---

<div class="post-metadata">

### Author: ![Alex\_Rabolin](https://avatars.discourse-cdn.com/v4/letter/a/db5fbb/32.png) [@Alex\_Rabolin](https://meta.discourse.org/u/Alex_Rabolin)
#### Post date: [5월 28, 2016, 1:09오전 UTC](https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443/8 "2016-05-28T01:09:10Z")

</div>

@fefrei and @Mittineague,  
Problem solved thanks to you both.  
A big thank-you.

my little plugin :  
[https://github.com/AlexRabolin/modal-window.git](https://github.com/AlexRabolin/modal-window.git)

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [2월 7, 2019, 1:11오후 UTC](https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443/9 "2019-02-07T13:11:58Z")

</div>



---

<div class="post-metadata">

### Author: ![Johani](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/johani/32/176920_2.png) [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [2월 7, 2019, 1:18오후 UTC](https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443/10 "2019-02-07T13:18:54Z")

</div>

A plugin is no longer needed to render a modal. It can be done in a theme or theme component.

More information about that here:

> [@Render modal from theme client-side plugin API](https://meta.discourse.org/t/render-modal-from-theme-client-side-plugin-api/94305):
>
> Is there any way to render a modal from the theme javascript? I was looking forward to render a modal similar to the one that shows up when changing avatar. Example: \<script type="text/discourse-plugin" version="0.8"\> api.onPageChange((url, title) =\> { if (condition) { renderModal; } }); \</script\>

---

<div class="post-metadata">

### Author: ![Johani](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/johani/32/176920_2.png) [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [2월 7, 2019, 1:18오후 UTC](https://meta.discourse.org/t/problem-to-open-modal-windows-for-a-post-and-whitelisttag-html/44443/11 "2019-02-07T13:18:57Z")

</div>


