予約（Flex Message）

予約 テンプレート では、Flex Message モードについて説明します。

Flex Message モード

Flex Message モードを開くと、バブルメッセージがない状態です。
バブルメッセージ の ✚ ボタンを押します。

押すとモーダルが表示され、 Flex Message のテンプレートが表示されます。
今回はハンバーグのテンプレートを選択し、作成します。

作成すると画面に、 Flex Message が追加されました。
階層からテンプレートを変更できます。本文のテキストを「4geru Burger」に変更してみました。
他にもヒーローの画像や、フッターのボタンの色、本文の中にテキストやアイコンを追加したり、拡張できます。

次にカルーセルメッセージで、複数の Flex Message を表示してみます。
カルーセルメッセージ の ✚ ボタンを押します。

先程作成したハンバーグの バブルメッセージ を追加します。1つだけでは複数追加できるのは、楽しいですね。
異なる バブルメッセージ も追加できるので、試してみてください。

トークモード

Flex Message も他のメッセージと同じようにトークモードから動作確認できます。

Flex Message の JSON は長くなるので、自分が開発する際は個別の関数にして管理します。
そうすることで、可読性の高い開発をすることができますね。

const BurgerCarouselMessage = () => {
  return {
    "type": "carousel",
    "contents": [
      ...
    ]
  }
}