You are here

Wordpress Gutenberg

BIG Wordpress Changes: Planning for Gutenberg on Your Nonprofit Website

If your website uses Wordpress, you may be aware of the big update that is coming to 5.0.

There are mixed emotions in the Wordpress community about the new editing interface, called Gutenberg.

Regardless of which side you sit on, you better get ready because the Gutenberg release is coming to your website whether you like it or not. Some say by fall of 2018, but there’s no official release date set yet.

The reason it is such a big deal is that the way your website functions now and how it will function after Gutenberg is going to be extremely different.

In particular the functionality of some plugins, all page builders, and most shortcodes are going to be affected by this update. This is important because just about every Wordpress website uses one of these features if not multiple.

This post will provide some background on how we recommend approaching this update, and most importantly, how to create a plan in order to get started.

Lastly, we provide a Gutenberg launch checklist that you can walk through with your team to double check so you can feel confident that you’ve done your due diligence.

Download the Checklist

What is Gutenberg?

Gutenberg is a brand new editor interface coming soon to Wordpress 5.0.

Rather than using the classical Wordpress main body field, Gutenberg breaks that content area into blocks. I like to think of blocks as content “Legos” that you can mix and match on the screen to create rich content layouts.

The positive is that it allows users that have no coding ability to create some really interesting content layouts on the page.

If you are starting with a blank page, it’s quite powerful, but the challenge comes into play when you already have a site that has lots of different types of content on it.  For existing pages, it’s not always clear how Gutenberg will translate that existing content into the new framework.

Gutenberg is a step towards completely erasing the back-end editing experience on Wordpress. So, rather than needing to “edit post” you would actually be editing the text, pull quotes, images, etc. as it would look on the front end of the site.

In my opinion, the future is bright and endless for this technology, but the near term transition may be painful for some.

How will Gutenberg Affect My Website?

So, let’s get to what’s important: How is this major update going to affect your site?

The short answer is…. We don’t know.

Yeah, that’s not a great answer, but that doesn’t mean that we can’t plan for this.

The best way to figure out how the upgrade will change your site is to formulate a plan.

Our recommended plan is to move a copy of your site onto a development server. If you don’t know how to do this, or what this is, contact a developer that does.  

WARNING: NEVER EVER, EVER, EVER, TEST GUTENBERG ON YOUR LIVE WEBSITE.

Once a copy of your site is setup on your development server, it’s time to formulate a plan of action.  Below are some areas to that we want to highlight.

Also, download our Gutenberg Pre-Flight Checklist for a more comprehensive list what to test.

Create a Plan for Upgrading to Gutenberg

It’s important to plan for anything you do. It’s also important to realize that no plan survives the first encounter with reality.

But, it’s also important to start the planning and testing process early and often so that if something does get completely messed up, you have time to plan.

Here are some high-level things to make sure you have in your plan:

Communicate Clearly to Your Organization What You’re Doing and Why: There’s no need to sit down the entire organization to test your website, however, it is worth letting people know what’s going on and that you have a plan in place. Make sure that you are setting expectations appropriately, and reporting back the findings so everyone feels engaged in the process. It’s also not a bad idea to ask people to test the dev site later on before you bring it live.

Plugins Need to be Tested Vigorously: Any plugin that has an administrator’s interface, or somehow changes the way the front-end of the site looks is potentially at risk. The Wordpress plugin community has known about Gutenberg for a long time now, so most of the major plugins have been working towards being compatible. That said not all are.

Page Builders: Over the past 5 years, page builders like Visual Composer, Beaver Builder and some others have become extremely popular.  There is a lot of question in the Wordpress community as to whether Gutenberg will eventually replace them. There’s no indication that is that case in the short-term.  

However, some of the page builders we have tested blow up the entire site as soon as you install Gutenberg. Do your research to know whether the page builder you use plays nicely with Gutenberg or not. Most maintainers will have some information on their site about it.  If not, open a support ticket to see what they plan to do.

Custom and Premium Themes: If you’ve purchased a premium theme or you have functionality baked into your theme, you definitely need to plan for potential issues.

Similar to plugins, the good theme authors should be making plans to accommodate the Gutenberg release.  But, make sure you know where you downloaded the theme and who to talk to if you find that your theme no longer works when you install Gutenberg.

How to Start Testing Gutenberg on Your Website

Once you have a plan, it’s time to jump in.

Setup a dev server, copy your live site to the dev server and install Gutenberg.

Run through our Pre-Flight Checklist.

Obviously, every site is different. You will know the key pages on your site that may have custom functionality.  Make sure to include them in your plans.

When you’re testing you want to see how each page behaves for all user types. So, this means, view the site as an anonymous user that is not logged in.

Do you have members or logged in user areas that are not editors/administrators?  Test as that user role as well.

View the site as a logged in admin. Test the editing interface as well as the front-end of the website.  Are things off?

When you find issues, note the problem by writing a bug report. To write an clear bug report answer these questions in a few sentences:

  • What page were you on where you noticed the problem?
  • What functionality is supposed to happen? What is happening instead?
  • What were you doing when the functionality broke?
  • Include a screenshot if appropriate.
  • Include the error message text if there is one displaying.

Keep moving through the site. The goal is to note all of the issues that come up, put them in a list and return later when you know the scope of all of the issues.

Once testing is complete, it’s time to evaluate the findings.  Start to think about:

  1. Do we need to bring in a technology partner to assess the scope of the work?
  2. Do we understand the errors we encountered?
  3. Can you Google the problem and find a solution in the Wordpress community?
  4. If you can’t find a solution, immediately, what are the options?
  5. Can you live without that feature on the site, or do you need to rebuild it?

Once you’ve gone through and fixed all of the issues, you should be ready for the Gutenberg release.

Gutenberg FAQ

Will my site break from Gutenberg?
Maybe. It’s important to test on a development server and run through our pre-flight checklist to find out.

When will Gutenberg be released?
There is no set date yet for the release of Wordpress 5.0, which contains the Gutenberg editor. Check out the resource below to stay up to date on the timeline.

Can I avoid using Gutenberg?
There are options currently to use the “Classic Editor” in the latest release of Wordpress, but in the future Gutenberg will be required.  There’s no timeline for when this will change.

My theme author won’t answer my requests for information on supporting Gutenberg. What do I do?
Make sure you test your site on a dev server.  If there are problems then you should try and contact a developer that can advise you on how to move forward.

Why are they even changing the editor?
According to Wordpress, they believe that this is the best direction for their product and will represent the cutting edge experience for users.

Helpful Gutenberg Resources

The Wordpress community is huge, and there are tons of good resources out there.  

For large changes like this, it’s worth staying actively aware of what the latest is.  Below are some good resources to help you stay informed.

Social Media

Andrew Goldsworthy - Rootid Co-Founder

Andrew Goldsworthy

Andrew has over 15 years experience in user interface and online marketing strategy for social entrepreneurs and nonprofits. He has also worked extensively in fund development and online marketing for Habitat for Humanity. Andrew is passionate about using the power of technology to empower mission driven organizations and social business. He's also an avid outdoorsman. Frequently camping, skiing, fishing and fending off mosquitos.