Paragraph Block

3 次阅读

Go to the List of Blocks

Theparagraph block allows you to easily craft content and is the default block type for text added to the editor. It is probably the block you will use most.

You can write your content like a regular document and each paragraph will automatically be turned into a block behind the scenes.

You can also choose the paragraph block from the “Block Inserter” (+) pop-up window when you click on the (+) sign.

Detailed instructions on adding blocks can be found here.

Block Toolbar

Each block has its own block-specific controls that allow you to manipulate the block right in the editor. The block-toolbar on top and the mover handle on the left side. If you hover over the buttons, tooltips will tell you what is behind the buttons, and also show you keyboard shortcuts when available.

Video: Tooltips on paragraph toolbar

Theparagraphblock toolbar offers the following options (from left to right).

Transform to:

When you click on the “Transformer” button you can convert the paragraph block into another block type, by using the existing content. You could make a Quote out of the paragraph or a Heading or an ordered or unordered list.

Align text left, center, right

Block toolbar with the drop-down for alignment.

Using the alignment drop-down from the toolbar, you are able to align the whole paragraph text to the left, make it center-aligned or orient it to the right.

Bold and Italics

Used quite frequently, Bold and Italics formatting have their own buttons on the Toolbar. The shortcuts are CTRL+b (or Command+B) for bold and CTRL+i (or Command+i) for italics.

Use the chain link icon to insert a hyperlink to your highlighted text. Or use the CTRL + k (or Command+k) keyboard shortcut.

The Search mentioned in the text box relates to a search on your own website. If you start typing a keyword if will offer you a list of post and page titles from your own website for on-site link building.

Open in new tab

The toggle switch allows you to control where the new page should open:

  • off in the same browser tab
  • on in a new browser tab

By default, the switch is set to off, as your site visitors should control how she wants to read your linked page.

Tip:If you already have the URL of the website you want to link to in the clipboard, highlight the text, you want to make into a link and use CTRL + V to add the hyperlink to the text.

More Rich Text Controls

Block toolbar with the drop-down for More Rich Text Controls

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.

Strikethrough

Using the “Strikethrough” option adds a line through your highlighted text.

Text Color

Using the colors from the inline Text Color tool allows you to change the color for highlighted text.

Subscript

The “Subscript” option allows you to add subscript to your highlighted text.

Superscript

The “Superscript” option allows you to add superscript to your highlighted text.

More Options:

Hide Block Settings

TheHide Block Settings option hides (or shows)the Block Setting panel in the editor’s Sidebar

Duplicate block

Using the “Duplicate Block” option, you can create a copy of the selected block.

Insert Before

“Insert before” lets you add the previously duplicated block before the selected block

Insert After

“Insert After” lets you add the previously duplicated block after the selected block

Edit as HTML

When you select the Edit as HTML option, you will be able to add more HTML code to this particular paragraph, for instance, to add inline CSS or specific <span/>tags.

Add to Reusable Blocks

Using the Add to Reusable Blocks option lets you 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 create a group of blocks and treat them as a unit. You can for instance add a common background color or other blocks to the group.

Remove Block

With the “Remove Block” option you can delete the selected block from your content.

区块设置

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 next to the Publish button.

The block settings can be found in the sidebar.

As you can see, the paragraph block offers text settings, color settings, and advanced options.

Text Settings

The Text Settings allow you to change the paragraph’s font size, either with relative percentages or down to the pixel. These semantic options can be modified by your theme to help keep your styles looking consistent.

You can also add a drop cap to your paragraph.

Adding a dropcap letter to a paragraph block.

Color Settings

Text and background colors can be set on a per-block basis, allowing you to call attention to important content.

Via the “Custom Color” link you can further modify the color choice.

Either by selecting the hue in the big box or a different color from the slide below or by your preferred color number system: Hexadecimal, RGB, or HSL.

Accessibility criteria are built into the new editor to warn you when the text may become illegible for persons with reading impairments.

Advanced

The advanced tab lets you add a CSS class to your block, allowing you to write custom CSS and style the block as you see fit.

The advanced section lets you add a CSS class to your block.
The advanced section lets you add a CSS class to your block.

Changelog

  • Updated 2020-08-23
    • Added subscript and superscript options
    • Updated content to WP 5.5
    • Updated images to WP 5.5
    • Convert existing blocks to media & text blocks
  • Updated 2020-04-20
    • Added updated color settings screen
    • Added video on how to change color in the Custom Color window.
    • changed date in Changelog from mm/dd/yyyy to yyyy-mm-dd
    • Added new Category: Common Blocks
    • Category Hierarchy: Block Editor > Core Blocks > Common Blocks
  • Updated 2020-04-18
    • Added “More Options” 3-dot menu section and explanations of the options.
    • Added explanations and illustrations to the various toolbar rich content options.
    • Added screenshots of toolbar drop downs
    • Replaced previous block tool bar images with LitePress 5.4 views
    • Added video for tool tips on paragraph toolbar
    • converted reusable block to Regular block
    • Added the Changelog
  • created 2019-03-07