Span

    This component renders multiple text strings with different designs in one row.

    You can specify the color, size, weight, and decoration for the font. Span is set to contents property in Text.

    Span, as in Text component, can also be written in multiple languages, and they will be displayed in the language that matches the client device's language settings.

    For more information, refer to multi language parameters in Send Messages (Text).

    API Type

    Server API

    Request URL

    https://apis.worksmobile.com/r/{API ID}/message/v1/bot/{botNo}/message/push

    HTTP Method

    POST(Content-Type: application/json; charset=UTF-8)

    Request

    Parameter Type Required Description
    type string Y Set this parameter to span.
    text string Y Text.
    If the wrap property of the parent text is set to true, you can use a new line character (\n) to begin on a new line.
    color string N Font color. Use a hexadecimal color code.
    size string N Font size. You can specify one of the following values: xxs, xs, sm, md, lg, xl, xxl, 3xl, 4xl, or 5xl.
    The size increases in the order of listing.

    The default value is md.
    weight string N Font weight. You can specify one of the following values: regular or bold.
    Specifying bold makes the font bold.

    The default value is regular.
    style string N Style of the text. Specify one of the following values:

    normal : Normal
    italic : Italic

    The default value is normal.
    decoration string N Decoration of the text. Specify one of the following values:

    none : No decoration
    underline : Underline
    line-through : Strikethrough

    The default value is none.

    ※ The decoration set in the decoration property of the text cannot be overwritten by the decoration property of the span.

    Request Example

    
    {
      "type": "bubble",
      "body": {
        "type": "box",
        "layout": "horizontal",
        "contents": [
          {
            "type": "text",
            "contents": [
              {
                "type": "span",
                "text": "Hello, world!",
                "decoration": "line-through",
                "size": "xl"
              },
              {
                "type": "span",
                "text": "\nThe work site ",
                "color": "#ff0000",
                "size": "sm",
                "weight": "bold"
              },
              {
                "type": "span",
                "text": "begins to",
                "size": "md",
                "color": "#00ff00",
                "decoration": "underline",
                "weight": "bold"
              },
              {
                "type": "span",
                "text": " move",
                "color": "#0000ff",
                "weight": "bold",
                "size": "lg"
              }
            ],
            "align": "center",
            "wrap": true
          }
        ]
      }
    }