Code block

Code blocks are blocks of text you can add to your assets. Brightspot formats code blocks according to the type of code you select. Code blocks can either be created as inline enhancements to only be used in a single asset, or they can be created as a shared enhancement to be used across many assets. 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.

Creating code blocks

To create a code block:

1. In the header, click . By default, when you select to create a code block from this menu, you are creating a shared code block.
2. From the Create list, select Code Block.
3. Using the following table as a reference, complete the fields as needed.
4. Complete your site's workflow and publish the asset.

Main

Field	Description
Internal Name	Enter an internal name for this asset. Brightspot uses this name internally, such as in the search panel and recent activity widget. This name is not visible to visitors to your site.
Title	Enter a title. This title is not visible to the visitors to your site.
Code Type	Select the type of code block you are entering from the list of available programming languages.
Code	Enter the code as you would like it to display.
Annotations	You can add annotations to your code block to provide further clarity for your visitors. 1. Click . 2. Expand the Line Number field and select the line of code to which you want to associate an annotation. 3. Enter the annotation in the Annotation field. Annotations have the selected line highlighted in the code block, with the annotation appearing below the code block.

Note

On your site, code blocks have a Copy button to allow your visitors to copy the code in the code block and reuse it.

Embedding code blocks

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.

To embed a code block:

1. From the rich-text editor's toolbar, select > Code Block.
2. Using the following table as a reference, complete the fields as needed.
3. Click Save & Close.

Field	Description
Code Block	Select Inline or Shared. See Inline vs. shared enhancements.
Title	Enter a title.
Code Type	Select the language of the code.
Code	Enter the code.
Annotations	Click Add Annotation, then select the line number and enter the annotation message.

Code Block Enhancement Styles

Field	Description
Preset	Select a style preset for this enhancement.
Choose Enhancement Alignment	Select an alignment for this list.
Collapsible State	Choose whether the code block is expanded by default (Expanded), collapsed by default (Collapsed), or turn off collapsible functionality (Disabled).
Hide Line Numbers	Toggle on to hide line numbers for readers. If your code block includes annotations, this setting is ignored and line numbers are rendered.
Vertically Scrollable	Toggle on to make the code block vertically scrollable after the specified number of lines.
Number of Lines Visible	The number of lines visible before the reader must scroll in the code block.