Sidebars

On this page, you’ll learn:

  • How to mark up a sidebar with AsciiDoc.

A sidebar can contain any type of content such as quotes, equations, and images. Normal substitutions are applied to sidebar content.

If the sidebar content is contiguous, the block name sidebar can be placed directly on top of the text in an attribute list ([]).

Example 1. Sidebar paragraph syntax
[sidebar]
Sidebars are used to visually separate auxiliary bits of content
that supplement the main text.

The result of Example 1 is displayed below.

Sidebars are used to visually separate auxiliary bits of content that supplement the main text.

Delimited sidebar block

A sidebar block is delimited by a set of four consecutive asterisks (****). You don’t need to set the block name when you use a delimited block.

Example 2. Delimited sidebar block syntax
.Optional Title
****
Sidebars are used to visually separate auxiliary bits of content
that supplement the main text.

TIP: They can contain any type of content.

.Source code block in a sidebar
[,js]
----
const { expect, expectCalledWith, heredoc } = require('../../../test/test-utils')
----
****

The result of Example 2 is displayed below.

Optional Title

Sidebars are used to visually separate auxiliary bits of content that supplement the main text.

They can contain any type of content.
Example 3. Source code block in a sidebar
const { expect, expectCalledWith, heredoc } = require('../../../test/test-utils')