...
Snippet
Code Block | ||
---|---|---|
| ||
{ "type": "card", "items": [{ "content "title": `<h1>Card"Card componentDetail One<h1>`title", "contentUrl "imageURL": "http://example.com/oeapi/htmltwohospitalone", "detailView": { "title //optional "body": "A sample description of the Hospital and its services", "button": "CardCheck Detailmore titledetails", "content": `<h1> Card detail view ${i+1} </h1>`, "contentUrl": "http://example.com/oeapi/htmlone", //optional "html": "<p>provide the full HTML data</p>", // optional "detailDisplay": [{ "type": "Accordion", "items": [{ "title": "Accordion One", "body": `<p> Lorem Ipsum is simply dummy text</p>` }, { "title": "Accordion Two", "body": `<p> Lorem Ipsum is simply dummy text</p>` }] }] } }, { "content": `<h1>Card component Two<h1>`, "contentUrl": url, "detailView": { }] }] } }, { "title": "Card Detail title", "content": `<h1> Card detail view ${i+1} </h1>`, "contentUrl": "http://example.com/oeapi/htmlthree", "imageURL": "", //optional "body": "", "button": "", //optional "html": "", // optional "detailDisplay": [{ "type": "Accordion", "items": [{ "title": "Accordion three", "body": `<p> Lorem Ipsum is simply dummy text</p>` }, { "title": "Accordion four", "body": `<p> Lorem Ipsum is simply dummy text</p>` }] }] } }] }] } }], "filterButton": false } |
Please add the above snippet in the Chatbot Settings under the directive
object or use the Function node in the Experience Designer to construct the msg.payload.orbita.directive
to prepare the Directive data. The latter takes priority over the former method.
...
Property | Description |
---|---|
| This property accepts |
| The items property holds an Array of Card data and this is displayed on the Bot. Each Card object can have the below properties.
|
| This property will hold the HTML content to render the main Card data. Sample: |
| This property is optional. This can be used to host the content in a template and we must specify the endpoint here. The card will render from that endpoint. This property take priority over the Sample:
|
". The properties are tied to default CSS styles.
| |
| The property The properties inside this, namely the |
| The functionality for the Filter page is under development. Please have the property set to false until further change. |
...
Code Block |
---|
"detailDisplay": [{ "type": "Accordion", "method" : "flush", "items": [{ "title": "Accordion three", "body": `<p> Lorem Ipsum is simply dummy text</p>` }, { "title": "Accordion four", "body": `<p> Lorem Ipsum is simply dummy text</p>` } ] }] |
...
Property | Description |
---|---|
| This property accepts |
| This property accepts values |
| The items property holds an Array of Accordion data and this is displayed on the detailed page. The
|
...
Code Block |
---|
{ "type": "card", "items": [{ "content": `<h1>Card component Two<h1>`, "contentUrl": url, "detailView": { "title": "Card Detail title", "content": `<h1> Card detail view ${i+1} </h1>`, "contentUrl": "http://example.com/oeapi/htmlthree", "detailDisplay": [{ type: "Tab", items: [{ title: "Tab one", content: "<p>sample tab one</p>", contentUrl: "https://example.com/oeapi/tabHtmlone" }, { title: "Tab two", content: "<p>sample tab two</p>", contentUrl: "https://example.com/oeapi/tabHtmltwo" }] },{ "type": "Accordion", "items": [{ "title": "Accordion three", "body": `<p> Lorem Ipsum is simply dummy text</p>` }] } ] } }], "filterButton": false } |
...
Property | Description |
---|---|
| This property accepts |
| The items property holds an Array of Tab data and this is displayed on the detailed page. The
|
Related Articles
Filter by label (Content by label) | ||||||||
---|---|---|---|---|---|---|---|---|
|