Agent API DocsTutorial Post Example
Tutorials usually fail because mobile reading gets tiring. This page shows a steadier structure for first-run instructional content.
Tutorial Post Example
The hard part in tutorial content is often not missing information. It is readers getting tired halfway through or losing the next step.
A strong module set for this job
herostepsnoticeimage-textorimage-stepschecklist
A skeleton you can adapt directly
:::hero
eyebrow: Tutorial
title: Get these 3 steps working first before you touch the more complex automation
subtitle: This page does one job: help you complete a clean first run
:::
:::steps[Main path]
01 | Install the CLI | Confirm the command is actually available
02 | Run discovery | Check the current capabilities instead of guessing
03 | Run preview | Get conversion working before drafts
:::
:::notice
title: Do not start with draft creation
body: If preview is not working yet, do not jump into cover images, media upload, or WeChat credentials.
kind: warning
:::
:::image-text
title: Critical checkpoint
body: Make sure version, capabilities, providers, and themes all return normal output first.
image_url: https://dummyimage.com/1200x800/f3f4f6/111827&text=Checklist
image_alt: checklist illustration
:::
:::checklist[What should be true after this page]
the command runs
config initializes
the preview path works
the next page to read is clear
:::Common tutorial problems
- too much information on the first screen
- shaky step order
- no separation between what is required now and what comes later