Applying CSS classes in Content Blocks

You can customize and style a block of text in a Content Block by applying a CSS class from the Editor toolbar. Applying CSS classes to content blocks makes it easier to use them for disclaimers, special notes, and other call-outs that visually pop out from other content.

To apply CSS to a block of text in a content block

1. In Guide, click the Manage articles icon () in the sidebar.
2. In All articles, open the article you want to add a Content Block to or edit a Content Block for.
3. Next, create a Content Block or edit a Content Block.
4. Select the text in the Content Block that you want to style and click the CSS icon or use the shortcut CTRL + . or CMD + .

   The system detects the element that you want to apply the class to and wraps it in a <div>.

5. In the Apply CSS class dialog, type the name of the class/es that you want to apply.

   If you want to use multiple classes, separate them with a <space>.

   

6. Click Apply CSS class, Create or Update all articles.
7. Preview or publish the article.

   After you have applied a CSS class to text, it is visible as a CSS styled block in the article editor. If you click in the CSS class block, you can edit or remove the applied CSS class and change the text within that block.

   

The following shortcuts are also helpful to know:

• To add another line - ENTER
• To get out of the block - SHIFT + ENTER
• To get out of the CSS block - Click Cancel

To apply custom classes, you must have defined them already in the theme that you are using.

Note: You cannot apply a class to a single word or a sentence in a larger paragraph. However, you can apply a class to a standalone piece of text, a code block, a quote block, or a list.