Gutenberg is WordPress’ highly anticipated, highly debated, new default page and post editor. It replaces the old WordPress TinyMCE content editor with an all new block editor.
Gutenberg was officially released on 6th December 2018 as part of WordPress 5.0. If you’ve already updated your site to WordPress 5.0, you should now see the new block editor by default.
‘Gutenberg’ was the code name for the new editor’s development phase. From now on it’ll just be referred to as the plain old WordPress block editor. Doesn’t sound so exotic now does it?! Now the clue is in the name – it’s a block editor, which means you create your content in blocks. The idea being that you can create more sophisticated layouts and designs with better flexibility and control.
Each block can be edited individually and rearranged using drag and drop. What constitutes a ‘block’? Well, a block can be anything:
- Text
- Images
- Embedded Video
- Buttons
- Widgets (like the ones you use in your sidebar)
- Tables
- Etc, etc
Will the new WordPress block editor replace other page editors?
No. Certainly not yet. It’s not quite a page builder. It will make it easier to make your pages and blog posts look better but you can’t compare it with page editors like Cornerstone, Visual Composer, Beaver Builder or Elementor. What we don’t fully know yet is how Gutenberg is going to co-exist with those page builders.
Do you HAVE to use the new WordPress Block Editor
No, but the classic editor will be phased out eventually. You can update to WordPress version 5.0 (updating WordPress to the latest version is always best practice), but if you’re not ready to use Gutenberg you can install the official Classic Editor plugin, is available until December 31, 2021.
Is Gutenberg compatible with all WordPress themes?
Theoretically there should be absolutely no problem in using the new block editor with any theme. Having said that, you might experience some issues if you are using an older, outdated theme. There are already themes emerging that claim to be specifically built to be compatible with Gutenberg. These are generally premium, paid-for themes and are built with custom solo blocks for Gutenberg Editor.
Here are some Gutenberg-specific themes…
There are other Gutenberg-ready WordPress themes available. Check them out at Theme Forest.
Building Your First Post with Gutenberg
The best way to learn this is to dive straight in. Create a test post and start playing around. You won’t break anything!
Add your new post and give it a title.
The usual post options can still be found on the right-hand side of the screen under the Document tab. That’s where you can change the URL and add your categories, tags and featured image.
In this case we are simply cutting and pasting an article from a word document. If you copy and paste from a word document, the editor does pick up headings, formatting and paragraphs, although we are finding that it removes some of the spaces between words, so be sure to double check your content before you publish.
To change a heading element, click on the heading and select your new tag or change it to paragraph or add a link.
You can set your links to open in a new window
Adding images isn’t dissimilar to adding images with the old editor. In fact, most of the new editor is similar, just more visual.
You can re-size images just by dragging to image itself
You can add Amazon images too, for any products you are selling.
Add a new block and select Custom HTML under the Formatting tab and paste your Amazon code there.
Preview your changes and you should see the image. Now go to More Options and select Convert to blocks. That will convert your code to an image block and then you can re-size and realign it.
And if you make a mistake? There’s an undo button, which is by far the most useful thing about it.
There are probably going to be a few teething problems, like fixing the bug that causes the spacing issues when you cut and paste from a Word document. All in all, it’s fairly intuitive and not a million miles from the old editor, just a more visual, drag and drop style. If you’re new to WordPress and don’t know any different, we think you’ll be just fine with Gutenberg. And Old WordPress dogs, you can learn new tricks. I think it’s going to take a little bit of time to grow on us, but we’ll get there.
Comments
Hello, I wanna know how to use thumbnail of your post.
Just set it in the “Featured Image” section.
When I paste the Amazon affiliate code into Custom HTML, it won’t show anything on the preview screen (just a big white space). Is there a plug-in or something that I may need to update? I have the latest version of Gutenberg (5.3), and I’ve never had this problem before.
Hmm. I don’t think so. Hopefully, be resolved in future updates.