MENU
      Composite

        Composite


        Article summary

        Available in Classic and VPC

        This document describes the Composite component of the response components of a chatbot answer.

        The Composite component consists of the following two basic components.

        These components allow you to set the chatbot's response to each feature in Chatbot Builder, and return the response results in JSON format.

        Template component

        The Template component consists of cover, content table, and foot table.

        Template component response body

        The following is the response body of the Template component.

        FieldTypeRequiredDescription
        typeStringRequiredComponent type
        • Only template is available among the 2 basic components for the Template component
        titleStringOptionalComponent title
        • Short bold text
        subTitleStringOptionalSubcomponent title
        • Short gray text
        dataObjectOptionalTemplate component configuration information
        data.coverObjectRequiredCover information
        data.descriptionStringOptionalComponent detailed descriptions
        • Long text
        data.contentBackgroundImageStringOptionalBackground image URL displayed in the content table area
        • Must be a URL of https format
        data.contentTableArrayOptionalcontentTable details
        • Two-dimensional cell array
        • Up to three rows can be set
        • For more information, see Basic component
        data.footBackgroundImageStringOptionalBackground image URL displayed in the foot table area
        • Must be a URL of https format
        data.footTableArrayOptionalfootTable details
        • Components are identical to contentTable but can only be displayed if contentTable exists
        data.footTableShowRowsIntegerOptionalMaximum number of rows
        • If the number of rows is greater than the maximum, the maximum rows should be displayed and collapsed, and an expand button should be added
        • Display all rows when not set
        data.actionActionOptionalComponent action information

        Table

        The following describes Table.

        FieldTypeRequiredDescription
        rowSpanIntegerRequiredNumber of rows occupied by cells in the table (span)
        colSpanIntegerRequiredNumber of columns occupied by cells in the table (span)
        dataObjectOptionaldata area information of the Template component
        data.typeStringConditionalComponent type
        data.titleStringConditionalComponent name
        data.subTitleStringConditionalSubcomponent name
        data.dataObjectConditionalSubcomponent configuration information
        data.data.typeStringConditionalSubcomponent type
        data.data.iconUrlStringConditionalIcon URL address
        data.data.actionObjectConditionalComponent action information
        data.data.action.typeStringConditionalComponent action type
        data.data.action.dataObjectConditionalComponent action details

        Template component response example

        The following is a sample response of the Template component.

        {
            "type": "template",
            "title": "optional, short bold text",
            "subTitle": "optional, short gray text",
            "data":{
                "cover":{
                    "contentTableShowRows": 3,
                    "contentTable":
                    [
                        "colSpan": 1,
                        "rowSpan": 2,
                        "data":{}
                    ]
                }
            },
            "footTableShowRows":3,
            "footBackgroundImage":"https://ssl.pstatic.net/CloudFunctions.png",
            "footTable":[]
        }
        JSON

        Persistent Menu component

        The Persistent Menu component is displayed when the user taps the menu button in the chatbar, and is always included in the Open response. Other responses that don't change utils contain the permanentMenu content.

        Persistent Menu response body

        The following is the response body of Persistent Menu.

        FieldTypeRequiredDescription
        typeStringRequiredPersistent menu type
        • Only template is available among the 2 basic components for the Template component
        titleStringOptionalPersistent menu name
        • Displayed on the chatbar
        dataObjectOptionalPersistent menu configuration information
        • cover is not used
        data.contentBackgroundImageStringConditionalBackground image URL displayed in the content table area
        • Displayed only if the image component exists in contentTable
        • Must be a URL of https format
        data.contentTableArrayConditionalcontentTable details
        • footTable is not used

        contentTable

        The following describes data.contentTable.

        FieldTypeRequiredDescription
        rowSpanIntegerRequiredNumber of rows occupied by cells in the table (span)
        colSpanIntegerRequiredNumber of columns occupied by cells in the table (span)
        dataObjectOptionalComponent configuration information
        data.typeStringConditionalComponent type
        data.titleStringConditionalComponent name
        data.subTitleStringConditionalSubcomponent name
        data.dataObjectConditionalSubcomponent configuration information
        data.data.typeStringConditionalSubcomponent type
        data.data.actionObjectConditionalComponent action information
        data.data.action.typeStringConditionalComponent action type
        data.data.action.dataObjectConditionalComponent action details

        Persistent Menu response example

        The following is a sample response of Persistent Menu.

        {
            "type": "template",
            "title": "persistentMenu",
            "data": {
                "contentBackgroundImage": "url",
                "contentTable": []
            }
        }
        JSON

        The Carousel component consists of a carousel of answers that repeat the same format.

        The following is the response body of the Carousel component.

        FieldTypeRequiredDescription
        typeStringRequiredComponent type
        • Only carousel is available among the 2 basic components for the Carousel component
        titleStringOptionalComponent title
        • Short bold text
        subTitleStringOptionalSubcomponent title
        • Short gray text
        dataObjectOptionalCarousel component configuration information
        data.cardsArrayOptionalInformation about the cards that make up the carousel

        The following is a sample response of the Carousel component.

        {
            "type": "carousel",
            "title": "optional, short bold text",
            "subTitle": "optional, short gray text",
            "data" :
            {
                "cards": [{}]
            }
        }
        JSON

        Was this article helpful?

        Changing your password will log you out immediately. Use the new password to log back in.
        First name must have atleast 2 characters. Numbers and special characters are not allowed.
        Last name must have atleast 1 characters. Numbers and special characters are not allowed.
        Enter a valid email
        Enter a valid password
        Your profile has been successfully updated.