Complete the full workflow from artwork to a live menu while keeping design, validation, and publishing as separate gates.
What you need
You need a LINE Official Account, its Messaging API channel, a channel access token, and a compliant JPEG or PNG image. These are used to call the API for that channel.
- Finish artwork and button labels before mapping areas
- Never place a token in Git, screenshots, public documents, or chat
- Use an internal versioned name such as main-2026-08
Map tappable areas in pixel coordinates
Each area has x, y, width, and height, with 0,0 at the image's top-left corner. Visual mapping removes manual arithmetic, but areas still need boundary and gap checks.
A Rich Menu supports up to 20 areas. Use only what is necessary so targets remain comfortable to tap on mobile.
Match each action to the intended outcome
Action labels support accessibility and should describe the outcome instead of repeating a generic label such as “Click here”.
| Action | Best used for |
|---|---|
| URI | Open a website, LIFF app, or phone link |
| Message | Send user text into a bot flow |
| Postback | Send data to a webhook without a message event |
| Datetime picker | Choose a date, time, or appointment |
| Rich menu switch | Switch tabs through an alias |
| Clipboard | Copy a code or text on supported LINE versions |
Validate and publish in sequence
Do not skip validation; it separates JSON problems from image upload failures. After publishing, reopen the chat on a phone to see the actual menu.
- Validate the rich menu object
- Create the menu and receive a richMenuId
- Upload the image to api-data.line.me
- Test actions and tappable areas
- Set it as default or link it per user
A practical definition of done
The work is done when the image is compliant, JSON validates, every action works with its destination, overlaps are intentional, mobile testing passes, and rollback is documented—not merely when the API returns 200.
Official references
Confirm the latest official specification before using a workflow in a critical system.
Ready to map it on a canvas?
Drag, move, and resize action areas, then validate the JSON before publishing.
Open Studio →