Common Gutenberg Blocks

Any subjective notes on these block are our opinions and others may not agree. All features for various blocks may not have been tested here.

  • Common Blocks come with WordPress
  • Additional blocks may show up under Common Blocks when certain plugins are added.
  • WordPress updates often add new blocks.

Heading Block

  • https://gogutenberg.com/blocks/heading/
  • Use for topic headings because SEO indexes headings
  • Has 6 default font sizes to choose from but also variable size settings. H1 is recommended for page titles for best SEO.
  • Color can be set in theme options for Weaver Xtreme Plus, but can be overridden and customized. Can change color of highlighted text.
  • Numerous fonts to choose from.
  • Allows for different alignments, degrees of boldness, for variable spacing between letters, for variable line height to allow for more space around heading.

This is H1 Heading Size

Paragraph Block

  • https://gogutenberg.com/blocks/paragraph/
  • For basic text.
  • Can use a plugin called tinymc for additional settings, use advanced settings.
  • Has several default font sizes to choose from but also variable size settings. SEO likes 16px.
  • Color can be set in theme options but can be overridden and customized. Can be changed for highlighted areas.
  • Numerous fonts to choose from.
  • Allows for different degrees of boldness, for variable spacing between letters, for variable line height to allow for more space around heading.
  • To go to a new line without starting a new paragraph use shift/enter.
  • Drop Cap makes first letter very large.
  • “Edit as html” allows more customization but if you want a block of custom html better to use custom html block.

Image Block

  • https://gogutenberg.com/blocks/image/
  • Can adjust size, add a link, add alt text.
  • 4 style options: default, circle, wave top or bottom
  • Can crop image or zoom
  • Best to change size by dragging dots or by percentage, dimensions options don’t change in proportion.
  • Can change image block to gallery block.
  • Can make image a custom link or link to media file.
Snoqualmie Elk

List Block

  • https://gogutenberg.com/blocks/list/
  • Can make a list numbered (ordered) or bullet (unordered).
  • Style options for default, none (no bullets) or check box (but seems to just make big bold bullets, maybe a bug).
  • Can change font, font size, spacing.
  • Heading for a list needs to be a separate block above it.
  • Can indent lines, add text color or highlight text .
  • Otheer list blocks, like Advanced list block have many more options including different bullets icons.

Audio Block

Magione

Video Block

  • https://gogutenberg.com/blocks/video/
  • works well, see demo page on paldomdemo
  • caption worked but like audio captions, may disappear on edit page, so paragraph may be better
  • should be centered or may encounter formatting issues
  • options for autoplay, loop, mute, controls on or off
  • can put a cover image on video
  • advanced video has more options
SFLC video

Gallery Block

  • https://gogutenberg.com/blocks/gallery/
  • Select crop images to make all the same height in a row.
  • Set gallery width and number per row. The one below is set for wide width but not full width.
  • Odd number of images will make last ones bigger so choose order and number of images carefully.
  • Can’t make an image a custom link unless use custom html block. Can make the caption a link—click on image, highlite the caption, click the link symbol, apply, then edit link to go to new page.
  • Captions are over the image so hard to read in some cases, keep captions short or on phone will cover image.
  • if add plugin gallery custom links then can link image to custom link
    • if click on caption it goes to media file, so click above caption for custom link. (first image here is linked to our website)
  • More gallery options are tested on https://www.paldomdemo.com/galleries/gutenberg-galleries/ and https://www.paldomdemo.com/gutenberg/miscellaneous-blocks/
  • When edit gallery can add images, alt tags, captions and links, and can rearrange images.
  • North Bend Elk
  • Fall City Eagle
  • Snoqualmie Elk
  • Sammamish Bear
  • Frozen Web
  • Mt. Si Reflections
  • Mt. Rainier Sunset

Quote Block

insert quote here

by Liz

Cover Block

  • https://gogutenberg.com/blocks/cover-image/
  • Add an image or video with a text overlay.
  • Can put text over image, good for header or heading for a major section of page.
  • “fixed background” makes it paralax using the center of image (not paralax on ipad or android phone),.
  • can also put link on text and change transparency (10)works well) and overlay colors.
  • Looks like can also use a video, haven’t tried that, not sure about slide show.
  • Works to put cover block in a column or container block.
  • Had problem with image getting cut off, can’t change image size
  • The cover block can be made parallax by clicking to make fixed background.

Fall City Eagle
by Liz Lawrence

Below is a cover image made parallax. Another sample is on the parallax content page.

PALDOM SYSTEMS
Business Systems for the Northwest

File Block

  • tested with a pdf file, works with some other file formats.
  • adds a link to a file with a download button and puts the file in the media library.
  • Be sure to click to open in new tab.
Gianfranco Wine ListDownload