Blockquote

Highlight significant parts of a post or a page with the Gutenberg Blockquote block. Maximize visibility using different quote styles.

How To Add The Blockquote Block

1. Open a page or a post and click on the plus icon to add a new block and look for the Blockquote or you can search for it if it doesn’t pop up quickly for you.

2. By default, you'll get the below design-

How To Configure The Blockquote Block

Under the ‘Content’ tab, you will find the Alignment & Quotation Mark settings.

General

Under the General tab, you'll see the option to set your Blockquote alignment. You can choose to keep it as left, center or right-aligned.

Quotation Mark

Hide or Display Quotation Mark of the block.

Choose an icon for a quotation mark from a number of options.

Size - Choose a size for the quote.

Quote Color - Select a color for the quote.

Horizontal Position: Increase or decrease the space to control quotation marks horizontally.

Vertical Position: Increase or decrease the space to control quotation marks vertically.

Opacity - Set the color opacity from here for the quotation mark of the block.

How To Style The Blockquote Block

Switch to the ‘Style’ tab to style all the elements of Blockquote. You can add and customize ‘Background’, 'Border', ‘Spacing’ & ‘Color & Typography’ as per your preference.

Background

You can select a background type for the block from here. The options available are:

1. Color

2. Gradient

3. Image

4. Video

Opacity: You can set opacity from here for the block background.

Border

Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it

Border Width - Set a width for the border from here.

Border Color - Set color to the border from here.

Border Radius - You can give border-radius to the box from here.

Box Shadow - You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

Spacing

The spacing tab offers options to customize the top, bottom, left, and right responsive padding options for the block and text.

Color Settings

Under the Colors tab, the color option is available for Text.

Typography

Under the Typography tab, options for font family, font size, font-weight, and line-height are available for Blockquote.