• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar
Cravings Pro
  • Bloggers
  • FAQ
  • Layouts
  • Recipes
  • Nav Social Menu

menu icon
go to homepage
  • Bloggers
  • Recipes
  • FAQ
  • Page Layouts

search icon
Homepage link
  • Bloggers
  • Recipes
  • FAQ
  • Page Layouts

×
Home » Recipes » Baking

Block Editor (Gutenberg) Styling

Published: Dec 11, 2018 · Modified: Mar 4, 2025 by Feast Design Co. · This post may contain affiliate links · Leave a Comment

This is a demo post exploring the different styles in the block editor (codenamed "Gutenberg"). This is just a development post - we haven't yet released this publicly.

Jump to:
  • This is an H2
  • Simple Image Block
  • New Gallery Block
  • Ingredients
  • Instructions
  • Fractions
  • Test recipe
  • Quotes
  • Overlay Block
  • Simple Recipe Index
  • Simple Category Index
  • comments

This is an H2

Most of your content should be contained in H2 subheadings.

In version 4.0.0 and later, body font-sizes have been standardized across all themes at 16px. Headings have been standardized using "em", meaning a multiple of the 16px body-font size.

For more details, see this blog post.

This is an H3

H3 can be used to sub-categorize your content under H2 headings. You typically won't need to use these when making recipes posts.

  • The Secret Ingredient: How to Grow into a Top Food Blog
  • Cravings WordPress Theme for Performance
    Sample post with a recipe
  • Cravings Pro for Food Bloggers
    Bake your cake from scratch, not your blog.
  • Cravings WordPress Theme for Food Bloggers
    Recipe Plugins Make Recipe Publishing Easy

This is an H4

H4 is relatively uncommon, except in technical documentation.

As a food blogger, anything you consider using for H4 should be either bumped up to H3, or simple paragraph text. We recommend against using this.

This is an H5

No real application for this outside of technical and legal documents.

This is an H6

No real application for this outside of technical and legal documents.

Simple Image Block

Cravings WordPress Theme for Performance
This is a caption

New Gallery Block

Galleries are new to the block editor, removing the need for plugins. The captions are relatively simple to create, and let you display images in ½ or ⅓ columns.

Testing will be needed to see what sizes are loaded for various devices (desktop, tablet, mobile). Mobile is the most important, making up approximately 75% of pageviews for most food blogs in 2018 and on.

Too many images can slow down your page, unless you use a lazyloading plugin like WP Rocket.

Ingredients

Use an unordered list to show things in unsorted order, such as ingredients.

  • This is an unordered list block
  • This is the second item in the list
  • Use unordered lists to create lists in which the sequence isn't important

Instructions

Ordered lists are great for showing steps in a process, like instructions.

  1. This is an ordered list block
  2. It's good to itemize sequential steps or items in an ordered list
  3. Using lists to break up your content and make it easier to parse is a good user-experience practice

Fractions

The Feast Plugin contains an enhancement to convert text-based characters to fractions, so that you get ½ instead of 1 / 2 and ¼ instead of 1 / 4.

Cravings Pro for Food Bloggers
Print

Test recipe

Summary

Servings 3 servings
Author Feast Design Co.

Ingredients

  • ½ cup olive oil
  • ⅓ cup sugar
  • ¼ teaspoon salt

Instructions

  1. Instruction 1

  2. Instruction 2

Quotes

Blockquotes are a great way to emphasize an important piece of your content.

You can also turn the blockquote into a citation by providing a "citation". This is a great way to reference content on another site.

Edgar Allan Poe

Overlay Block

This is a "cover" block - an image block with text overlay

 Photo credits Brooke Lark

Simple Recipe Index

The Feast Plugin offers a way to visually list posts using the FSRI block.

  • Cravings Pro Minimalist WordPress Theme
    Put Your Best "Food" Forward with A Great Theme
  • Cravings Pro for Food Bloggers
    Get the Garnish Intensive Discovery Workshop!
  • WordPress Theme Easy as Cake
    Sample Post to Explore Cravings' Style
  • Cravings Pro for Lifestyle Bloggers
    Download Your Free Checklist Right Here And Get Started!

Simple Category Index

Similarly, categories can be displayed using the Feast Plugin offers a way to visually list categories using the Feast Category Images block.

  • Fall
  • Spring
  • Summer
  • Winter

More Baking

Reader Interactions

Comments

No Comments

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Recipe Rating




Primary Sidebar

You've got a divine gift designed to serve the world. It’s a special something – small and mighty – that merges passion with purpose, and purpose with joy. This simple yet powerful belief is why I’ve built my design business out of a desire to serve, and why I feel most alive when I’m taking your business, blog, or product to places that soar.

Dig deeper

Popular

  • WordPress Theme Easy as Cake
    Block Editor (Gutenberg) Styling
  • The Secret Ingredient: How to Grow into a Top Food Blog
  • Cravings WordPress Theme for Performance
    Sample post with a recipe
  • Cravings Pro for Food Bloggers
    Bake your cake from scratch, not your blog.

We recommend:

  • Hosting from Bigscoots
  • Domains from NameCheap
  • Recipe Plugin from WP Recipe Maker

This demo site has enhanced customizations from the Feast Plugin

Footer

↑ back to top

About

  • Privacy Policy
  • Disclaimer
  • Terms & Conditions
  • Accessibility Policy
  • Tutorials
  • Customization

Newsletter

  • Sign Up! for emails and updates

Contact

  • Contact
  • Services
  • Media Kit
  • FAQ

As an Amazon Associate I earn from qualifying purchases.

Copyright © 2025 Cravings Pro on the Cravings Pro Theme with upgrades from the Feast Plugin