比較バージョン

キー

  • この行は追加されました。
  • この行は削除されました。
  • 書式設定が変更されました。

...

4.  ご利用するFlexメッセージテンプレートの文面をテキストエリアに貼り付け、
  「①タイトル文をここに入れてください」などの変更部分を修正します。 

▼サンプルテンプレート一覧

展開
titleシンプル文 テンプレート

各種ご案内などにご利用いただける「タイトル + 本文」のシンプルなFlexメッセージです

コード ブロック
titleシンプル文 テンプレート本文
{
  "type": "bubble",
  "body": {
    "type": "box",
    "layout": "vertical",
    "contents": [
      {
        "type": "text",
        "weight": "bold",
        "color": "#ff4500",
        "size": "md",
        "text": "①タイトル文をここに入れてください",
        "wrap": true
      },
      {
        "type": "separator",
        "margin": "xxl"
      },
      {
        "type": "box",
        "layout": "vertical",
        "margin": "xxl",
        "spacing": "sm",
        "contents": [
          {
            "type": "box",
            "layout": "horizontal",
            "contents": [
              {
                "type": "text",
                "text": "②本文をここに入れてください",
                "size": "sm",
                "color": "#555555",
                "flex": 0,
                "wrap": true,
                "weight": "bold"
              }
            ]
          }
        ]
      }
    ]
  },
  "styles": {
    "footer": {
      "separator": true
    }
  }
}



展開
titleカルーセル テンプレート

複数のFlexメッセージを横に並べて表示できる形式のメッセージです。

コード ブロック
titleカルーセルテンプレート本文
{
  "type": "carousel",
  "contents": [
      ①並べたいテンプレートのテキストをここに入れます。入れたらカンマを付けてください,
      ②並べたいテンプレートのテキストをここに入れます。入れたらカンマを付けてください,
      ③並べたいテンプレートのテキストをここに入れます。最後はカンマは不要です。
  ]
}



展開
title商品説明 テンプレート

商品紹介などにご利用いただける「画像 + 複数メッセージ欄 + ボタン」のFlexメッセージです

コード ブロック
title商品紹介 テンプレート本文
{
  "type": "bubble",
  "hero": {
    "type": "image",
    "url": "①ここに画像のURLを記載してください ※URLはhttpsである必要があります",
    "size": "full",
    "aspectRatio": "20:20",
    "aspectMode": "cover"
  },
  "body": {
    "type": "box",
    "layout": "vertical",
    "contents": [
      {
        "type": "text",
        "text": "②ここに商品名などのメインのテキストを記載してください",
        "weight": "bold",
        "size": "xl",
        "wrap": true
      },
      {
        "type": "box",
        "layout": "vertical",
        "margin": "lg",
        "spacing": "sm",
        "contents": [
          {
            "type": "box",
            "layout": "baseline",
            "spacing": "sm",
            "contents": [
              {
                "type": "text",
                "color": "#008080",
                "size": "lg",
                "flex": 1,
                "wrap": true,
                "text": "③ここに価格などのサブのテキストを記載してください"
              }
            ]
          },
          {
            "type": "box",
            "layout": "baseline",
            "spacing": "sm",
            "contents": [
              {
                "type": "text",
                "wrap": true,
                "text": "④ここに商品の詳細などのテキストを記載してください",
                "color": "#696969",
                "size": "sm",
                "flex": 1
              }
            ]
          }
        ]
      }
    ]
  },
  "footer": {
    "type": "box",
    "layout": "vertical",
    "spacing": "sm",
    "contents": [
      {
        "type": "button",
        "style": "link",
        "height": "sm",
        "action": {
          "type": "uri",
          "label": "⑤ここに商品ページへ遷移するボタンのラベルを記載してください",
          "uri": "⑥ここに商品ページのURLを記載してください"
        }
      },
      {
        "type": "spacer",
        "size": "sm"
      }
    ],
    "flex": 0
  }
}



...