Events
Events renders a table of the events an API can emit, such as webhook events, each with a name, a description, and an optional example payload. It’s a good fit for documenting webhooks or any other event-driven part of an API, separate from the request/response endpoints themselves.
Adding the block#
- In the block editor, open the block inserter and search for Events.
- Add it to the page, usually on a dedicated webhooks or events reference page.
- Give the table a title, e.g.
Webhook Events. - Click + Add event for each event you want to document.
Settings#
| Setting | What it does |
|---|---|
| Table title | Heading shown above the table, e.g. Webhook Events. |
Per row:
| Setting | What it does |
|---|---|
| Event name | e.g. customer.created. |
| Description | What triggers the event and what it means. |
| Example payload (optional) | A sample payload sent for this event. |
Example#
One row: Event name customer.created, Description Sent when a new customer is created.
| Event | Description |
|---|---|
customer.created
🔗
|
Occurs whenever a new customer is created. Example payload
|
The block#
In the editor, this is one event row filled in as above, no shortcode needed.
The shortcode#
The same block, added as a shortcode instead, for a widget, classic-editor content, or a page builder that only accepts shortcodes. Since events is a JSON array, it can never go in a quoted attribute (a JSON array always contains a ], and the shortcode parser stops at the first literal ] it finds, quoted or not). It goes between the opening and closing tags instead:
[nahnu_code_block block="events" title="Webhook Events"]
[{"name":"customer.created","description":"Sent when a new customer is created."}]
[/nahnu_code_block]
Putting the JSON between the tags, rather than in a quoted attribute, is what keeps the shortcode from cutting off partway through.
How it renders#
A table titled “Webhook Events” with one row: customer.created and the description text.
Tips#
- Use a consistent naming pattern across events, like
resource.action(customer.created,customer.updated,customer.deleted), so the table reads as a set rather than a loose list. - Include an example payload wherever the event’s data shape isn’t obvious from its name and description alone.
- Group related events next to each other in the table, in the order a reader is likely to look them up.