# Rasa Chatbot-Widget with html tags

**URL:** <https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015>\
**Category:** Rasa Open Source\
**Created:** [June 24, 2021, 4:12pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015 "2021-06-24T16:12:45Z")\
**Posts on this page:** 16\
**Page:** 1

<div class="post-metadata">

**Author:** ![bolder\_pete](https://avatars.discourse-cdn.com/v4/letter/b/e68b1a/32.png) [@bolder\_pete](https://forum.rasa.com/u/bolder_pete)\
**Post date:** [June 24, 2021, 4:12pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/1 "2021-06-24T16:12:45Z")

</div>

Hey,

does anyone has an idea how to solve the issue with html tags with the Rasa Chat gui from [https://github.com/JiteshGaikwad/Chatbot-Widget](https://github.com/JiteshGaikwad/Chatbot-Widget) ?

If you have p tags eg. the text is outside the text bubbles…

---

<div class="post-metadata">

**Author:** ![nik202](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/nik202/32/16098_2.png) [@nik202](https://forum.rasa.com/u/nik202)\
**Post date:** [June 24, 2021, 4:15pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/2 "2021-06-24T16:15:00Z")

</div>

@bolder_pete can you show the problem? or explain with example?

---

<div class="post-metadata">

**Author:** ![bolder\_pete](https://avatars.discourse-cdn.com/v4/letter/b/e68b1a/32.png) [@bolder\_pete](https://forum.rasa.com/u/bolder_pete)\
**Post date:** [June 24, 2021, 4:18pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/3 "2021-06-24T16:18:25Z")

</div>

Have a look also here: [Rasa Web chat customizing buttons,colors alligning etc - #71 by bolder\_pete](http://forum.rasa.com/t/rasa-web-chat-customizing-buttons-colors-alligning-etc/24716/71)

But, just try it with a text that has several p tags. Then the text is ‘outside’ and not well formatted.

---

<div class="post-metadata">

**Author:** ![nik202](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/nik202/32/16098_2.png) [@nik202](https://forum.rasa.com/u/nik202)\
**Post date:** [June 24, 2021, 4:30pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/4 "2021-06-24T16:30:02Z")

</div>

@bolder_pete I will encourage to follow this thread [Integrating Chatbot-Widget ((https://github.com/JiteshGaikwad/Chatbot-Widget) ) to a Wordpress site?](http://forum.rasa.com/t/integrating-chatbot-widget-https-github-com-jiteshgaikwad-chatbot-widget-to-a-wordpress-site/44965) in one message you will find the video how to integrate the rasa webchat. I have read the above mention thread, please follow the video tutorial and you will be good.

---

<div class="post-metadata">

**Author:** ![bolder\_pete](https://avatars.discourse-cdn.com/v4/letter/b/e68b1a/32.png) [@bolder\_pete](https://forum.rasa.com/u/bolder_pete)\
**Post date:** [June 24, 2021, 4:38pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/5 "2021-06-24T16:38:38Z")

</div>

Thanks! Could you summarize which changes I need to do especially for that?

I do not see where you handle this problem?

---

<div class="post-metadata">

**Author:** ![nik202](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/nik202/32/16098_2.png) [@nik202](https://forum.rasa.com/u/nik202)\
**Post date:** [June 24, 2021, 4:41pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/6 "2021-06-24T16:41:22Z")

</div>

@bolder_pete I never encountered such issue mate. Just try this process and then see. Share some screenshot, the thread you share. I not get that.

---

<div class="post-metadata">

**Author:** ![bolder\_pete](https://avatars.discourse-cdn.com/v4/letter/b/e68b1a/32.png) [@bolder\_pete](https://forum.rasa.com/u/bolder_pete)\
**Post date:** [June 24, 2021, 5:04pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/7 "2021-06-24T17:04:18Z")

</div>

So using p tags works as expected? Maybe its a version thing. I use an older version…

---

<div class="post-metadata">

**Author:** ![nik202](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/nik202/32/16098_2.png) [@nik202](https://forum.rasa.com/u/nik202)\
**Post date:** [June 24, 2021, 5:08pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/8 "2021-06-24T17:08:16Z")

</div>

@bolder_pete are you using rasa webchat? if yes the first see the video. If the problem persists then show us the screenshot, I can not help without seeing some error. The Html tags you suggesting or want to use in domain or custom action not will work as much is dependent on rasa webchat and it is build using React JS. You can only customize the CSS you can not change the whole code as you are using CDN of rasawebchat. I hope my points are clear to you now?

---

<div class="post-metadata">

**Author:** ![bolder\_pete](https://avatars.discourse-cdn.com/v4/letter/b/e68b1a/32.png) [@bolder\_pete](https://forum.rasa.com/u/bolder_pete)\
**Post date:** [June 24, 2021, 5:31pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/9 "2021-06-24T17:31:37Z")

</div>

> [@nik202](#):
>
> The Html tags you suggesting or want to use in domain or custom action not will work as much is dependent on rasa webchat and it is build using React JS.

So you say this will not work, or do I understand this? I use

> **[GitHub - JiteshGaikwad/Chatbot-Widget](https://github.com/JiteshGaikwad/Chatbot-Widget)**
>
> Contribute to JiteshGaikwad/Chatbot-Widget development by creating an account on GitHub.

sorry, named it rasa webchat. Do not know if this is soemthing else…

---

<div class="post-metadata">

**Author:** ![nik202](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/nik202/32/16098_2.png) [@nik202](https://forum.rasa.com/u/nik202)\
**Post date:** [June 24, 2021, 5:39pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/10 "2021-06-24T17:39:33Z")

</div>

@bolder_pete this one is designed while using CSS, HTML, and JS only this one is different and Rasawebchat is different. For rasawebchat see this [GitHub - botfront/rasa-webchat: A feature-rich chat widget for Rasa and Botfront](https://github.com/botfront/rasa-webchat)

Tips: While using Jitesh repose, when you try to deploy on a website you will face a lot of issues as it will not support the dynamic nature of web pages and website. I will encourage the use RasaWebChat for your integration of rasa open source. I hope now you clear?

---

<div class="post-metadata">

**Author:** ![bolder\_pete](https://avatars.discourse-cdn.com/v4/letter/b/e68b1a/32.png) [@bolder\_pete](https://forum.rasa.com/u/bolder_pete)\
**Post date:** [June 24, 2021, 6:00pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/11 "2021-06-24T18:00:42Z")

</div>

No, but thanks. hought you show the video for Jitesh’s GUI?

Have you tried it with a p tag?

---

<div class="post-metadata">

**Author:** ![nik202](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/nik202/32/16098_2.png) [@nik202](https://forum.rasa.com/u/nik202)\
**Post date:** [June 24, 2021, 6:06pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/12 "2021-06-24T18:06:47Z")

</div>

@bolder_pete I haven’t shown you with Jitesh video, I suggested you this video [Rasa Webchat Integration - #119 by Horizon733](http://forum.rasa.com/t/rasa-webchat-integration/19930/119).

I not encountered with the p tag issue but you still stuck on the p tag? Why I have given you a solid reason not to follow that but still you want to stick on the p tag? I am not the creator of the [JiteshGaikwad/Chatbot-Widget](https://github.com/JiteshGaikwad/Chatbot-Widget).

**Note:** My bot is running successfully while using RASAWEB CHAT, so I am not following any other GUI. Thanks

---

<div class="post-metadata">

**Author:** ![bolder\_pete](https://avatars.discourse-cdn.com/v4/letter/b/e68b1a/32.png) [@bolder\_pete](https://forum.rasa.com/u/bolder_pete)\
**Post date:** [June 24, 2021, 6:18pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/13 "2021-06-24T18:18:26Z")

</div>

Ok, thought so because you answered to my question extra related to Jitesh’s!

---

<div class="post-metadata">

**Author:** ![nik202](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/nik202/32/16098_2.png) [@nik202](https://forum.rasa.com/u/nik202)\
**Post date:** [June 24, 2021, 6:31pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/14 "2021-06-24T18:31:55Z")

</div>

@bolder_pete you hunting the dead end. Good Luck! Hope you solved your issue soon!

---

<div class="post-metadata">

**Author:** ![bolder\_pete](https://avatars.discourse-cdn.com/v4/letter/b/e68b1a/32.png) [@bolder\_pete](https://forum.rasa.com/u/bolder_pete)\
**Post date:** [June 24, 2021, 6:45pm UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/15 "2021-06-24T18:45:24Z")

</div>

> [@nik202](#):
>
> you hunting the dead end

what you mean?! 😅

---

<div class="post-metadata">

**Author:** ![Horizon733](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/horizon733/32/20855_2.png) [@Horizon733](https://forum.rasa.com/u/Horizon733)\
**Post date:** [June 25, 2021, 8:21am UTC](https://forum.rasa.com/t/rasa-chatbot-widget-with-html-tags/45015/16 "2021-06-25T08:21:42Z")

</div>

Listen @bolder_pete Jitesh suggested you to use markdown I hope you know what markdown is. And not to use HTML tags. I hope you know the difference between them and then resolve. and if you don’t know I will suggest you to search the difference
