A Flex Message is a message format that lets you freely build the layout with JSON. You can place text, images, buttons, and other elements with fine-grained control, but creating one requires writing JSON.
If you want to build an elaborately designed message without code, a Card Type Message or Rich Message is more convenient. Just tell Lumo's Marketing Agent your goal, and it can handle everything from choosing the right message format for your purpose to drafting the content. Use the steps in this article when you want to control the layout of a Flex Message yourself in detail.
What you can do with a Flex Message
A Flex Message lets you display a uniquely designed message in a single message by specifying the size, placement, and color of each element in detail.
It is well suited to layouts that fixed templates cannot fully express, such as product introduction cards, reservation confirmations, receipts, and coupons. You can also create a layout that places multiple cards side by side so recipients can swipe through them.
| Example use case | Why it fits |
|---|---|
| Product introduction card | You can arrange the image, price, and button together on a single card |
| Reservation or order confirmation | You can align items vertically and present them like a line-by-line statement |
| Coupon or benefit announcement | You can freely adjust the size and color of the information you want to emphasize |
Letting the Marketing Agent handle it
When you are unsure about the content or format of a message, the quickest path is to consult the Marketing Agent first.
When you tell it a goal such as "I want to create an introduction message for a new product," the agent chooses the format that fits your purpose and prepares a draft. Because it also advises on whether you even need a high-flexibility format like a Flex Message, you can settle on a direction before writing any JSON yourself.
You can review the content created by the agent on the approval screen before broadcasting. If everything looks good, select "Approve"; if you want to revise it, select "Cancel".
Creating a Flex Message yourself
You create a Flex Message directly for each broadcast on the Message Broadcast creation screen. It is not managed as a reusable saved item.
- Open the creation or edit screen for a Message Broadcast
- Select "Flex Message" from the message types
- Paste the message JSON into the "Flex JSON" input field
- Enter the "Alternative text" (this appears in push notifications and the chat list)
- Check the display in the preview
Write the JSON using a Bubble (a single card) or a Carousel (multiple cards side by side) structure. It is efficient to build the layout in a simulator provided by LINE and then paste the generated JSON into the input field.
The basic JSON structure
A Flex Message's JSON is built around a Bubble (a single card) or a Carousel (a collection of multiple cards) as its basic unit.
A single Bubble is made by combining the following areas. You do not need to use every area; specify only the ones you need.
| Area | Role |
|---|---|
| header | The heading area shown at the top of the card |
| hero | The area that displays the main image |
| body | The main content area for text, buttons, and so on |
| footer | The footer area shown at the bottom of the card |
When you group multiple Bubbles into a Carousel, recipients can swipe sideways to browse the cards.
Checking the preview
When you enter the JSON, you can edit while checking how it will look on LINE in the preview.
Before broadcasting, use the preview to confirm that the image placement, text wrapping, and button arrangement are as intended. Because it is displayed in a form close to the actual LINE chat screen, you can catch layout issues before sending.
When things don't work
Because a Flex Message depends on how the JSON is written, most problems come down to the format of the JSON.
| Symptom | What to check |
|---|---|
| A JSON format error is displayed | Check that brackets and commas are correctly matched. The editor shows where the error is |
| The preview does not appear | Check that required fields (such as type and altText) are set correctly |
| The display is broken on LINE | Check that the image sizes and character counts stay within the Flex Message specification limits |
If building the JSON yourself is difficult, consider switching to a Card Type Message or Rich Message. These let you create rich layouts without code.