# Cards in rasa

**URL:** <https://forum.rasa.com/t/cards-in-rasa/5442>\
**Category:** Rasa Open Source\
**Created:** [February 22, 2019, 10:00am UTC](https://forum.rasa.com/t/cards-in-rasa/5442 "2019-02-22T10:00:17Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![ajshrr](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/ajshrr/32/2017_2.png) [@ajshrr](https://forum.rasa.com/u/ajshrr)\
**Post date:** [February 22, 2019, 10:00am UTC](https://forum.rasa.com/t/cards-in-rasa/5442/1 "2019-02-22T10:00:17Z")

</div>

Does Rasa support cards just like the Bot framework? If so please provide an example.

---

<div class="post-metadata">

**Author:** ![Juste](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/juste/32/15_2.png) [@Juste](https://forum.rasa.com/u/Juste)\
**Post date:** [March 7, 2019, 1:04pm UTC](https://forum.rasa.com/t/cards-in-rasa/5442/2 "2019-03-07T13:04:55Z")

</div>

Hey @ajshrr. The elements that Rasa can send out depend on what UI you want to connect your assistant wtih. So for example, with Slack or Messenger you can send ‘rich’ messages which contain images, buttons, etc. What UI you are looking to connect your assistant with?

---

<div class="post-metadata">

**Author:** ![ajshrr](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/ajshrr/32/2017_2.png) [@ajshrr](https://forum.rasa.com/u/ajshrr)\
**Post date:** [March 8, 2019, 7:26am UTC](https://forum.rasa.com/t/cards-in-rasa/5442/3 "2019-03-08T07:26:45Z")

</div>

Consider weatherbot which connects to the apixu and retrieves data in the form of json. This json has a URL pointing to the image. I tried displaying it on the slack but failed.

Could you please provide an example how such images can be displayed on the slack.

Below gives a sample of the json retrieved which has a URL pointing to the png. I would like to display the image on the slack instead of URL.

{‘location’: {‘name’: ‘Paris’, ‘region’: ‘Ile-de-France’, ‘country’: ‘France’, ‘lat’: 48.87, ‘lon’: 2.33, ‘tz\_id’: ‘Europe/Paris’, ‘localtime\_epoch’: 1548660160, ‘localtime’: ‘2019-01-28 8:22’ }, ‘current’: {‘last\_updated\_epoch’: 1548658821, ‘last\_updated’: ‘2019-01-28 08:00’, ‘temp\_c’: 2.0, ‘temp\_f’: 35.6, ‘is\_day’: 0, ‘condition’: {‘text’: ‘Partly cloudy’, ‘icon’: ‘[//cdn.apixu.com/weather/64x64/night/116.png](https://cdn.apixu.com/weather/64x64/night/116.png)’, ‘code’: 1003 }, ‘wind\_mph’: 8.1, ‘wind\_kph’: 13.0, ‘wind\_degree’: 260, ‘wind\_dir’: ‘W’, ‘pressure\_mb’: 1001.0, ‘pressure\_in’: 30.0, ‘precip\_mm’: 0.0, ‘precip\_in’: 0.0, ‘humidity’: 87, ‘cloud’: 75, ‘feelslike\_c’: -1.6, ‘feelslike\_f’: 29.2, ‘vis\_km’: 10.0, ‘vis\_miles’: 6.0, ‘uv’: 0.0 } }

---

<div class="post-metadata">

**Author:** ![Prskriti](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/prskriti/32/4993_2.png) [@Prskriti](https://forum.rasa.com/u/Prskriti)\
**Post date:** [November 19, 2019, 11:38am UTC](https://forum.rasa.com/t/cards-in-rasa/5442/4 "2019-11-19T11:38:07Z")

</div>

I want to connect my assistant with website hosted locally. Could you please provide some information of how to display rich contents as a response.

---

<div class="post-metadata">

**Author:** ![JiteshGaikwad](https://avatars.discourse-cdn.com/v4/letter/j/77aa72/32.png) [@JiteshGaikwad](https://forum.rasa.com/u/JiteshGaikwad)\
**Post date:** [November 20, 2019, 2:53pm UTC](https://forum.rasa.com/t/cards-in-rasa/5442/5 "2019-11-20T14:53:42Z")

</div>

hey @Prskriti, check out this UI, I have added the support for cards:

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

---

<div class="post-metadata">

**Author:** ![Prskriti](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/prskriti/32/4993_2.png) [@Prskriti](https://forum.rasa.com/u/Prskriti)\
**Post date:** [November 21, 2019, 7:42am UTC](https://forum.rasa.com/t/cards-in-rasa/5442/6 "2019-11-21T07:42:57Z")

</div>

hi @JiteshGaikwad tnq it did work 🙂

---

<div class="post-metadata">

**Author:** ![JiteshGaikwad](https://avatars.discourse-cdn.com/v4/letter/j/77aa72/32.png) [@JiteshGaikwad](https://forum.rasa.com/u/JiteshGaikwad)\
**Post date:** [November 21, 2019, 7:55am UTC](https://forum.rasa.com/t/cards-in-rasa/5442/7 "2019-11-21T07:55:24Z")

</div>

you are welcome, if you would like to have features which aren’t there you can raise the issue in the GitHub Repo. 🙂

---

<div class="post-metadata">

**Author:** ![Prskriti](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.rasa.com/prskriti/32/4993_2.png) [@Prskriti](https://forum.rasa.com/u/Prskriti)\
**Post date:** [November 21, 2019, 8:05am UTC](https://forum.rasa.com/t/cards-in-rasa/5442/8 "2019-11-21T08:05:45Z")

</div>

@JiteshGaikwad ohk

---

<div class="post-metadata">

**Author:** ![shaileshsarda](https://avatars.discourse-cdn.com/v4/letter/s/9f8e36/32.png) [@shaileshsarda](https://forum.rasa.com/u/shaileshsarda)\
**Post date:** [February 20, 2020, 9:34am UTC](https://forum.rasa.com/t/cards-in-rasa/5442/9 "2020-02-20T09:34:01Z")

</div>

Hi @JiteshGaikwad, Can I use this customized UI widget with the RASA’s Older Versions like rasa==0.1.0, rasa-core==0.12.4, rasa-nlu==0.13.8? If yes, then how?

---

<div class="post-metadata">

**Author:** ![JiteshGaikwad](https://avatars.discourse-cdn.com/v4/letter/j/77aa72/32.png) [@JiteshGaikwad](https://forum.rasa.com/u/JiteshGaikwad)\
**Post date:** [February 20, 2020, 9:58am UTC](https://forum.rasa.com/t/cards-in-rasa/5442/10 "2020-02-20T09:58:08Z")

</div>

hey @shaileshsarda, it will work for older versions since it uses REST api, just test it out and let me know if you face any error.

---

<div class="post-metadata">

**Author:** ![shaileshsarda](https://avatars.discourse-cdn.com/v4/letter/s/9f8e36/32.png) [@shaileshsarda](https://forum.rasa.com/u/shaileshsarda)\
**Post date:** [February 20, 2020, 11:06am UTC](https://forum.rasa.com/t/cards-in-rasa/5442/11 "2020-02-20T11:06:48Z")

</div>

Well, thanks for the quick update @JiteshGaikwad. I will let you know soon.

---

<div class="post-metadata">

**Author:** ![cityhunter25197](https://avatars.discourse-cdn.com/v4/letter/c/57b2e6/32.png) [@cityhunter25197](https://forum.rasa.com/u/cityhunter25197)\
**Post date:** [April 20, 2020, 3:08pm UTC](https://forum.rasa.com/t/cards-in-rasa/5442/12 "2020-04-20T15:08:12Z")

</div>

Hi, I didn’t find the example of carousel response in your docs/responses.md. Can you help me?

---

<div class="post-metadata">

**Author:** ![JiteshGaikwad](https://avatars.discourse-cdn.com/v4/letter/j/77aa72/32.png) [@JiteshGaikwad](https://forum.rasa.com/u/JiteshGaikwad)\
**Post date:** [April 20, 2020, 4:41pm UTC](https://forum.rasa.com/t/cards-in-rasa/5442/13 "2020-04-20T16:41:57Z")

</div>

@cityhunter25197 I will add it soon since the carousel wasn’t generic.

---

<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:** [May 5, 2020, 1:29pm UTC](https://forum.rasa.com/t/cards-in-rasa/5442/14 "2020-05-05T13:29:13Z")

</div>

Hi Jitesh,

There is no example of Card Carousel in this Chatbot-Widget as the others are examples have. Can you update with Card Carousel example.?

---

<div class="post-metadata">

**Author:** ![JiteshGaikwad](https://avatars.discourse-cdn.com/v4/letter/j/77aa72/32.png) [@JiteshGaikwad](https://forum.rasa.com/u/JiteshGaikwad)\
**Post date:** [May 5, 2020, 2:23pm UTC](https://forum.rasa.com/t/cards-in-rasa/5442/15 "2020-05-05T14:23:21Z")

</div>

hi @nik202, the card carousel was built specifically for Restaurant bot and it’s isn’t generic, if you want to add, you can check the code here:

> <https://github.com/JiteshGaikwad/Chatbot-Widget/blob/e38f0fcc45147d09b044513af518354e2b74f78e/static/js/script.js#L420>

---

<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:** [May 6, 2020, 11:28am UTC](https://forum.rasa.com/t/cards-in-rasa/5442/16 "2020-05-06T11:28:14Z")

</div>

Thanks for the reply @JiteshGaikwad I have seen that code. What about domain.yml code the CardsCarousel? any suggestions on that?

---

<div class="post-metadata">

**Author:** ![JiteshGaikwad](https://avatars.discourse-cdn.com/v4/letter/j/77aa72/32.png) [@JiteshGaikwad](https://forum.rasa.com/u/JiteshGaikwad)\
**Post date:** [May 6, 2020, 1:51pm UTC](https://forum.rasa.com/t/cards-in-rasa/5442/17 "2020-05-06T13:51:49Z")

</div>

I am not sending any cardscarousel from domain.yml file since it requires bit amount of json data.

---

<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:** [September 30, 2020, 12:57pm UTC](https://forum.rasa.com/t/cards-in-rasa/5442/18 "2020-09-30T12:57:22Z")

</div>

🙂 waiting for the code patiently, if you got time please update. many thanks in advance.

---

<div class="post-metadata">

**Author:** ![mounika2](https://avatars.discourse-cdn.com/v4/letter/m/3ec8ea/32.png) [@mounika2](https://forum.rasa.com/u/mounika2)\
**Post date:** [December 29, 2020, 10:51am UTC](https://forum.rasa.com/t/cards-in-rasa/5442/19 "2020-12-29T10:51:59Z")

</div>

Hi @JiteshGaikwad, can you please share that json data for example.

---

<div class="post-metadata">

**Author:** ![JiteshGaikwad](https://avatars.discourse-cdn.com/v4/letter/j/77aa72/32.png) [@JiteshGaikwad](https://forum.rasa.com/u/JiteshGaikwad)\
**Post date:** [December 29, 2020, 12:13pm UTC](https://forum.rasa.com/t/cards-in-rasa/5442/20 "2020-12-29T12:13:33Z")

</div>

@mounika2 I don’t have any sample JSON data as of now but you can refer to this Resto Bot as an example:

> <https://github.com/JiteshGaikwad/Restaurant-Search-Bot/blob/f5a01ebcd36ba181c6c7e91de7a9c7c00afea708/actions.py#L153>
