Verse Block

Go back to the list of Blocks

The Verse block is ideal for writing poetry on your site.

To add a Verse block, click on the “Block Inserter” (+)  and select the Verse block.

You can also type “/verse” and hit enter in a new paragraph block to add one quickly.

How to add the verse block using the shortcut

Detailed instructions on adding blocks can be found here.

Block Toolbar

Every block comes with unique toolbar icons and block-specific user controls that allow you to manipulate the block right in the editor.

The Verse block block shows nine buttons in the block toolbar:

  • Transform to
  • Drag icon
  • Move arrows
  • Change text alignment
  • Bold
  • Italic
  • Hyperlink
  • More Rich Text controls
  • More options
Block toolbar for the Verse block

The layout of the Verse block on your site may vary according to the styles set by the theme you are using.

Transform to:

Transform options for Verse Block

Click on the “Transform” button to convert the Verse block into a “Paragraph”, “Columns” or “Group” blocks. “Group” gives you the ability to change the background color around the Verse block.

Grouping a Verse block and setting a background color
Grouping a Verse block and setting a background color

Drag icon:

Drag icon for the Verse block

To drag and drop the block to a new location on the page template, click and hold the rectangle of dots, then drag to the new location. The blue separator line indicates where the block will be placed. Release the left mouse button when you find the new location to place the block.

Move arrows:

Move arrows for the Verse block

The up and down arrow icons can be used to move the block up and down on the page.

Detailed instructions on moving a block within the editor can be found here.

Change text alignment:

Change text alignment for the Verse block
  • Align text left – Make the block left-aligned.
  • Align text center – Make the block alignment centered.
  • Align text right – Make the block right aligned.

Bold

Bold typeface for the Verse block

You can select the text of the block and use the “Bold” option or “Ctrl+B” / “Cmd+B” on your keyboard to bold it, which is usually heavier than the surrounding text.

Italic

Italic typeface for the Verse block

You can select the text of the block and use the “Italic” option or “Ctrl+I” / “Cmd+I” on your keyboard to italicize it, which usually appears slanted to the right.

Hyperlink

Adding a link to the Verse block

You can select the text of the block and use the “Hyperlink” option or “Ctrl+K” / “Cmd+K” on your keyboard to add a link to it.

More Rich Text controls

Highlight

Use the Highlight option to change the color for selected text and its background.

More Rich Text controls options in the Verse block

Inline code

Use the Inline code feature to format code snippets within your text differently. Not only that, but Inline code formatting also prevents the code to be executed instead of displayed.

Inline image

The Inline image feature allows you to add an image to your paragraph. It has one option: enter the desired pixel width for your image.

Keyboard Input

The Keyboard Input option allows you to add the <kbd> tag to selected text.

Strikethrough

Use the Strikethrough option to place a horizontal line through the middle of the selected text.

Example: Verse Block

Subscript

Use the Subscript option to set the selected text slightly below the normal line of type.

Example: Verse Block

Superscript

Use the Superscript option to set the selected text slightly above the normal line of type.

Example: Verse Block

More options:

More options in the Verse block

Hide Block Settings

The “Hide Block Settings” option hides (or shows) the Block Setting panel in the editor’s sidebar.

Copy

“Copy” can be used to copy a selected block and then you can paste it wherever you want in the editor.

Duplicate

“Duplicate” can be used to duplicate the selected block.

Insert before

Insert a new block before the selected block(s).

Insert after

Insert a new block after the selected block(s).

Move to

On selecting the “Move To” option, you will get a blue separator line inside your content, you can then use the arrows to move that line up and down to where you want the selected content to be moved to. Press return/enter on your keyboard to move the block to that position.

Details on using the “Move to” option can be found here.

Edit as HTML

The “Edit as HTML” option allows you to modify the HTML code of the embed block.

Edit as HTML in the Verse block

Lock

Since WordPress 6.0, you can lock the block to disallow moving and/or removing. If you lock the block, “Lock” icon will be shown at the Block Toolbar.

Locking the Verse block

For more details about Lock, refer More Options.

Add to Reusable blocks

Use the “Add to Reusable blocks” option to add the selected block to a list of reusable blocks, so you can use them on other posts or pages as well.

Group

Select the “Group” option if you want to group the blocks and treat them as a unit. You can, for instance add a common background color to the group.

Remove Verse

Click the “Remove Verse” option to delete the selected block from your content.

Top ↑

Block Settings

Every block has specific options in the editor sidebar in addition to the options found in the block toolbar. If you do not see the sidebar, simply click the ‘cog’ icon.

Block settings in the Verse block

Color settings:

You can customize the text color, and background color, for the Verse block. The color options available will vary based on the theme.

Color settings in the Verse block
Color settings in the Verse block

Typography settings:

On this tab, you can adjust the Font size, Appearance, Font family, Line height. Letter case and Letter spacing. 

To access all the typography options click on the + button in the right corner of the Typography tab.

Typography settings in the Verse block
Typography settings in the Verse block

To change the font size, you can select the numbers 1 (for small), 2 (for medium), 3 (for large) or 4 (for extra large). 

Font size setting in the Verse block
Font size setting in the Verse block

Click on the slider icon to the right of Size to add custom font size in the text field.

Custom font size setting in the Verseblock
Custom font size setting in the Verse block

Clicking on PX will open a drop-down with options for other font units -PX, Em, and Rem. 

Changing the font size unit in the Verse block
Changing the font size unit in the Verse block

Click on the Font family drop-down to change the font for the Verse block. The values in the drop-down will vary based on the theme.

Font family setting in the Verse block
Font family setting in the Verse block

Click on the Appearance drop-down to change the font weight for the Verse block. The values in the drop-down will vary based on the theme.

Appearance setting in the Verse block
Appearance setting in the Verse block

You can increase or decrease the value for the line height by clicking on the up or down arrow handles in the Line height text field or by typing in your custom value inside the text field.

Line height setting in the Verse block
Line height setting in the Verse block

You can change the Letter case from uppercase (all letters are in uppercase), lowercase (all letters are in lowercase) or capitalize (where the first letter of each word is uppercase).

Letter case setting in the Verse block
Letter case setting in the Verse block

You can adjust the Letter-spacing by typing in a custom value in the Letter-spacing text field. Clicking on PX will open a drop-down with options for other units -PX, %, EM, REM, VW, VH. 

Letter spacing setting in the Verse block
Letter spacing setting in the Verse block

You also have the option to Reset all the typography changes you made by clicking on the Reset all option in the dropdown.

Reset all typography changes
Reset all typography changes

Dimensions settings:

Click on the ‘+” icon to the right of Dimensions to explore the Dimensions Settings for the block.

Dimension settings in the Verse block
Dimension settings in the Verse block

The Padding setting affects the space between the block’s content and its border. You can type in a custom value in the text field if you want the same spacing for the padding.

Padding setting for the Verse block
Padding setting for the Verse block

You can change the unit for Padding by clicking on PX to display a dropdown with the other supported units- %, EM, REM, VW, and VH.

Changing the padding's unit for the Verse Block
Changing the padding’s unit for the Verse Block

Click the Link icon to the right, to set different spacing values for top, right, bottom and left.

Link icon
Link icon

You can type in a custom value in any of the four text fields. You can also change the unit for padding by clicking on PX to display a dropdown with the other supported units- %, EM, REM, VW, and VH.

Padding setting for the Verse block
Padding setting for the Verse block

Click on the Link icon once again if you want to have the same value for padding.

You also have the option to revert all the Dimension changes you made, by clicking on the Reset all option from the dropdown. 

Reset all Dimension settings
Reset all Dimension settings

Advanced

The “Advanced” tab lets you add HTML anchor and CSS class(es) to your block.

Advanced setting in the Verse block

“HTML anchor” allows you to make a unique web address for a particular “Verse” block. Then, you’ll be able to link directly to a “Verse” block of your page.

The “Additional CSS class(es)” lets you add CSS class(es) to your block, allowing you to write custom CSS and style the block as you see fit.

Top ↑

Changelog

  • Updated 2022-06-02
    • Updated the content for 6.0.
    • Added ALT tags for images.
  • Updated 2022-06-02
    • Screenshots as per WordPress 6.0
  • Updated 2022-02-04
    • Screenshots and video as per WordPress 5.9
    • Minor option updates
  • Updated 2020-09-29
    • Screenshots and video as per WordPress 5.5
    • Added feature changes in Block Toolbar
    • Added feature changes in Block Settings
    • Added “Go back to the list of Blocks” to the top of the page
  • Created 2019-03-07

Was this article helpful? How could it be improved?