Basics
Features
Best Practices
Addon Development
Related Docs
Dark Mode

#Help

You can provide integrated documentation to help users use your Addon. This is similar to and works alongside Component Help Pages. Refer to that documentation for information about what Markdown features are supported.

It is very important to provide complete documentation that describes the correct way to use your Addon. Any amazing features you give your Addon that no one knows about may as well not exist.

// use axios
await axios.put(`http://localhost:${cmsPort}/api/addon/:addonId/state/help`, {
  help: [
    {name: 'My Addon', path: '/', body: '# My Addon\n\nThis is the main Help Page that describes My Addon.'},
    {name: 'Some Page', path: '/some-page', body: '# Some Page\n\nThis is another Help Page.'},
  ]
})

// use static-cms-addon
import cms from 'static-cms-addon'

await cms.setHelp([
  {name: 'My Addon', path: '/', body: '# My Addon\n\nThis is the main Help Page that describes My Addon.'},
  {name: 'Some Page', path: '/some-page', body: '# Some Page\n\nThis is another Help Page.'},
])

#Help Properties

Each item in help describes a Help Page. These Help Pages will be accessible at /addons/<your-addon-name>/help/<page-path>. Each Help Page is also accessible directly via a dropdown.

KeyDescription
nameThe Help Page's name
pathThe Help Page's path. For example: "/"
bodyMarkdown for the Help Page's body

#Help Files

It's cumbersome to include long Help Page body values in the code. Instead, you can store your Markdown in .md files within your Addon's package and load them.

// use axios
await axios.put(`http://localhost:${cmsPort}/api/addon/:addonId/state/help`, {
  help: [
    {name: 'My Addon', path: '/', body: fs.readFileSync('help/Index.md').toString()},
    {name: 'Some Page', path: '/some-page', body: fs.readFileSync('help/Some Page.md').toString()},
  ]
})

// use static-cms-addon
await cms.setHelp([
  {name: 'My Addon', path: '/', body: fs.readFileSync('help/Index.md').toString()},
  {name: 'Some Page', path: '/some-page', body: fs.readFileSync('help/Some Page.md').toString()},
])

For your convenience, you can also use the special bodyFile option when using static-cms-addon which will automatically load the file for you:

await cms.setHelp([
  {name: 'My Addon', path: '/', bodyFile: 'help/Index.md'},
  {name: 'Some Page', path: '/some-page', bodyFile: 'help/Some Page.md'},
])

#Help Page Linking

You can link to other Addon Help Pages and Component Help Pages (including to other Addon's Help Pages and Component Help Pages). To do this, use regular Markdown links, but start the link with component: or addon:.

DescriptionExample
A link to your Addon's main Help Page[Click Me](addon:/)
A link to /some-page within your Addon's Help Pages[Click Me](addon:/some-page)
A link to an Addon named weather's main Help Page[Click Me](addon:weather/)
A link to /this-week within the weather Addon[Click Me](addon:weather/this-week)
A link to a Component named "My Component"[Click Me](component:my-component/)
A link to My Component's /quick-start Help Page[Click Me](component:my-component/quick-start)

You can also link to offical documentation (these docs) by using the prefix help:. For example, help:/features/templating.