With the release of WordPress version 5.0 in December of 2018 came a huge update which revolutionized the way the software is designed. WordPress, which is an open source content management system (CMS), powers over 455 million websites and accounts for over 35% of all sites worldwide as of June 2020.
The new update that came with version 5.0 is known as Gutenberg. It was appropriately named after the Gutenberg printing press, which made printed books and materials widely available to all people. The idea behind the update is the concept of building blocks that allow users to create pages or posts quickly and easily without preexisting coding or programming knowledge.
What Is WordPress?
Before we begin to dive into the specifics of the new Gutenberg visual editor, it is important to give some background on WordPress itself. WordPress as a CMS software was first developed in 2003 as a blogging software. The main page of a WordPress website was meant to show the latest blog posts in a manner that previous .html websites were incapable of doing. They always kept the newest blog post on top, eliminating the need to re-work and code the homepage any time that a new post was written.
Over time, WordPress received updates and new features and slowly became one of the most commonly used website platforms available. Soon, by 2005, WordPress allowed you to set a static front page and create a posts page where your blogs would display. Today, while many websites still choose to have blogging functionality on their websites, many sites simply have static web pages using WordPress and don’t use the blog features at all.
The Shift To Page Builders and Gutenberg
Because many businesses and website owners no longer thought of WordPress as primarily a blogging software, the need became apparent for web designers to build out beautiful websites using page-building software. While WordPress wasn’t always intended to be a website builder, many easy to use drag-and-drop “WYSIWYG” (what-you-see-is-what-you-get) themes and plugins were developed that allowed more front-end designing rather than back-end. The difference between the two is that back-end development requires intricate knowledge of coding languages such as PHP, CSS and JavaScript. By using a pagebuilder, the need for these coding skills diminished, because many of the builders had drag-and-drop or block building capabilities.
However, the drawback of using pagebuilders inside WordPress is that it was like trying to shove a square peg into a round hole. Many of the page builders were very slow and added extra unnecessary code to websites.
Get to Know the WordPress Visual Editor
The previous versions of WordPress typically locked you into a pretty straightforward page layout, which was nice to be able to quickly make pages that match your site but were limited in customization. Starting with version 5.0 of WordPress, everything is done through the “Visual Editor.”
Enter Gutenberg. Gutenberg is WordPress’s attempt at making your site as easy to edit as a Wix or SquareSpace site while still allowing a web designer to create a beautifully designed site. he content on the pages is extremely flexible, and once your site is designed you can make unique page layouts that match the style of your site without involving your developer!
How Does The Gutenberg Visual Editor Work?
With the brand new visual editor in the admin of your site, you can add what are called “blocks” to your page. These blocks can be organized in whatever order you wish. You can also customize things like color, text, and positioning for each block. Easily create galleries, buttons, eye-catching content blocks and embed multimedia from almost any popular platform. The Gutenberg block library is expansive and will only continue to grow as it matures.
Here is a look at the current blocks available:
Common Blocks
These are the most common blocks that would be added to any given page:
- Paragraph
- Image
- Heading
- Gallery
- List
- Quote
- Audio
- Cover
- File
- Video
Formatting
Here are some other customized areas that can be added:
- Custom HTML
- Code
- Classic Editor
- Preformatted
- Pullquote
- Table
- Verse
Layout Elements
The layout elements add more functionality to a page than just text and photos:
- Button
- Columns
- Media & Text
- Read More Link
- Page Break
- Separator
- Spacer
- Social Icons & Buttons
Widgets
Widgets allow you to expand the functionality of your website:
- Tag Cloud
- Shortcode
- Archives
- Calendar
- Categories
- Latest Comments
- Latest Posts
- RSS
- Search
Embeds
With these embeds, you can pull in data from a different website to display on an area of your website:
- YouTube and Vimeo
- Twitter, Facebook and Instagram
- SoundCloud and Spotify
- Flickr, Imgur and Tumblr
- And many more!
What If I Need Something That Isn’t A Default Block?
No problem! With access to a trained developer, whatever you dream up can be turned into a block. Need a custom calculator that you can have on a couple new landing pages? As soon as your developer has your new block created, you will be able to add this on any page.
What About Design Consistency?
Not a designer? No problem! Gutenberg uses your site’s existing theme colors and layout to drive how blocks are displayed. That means you can drop a block in and have it automatically match. On a page builder like Divi, you would have to pre-set library elements and also make sure you don’t make any changes. With Gutenberg just drop it in, and it’s ready to go.
Can I Change Anything Else On My Site?
The exciting thing is this is just the beginning of WordPress’s plans to put your site control into your hands. Future releases will include the ability to create and edit the header, navigation, and footer of your site! If your organization wants to swap out logos and colors, those changes will be available to you through the admin. A designer and developer can still establish the design of your site and then you’re free to customize from there.
What Does Gutenberg Mean For My Existing Site?
If you have an existing site with us, nothing will change. This functionality will only apply to newer builds. If this looks like something you would like integrated into your existing site, we can do that too, just contact us and we can quote a conversion!
