Embedding a code block
You can embed blocks of code into the rich-text editor. The code block displays in a different font from the font for your body text and includes syntax highlighting. Code blocks also include a Copy button on the front end of your site to allow your visitors to copy your code samples for their own use.
To embed a code block:
-
Place your cursor within the text where you would like to place the code block.
-
Click and select Code Block from the available choices.
-
From the Code Block list, select Inline or Shared.
-
If you select Shared, click and locate the shared code block in the content picker. (For information about creating a shared code block, see Creating a code block .)
-
If you select Inline:
-
In the Title field, enter a title.
-
From the Code Type list, select one of the available syntax highlighters.
-
In the Code field, enter the code.
-
If you want to annotate lines of code, do the following:
- Under Annotations, click Add Annotation.
- From the Line Number list, select one of the available line numbers.
- In the Annotation field, enter text describing the selected line.
-
-
-
Expand Code Block Enhancement Styles, and from the Preset list, select one of the following:
-
None— aligns the module within the body text using your theme's settings.
-
Custom—Complete the following fields as needed:
-
Choose enhancement alignment—Select an alignment. See Enhancement alignment for more information on enhancement placement.
-
Collapsible—Select from the following options:
-
Expanded—Displays the code block in its expanded state (default). This option provides a Collapse control for readers to collapse the code block.
-
Collapsed—Displays the code block in its collapsed state. This option provides an Expand control for readers to expand the code block.
-
Disabled—Displays the code block in its expanded state. This option does not provide the option to collapse the code block.
All options provide a Copy button to allow readers to copy the contents of the code block onto their clipboard.
-
-
Hide Line Numbers—Toggle on to hide line numbers from your code block on the front end. If your code block has annotations, ignores this setting and renders the line numbers.
-
Vertically Scrollable—Toggle on to enable vertical scrolling if the code block is longer than the number of lines in the Number of Lines Visible field.
-
Number of Lines Visible—Enter the maximal number of visible lines above which vertical scrolling is available.
-
-
-
Click Save & Close.