Example Post Showing Block Editor (Gutenberg) Styling

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.

Here is some bold text.

Top Tip

If you're going to make this recipe, make sure to follow this top tip!

This block has a custom background and text color set.

Here is some italic text.

1

2

3

I got so many compliments from this!!

Here is some underlined text.

Jump to:

🤩 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.

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.

This is an H5

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

This is an H6

Why even bother at this point?

Simple Image Block

Image captions are tied to images themselves, adding context for search engines and your visitors!

We don't recommend using the gallery block due to poor accessibility support.

Instead, use the WordPress-core "columns" block and insert normal images into the columns:

Instructions

Step 1: mix ingredients together

Step 2: roll into meatballs

Step 3: Place in fridge for 10 minutes to chill

Step 4: spread evenly on baking sheet

Step 5: bake at 350 degrees F for 25 minutes

Step 6: enjoy!

Find what you're Looking For:

Browse full recipe index →

Columns

inserting a column block in the WordPress editor

When inserting columns, you'll be given the choice of different default column widths.

For a similar mobile and desktop experience, use 50/50 for normal page layouts (720 / 2 = 360), and 33/33/33 for full-width page layouts (1080 / 3 = 360).

Mobile is the most important, making up approximately 75% of pageviews for most food blogs in 2018 and on.

Comment review

Yoast FAQ

Question 1

Answer 1

Question 2

Answer 2

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.

Full width feature wrapper in a post (sidebar) should not display full width.

But it should have full bleed on mobile.

Unordered List

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

Ordered List

  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

Inline list

  • this is an inline list
  • only available through Feast+
  • designed to be used in the alternative footer layout

Normal list

Custom list

  • this is a list
  • with custom checkmarks
  • from Feast+
  • set via the branding Celebrate the flavors of fall with these creative and delicious seasonal favorites!
  • Celebrate the flavors of fall with these creative and delicious seasonal favorites!

Top Tip

If you're going to make this recipe, make sure to follow this top tip!

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

About author round

Hey, I'm Skylar!

It's great to have you here. I create simple vegan recipes to make eating more veggies easy and delicious.

About Skylar →

Overlay Block

The overlay block isn't recommended or supported.

This is overlay text

Recipe card

The best sandwich

One of my favorite things to create is bowls comprised of healthy grilled food. Here, we are using seasoned, spicy polenta, rice, beans, greens, red onions, jalapenos and topping it all with avocado and salsa.
Prep Time 15 minutes
Cook Time 1 hour 15 minutes
Total Time 1 hour 30 minutes
Course Main Course
Cuisine American
Servings 2 people
Calories 500 kcal

Ingredients
  

  • 6 each meatballs
  • 1 sandwich bun cut in half
  • 5 oz marinara
  • 1 green pepper sliced
  • ½ onion medium, sliced

Instructions
 

  • Cook meatballs
  • Cut sandwich bun in half and toast it
  • sautee the sliced onions and green pepper
  • Add marinara to bottom half of sandwich bun, add meatballs, and layer on sauteed onionsand green pepper

Notes

Add so much extra cheese that your dog thinks you have a problem.
Keyword sandwich

3 Comments

Leave a Reply

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

Recipe Rating