How to use the Block Editor to make your posts look the way you want them to


The Heading Block

To add a Heading, click on the Inserter ⊕. Alternatively, you can type /heading in a new block and press enter.


The editor automates a search engine optimized layout by considering the page title is the <h1> tag, so subsequent heading blocks begin at <h2> and so on, but you can choose your heading level according to your style in the toolbar.


The Quote Block

This block reformats text so that a quote stands out from other text in your post.

To add a Quote Block , click on the Inserter ⊕. Alternatively, you can type /quote in a new block and press enter.

The animation below shows how the Quote Block works

The Quote Block Toolbar offers five buttons:

  • Transform to
  • Moving handles
  • Change alignment
  • Text Editing options (bold, italics, add a link, and drop-down for more text editing options)

8 thoughts on “How to use the Block Editor to make your posts look the way you want them to

  1. The Block Editor thing has become a fairly long post.

    I’m tempted to shorten it by removing these two questions:

    How do I check what my post looks like?

    What do I do to publish a post?

    I don’t think the answers vary significantly between Classic Editor and Block Editor.

    I’m also wondering how/if we respond to questions about the content.

    Do we want to have, probably in addition to this, an FAQ section for The Secret Reading Room?

    1. We’ll have a fairly extensive FAQ section — one main page and a whole boatload of tutorials in addition, linked from the main page and also from a dedicated menu.

      Having looked through your post — which I think is great and exactly the kind of guidance people are going to need — what may make the most sense in this particular instance might be to break it up into several chapters, each of them going into a separate post. This is probably also going to be the approach we’ll be taking to other, equally long / “involved” tutorials.

      Also, one of the tutorials we’re planning will be a very basic “how to get started” one, literally from “I’m here — now what?” to “this is how you publish a post” and “here’s where you find xyz item(s)”. So I would suggest that anything not specifically relating to the block editor could go there, unless the block editor has specific publishing settings beyond the “save draft / edit / schedule / publish” modes.

      Tutorials such as this should be formatted as “projects”; that will
      (1) keep them out of the general feed and move them into the dedicated feed we’re reserving for admin issues (general site announcements, tutorials, etc.) and
      (2) auto-enable a “Comments” section where questions can be asked.

      Incidentally, we’re (provisionally, but I think we’ve agreed to settle on this one) working with a theme that has a very clear setup for the “comments” section, with each “original” comment (or question) creating a new box of its own, and all subsequent responses nested within that same box. Christine, MbD and I all like that a lot; particularly when it comes to explaining things and following up on questions in the early days of the community, that should help a lot.

      1. In that case, it might makes sense to put a post with a short overview with lego bricks explanation of blocks and then links to each of the different questions as post somewhere else and have the post independently searchable.

        I don’t know how that’s done in Projects. I haven’t been able to find any tutorials on Projects on wordpress.org.

        I think the best that I can do is complete the segments and add the links and then ask you to move it into an appropriate project format.

        Will that work`?

        1. Absolutely!

          “Projects”, for our purposes, are really just glorified posts, though, which we’re using to keep the admin stuff out of the main “posts” feed, for everything that
          (a) calls for comments / responses, e.g. tutorials and the “Questions?” posts in connection with reading games, and
          (b) is most easily made accessible in a comprehensive but dedicated feed (as pages don’t go into any feed, so you necessarily have to link to those from a site menu somewhere; which in turn means that pages are basically something we’re just using as static one-off things).

          So, to tie several “projects” together, e.g. for your “block editor” tutorial, we’d basically do just what you propose: Present the basic explanation what is a block in a general intro “project” (= post filed as “project” in the site’s “portfolio” section rather than in the “posts” section), then create separate “projects” for each of the follow-up questions and link to those from the intro page. Eh voilà tout!

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.