Content Formatting

Enhance your content presentation with a few nice extra content formatting features: numbered headings, styled lists, badges, drop-caps, and content blocks.

How to Use

The additional content formatting features are seamlessly integrated in the WordPress editor.

Do the following to apply them:

1. Navigate to your post edit screen and click the Toolbar Toggle icon in the toolbar. It will expand the toolbar.
2. In the second row click on the Formats button and then apply one of the content formatting options.

See this screenshot for details:

To cancel formatting, select the same option again.

Drop-Caps

In a written or published work, an initial or drop cap is a letter at the beginning of a word, a chapter, or a paragraph that is larger than the rest of the text.

There’re a few Drop-Cap styles in the dropdown menu.

Call-Outs

Call-Outs are used to highlight important and eye-catching text in your post content.

Enabling this style will make the text larger. You may also combine Call-Outs with the Block styles.

Blocks

The Block styles enable highlighting a part of your page or post content by placing it in a container with specific styles.

There’re a few options: borders, shadow, alignment or background of a block.

Numbered Headings

To place numbers inside your headings, simply click on the Formats button and select Numbered Headings, then select the heading level.

In the new block editor simply add the pk-heading-numbered class to the Additional CSS Class field in the Advanced tab.

Styled Lists

You may add green check marks to your lists by applying the Positive List format, red cross marks by applying the Negative List format or neutral styles by applying the Styled List format.

These format options can be applied to lists only. If you select a different element in the WordPress editor, the options will be grayed-out. Make sure you create a normal list first and only then apply the format.

Badges

Badges are small labels that can be added anywhere in the text. To add a badge, wrap your text in a span element with two classes. See the example:

<span class="pk-badge pk-badge-primary">Hot</span>

There’re the following available variants: pk-badge-primary, pk-badge-secondary, pk-badge-success, pk-badge-danger, pk-badge-warning, pk-badge-info, pk-badge-dark, pk-badge-light.

WordPress 5.x.x Compatibility

Currently this feature is supported within the Classic block only. To add this feature in the newer WordPress block editor first insert a Classic block: