Playground · simulation

Compose it. See it rendered.

Change the body, buttons, cards, and rich blocks. The preview updates instantly, complete with the same button reveal animation you get in WhatsApp. Nothing is actually sent.

Open documentation

ButtonCarouselAIRichCode + payloadNo WhatsApp connection

Message

Header / title Body Footer

Image header

Buttons (3)

list mode

This button uses the sections and rows below. Edit them in the “List structure” panel.

List structure

9:41

TODAY

Nusantara Cafe menu

Pick an option below. We are open every day from 8:00 AM to 10:00 PM.

MessageBuilder v4.8

09:41

Simulation · nothing is sent

Buttons are tappable. Lists open as a bottom sheet. No data is sent to WhatsApp.

import { Button } from "./lib/MessageBuilder.js";

const button = new Button(sock)
  .setTitle("Nusantara Cafe menu")
  .setBody("Pick an option below. We are open every day from 8:00 AM to 10:00 PM.")
  .setFooter("MessageBuilder v4.8")
  .addReply("Browse catalog", "catalog")
  .addUrl("Open website", "https://example.com", true)
  .addSelection("View menu")
  .makeSection("Food")
  .makeRow("", "Village-style fried rice", "$8", "fried-rice")
  .makeRow("", "Chicken noodles with meatballs", "$7", "chicken-noodles")
  .makeSection("Drinks")
  .makeRow("", "Iced palm sugar latte", "$6", "iced-latte");

await button.send(jid);