What Is Gutenberg?
Let’s take a look at how WordPress describe Gutenberg and then how as a creative marketing agency we can use the tools provided to create better content managed websites for our clients.
The Gutenberg editor uses blocks to create all types of content, replacing a half-dozen inconsistent ways of customizing WordPress, bringing it in line with modern coding standards, and aligning with open web initiatives. These content blocks transform how users, developers, and hosts interact with WordPress to make building rich web content easier and more intuitive.
The aim behind Gutenberg (https://wordpress.org/gutenberg/) is to provide a better user experience than dumping large amounts of content inside the current WYSIWYG editor. Any time as a design agency we can provide a better experience to our clients we will jump at the chance, Gutenberg gets us excited.
Matt Mullenweg announced Gutenberg in State of the Word in the following video (warning this is almost a 2 hour video, but well worth watching).
What is ReactJS?
React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes.
Sounds perfect for creating a new front end editor, just with one small catch. This a technology that has not been needed previously to build an admin area inside WordPress, so there will of course be some learning involved for experienced WordPress developers that haven’t used ReactJS previously.
How we are keeping up to date.
It’s important for us to support our developers and make sure they feel comfortable using the technologies that are required by our clients. A few things we are doing to support our developers include:
- Attending WordCamps, specifically WordCamp Brighton.
- Ordering in ReactJS materials (The road to learn react is a great book).
- Signing up to ReactJS training.
- Scheduling in time to learn ReactJS.
- Testing and using the Create Guten Block by Ahmad Awais
Any other suggestions from our devs are implemented too, although we are still waiting to hear why Adam thinks attending the World Cup will help with learning ReactJS.
Where can I find recent information regarding the new WordPress editor?
There are loads of places to keep up to date about the new WordPress editor, especially because it is such a big change. We have curated a couple of places in particular where we check every so often.
- https://wordpress.org/news/ – The official WordPress.org blog which includes a whole plethora of information regarding WordPress, including Gutenberg.
- http://gutenberg.news/ – A great site with lots of articles, you might need to pick through some of the posts but there are some great pieces of content here.
- https://twitter.com/hashtag/Gutenberg – The hashtag #Gutenberg seems to be picking up more and more traction as a way to discuss the new editor over on twitter, which is definitely worth checking out if you want to keep up to date.
How will Gutenberg benefit our clients?
This is the most powerful reason for us learning Gutenberg. Going forward our clients will benefit from having the ability to create rich content using blocks that have been purpose built for them. Some of the benefits include:
- Re-ordering blocks of content
- Sharing blocks of content with other types of content
- Increased modularity
- Making content easier to create
- Defining fields to keep a consistent brand on the front end
Everyone knows that great content increases conversion rates, better conversion rates mean more sales/profit. With Gutenberg it will be easier to create great content.
There is no doubt that Gutenberg has introduced a big divide in the WordPress developer community, but we are keeping a close eye on it! At the moment it appears as though the change is causing issues for people who use WordPress as a quick and easy system for creating small sites, but who knows for sure. I’ll make sure to try and post more about Gutenberg as things progress on the Graphitas Blog and on my personal blog EpicWebs.