Custom blocks

Expand your options for documentation using custom content blocks.

Plan: Company +

Developers can define custom documentation blocks inside the exporter. These custom blocks take an input (or custom property), and are rendered in the documentation as is determined by the exporter. This allows endless opportunities for customization of your design system documentation.

 

You can define the following custom properties in a custom block:

  • Image
  • String
  • Number
  • Enum
  • Component
  • Component properties
  • Token type
  • Token properties
  • Boolean (True/False)

Using custom blocks

After an exporter is installed containing custom blocks, these custom blocks will show in the list when inserting a new block.

  1. Open the blocks list (click + or type / )
  2. Select the custom block from the list to add it
  3. Enter the block specific value(s)
  4. Publish to see the result

 

Example of a custom block

Example of a custom block


Defining block properties

Set the properties for the custom block:

  1. In your documentation editor, click the Settings icon
  2. Select the Blocks section
  3. Make changes to desired properties, and click Update
  4. Publish the documentation to see the new property values applied

Changing exporters when using custom blocks

If you are using custom blocks in your documentation and you switch to an exporter that doesn't have matching definitions for them, the block will be ignored. Otherwise, if there is a matching block definition, the the block will continue to be rendered by the new exporter.