With such a big WordPress update the team at Hiilite has compiled a comprehensive guide to the new version of WordPress. WordPress 5.0, or Gutenberg is a significant update. We’ll go over why in this article.
If you run a WordPress website you’re familiar with the idea that they usually have updates between 2-4 times a year. Sometimes these updates can impact the way your website looks or some of the integrations/plugins that your website utilizes and relies on. With 5.0, one significant change is the Gutenberg editor, the new block editor, which is meant to compete with functionality that many other Web platforms utilize. This editor is meant to be more user friendly when building pages or content on your website.
If you’re already utilizing a block editor type of functionality for your Content Management System (CMS) then not much will change for you functionality wise. If you aren’t using a block like page builder for your site, there may be a bit of a learning curve. The Gutenberg Editor is almost a combination of front-end and visual composer. Obviously, as with any significant changes, the initial reaction is typically skepticism. Hopefully by introducing these changes to you in this article, that feeling can be reduced. If you are looking for increased reason for optimism, according to WordPress.org, over 1 million sites are already using the Gutenberg editor.
Also of note is to upgrade PHP on your site as WordPress 5.0 officially supports the upcoming PHP 7.3 release. If you’re using an older version, WordPress encourages you to upgrade on your site. This is critical because if you were to update your site to WordPress 5.0 and not your PHP, it’s extremely likely your site will break. If you’re a client of Hiilite’s be sure to contact our support team with any questions you may have on upgrading.
What does the WordPress update mean for you?
For current monthly Hiilite clients, no worries! Your updates will be executed as part of your monthly website maintenance, no action is required on your part.
If your website if hosted with us, but you do not have a monthly maintenance package, the following steps are highly suggested in order to ensure a smooth update for your site.
Please pass these instructions to your technical team or developer:
1) Take a full backup of your website before updating anything
2) Update all of your plugins & themes first (to ensure they are WordPress 5 compatible)
3) Update to WordPress 5
4) If you are using a page editor such as visual composer/wp bakery, disable Gutenberg using the following plugin:
https://wordpress.org/plugins/disable-gutenberg/
5) Review your site to ensure all functionality is intact post update
For those looking for best practices on how to get ready and update your website for the newest version of WordPress, utilizing the new features and functionality to its fullest, be sure to keep reading for the step-by-step instructions below.
How to Get Ready and Update to WordPress 5.0 (Courtesy: kinsta.com)
We can’t stress enough how important testing WordPress 5.0 and Gutenberg is. You really need to make sure all of your plugins and theme are going to work properly. If you have a custom built solution, make sure to start reaching out to a WordPress developer to get it updated. This is not something your WordPress host will be able to fix for you.
1. Download the Gutenberg Plugin
Gutenberg WordPress plugin
You can download the latest version of Gutenberg from the WordPress repository or by searching for it within your WordPress dashboard under “Add New” plugins.
Install Gutenberg WordPress plugin
We highly recommend installing Gutenberg on a test site or utilize your host’s staging environment. This way you won’t affect your live site.
WordPress staging environment
After installing Gutenberg, the “Edit” option under your pages and posts will automatically open in the new editor. If you have the classic editor plugin installed, you’ll also see an option for that as well.
Gutenberg edit
What Happens to Current Content?
What happens to the content you created in the classic editor when opened in the new Gutenberg editor? Basically, the entire post will show up as one big TinyMCE editor box. They did this to preserve the content format of all of your posts and pages. To take advantage of the Gutenberg editor, you can select the option to “Convert to Blocks.”
Gutenberg convert to blocks
Everything will then be automatically converted into the new Gutenberg blocks.
Converted Gutenberg blocks
What Happens to Shortcodes?
The same goes for shortcodes. In this example, we had a NinjaForm contact form contact form already on our development site. It was placed in the classic editor using a shortcode. So in the Gutenberg editor, we again select the “Convert to Blocks.”
Gutenberg shortcode
The shortcode is then turned into a Gutenberg shortcode block. The contact form still renders fine on the front-end.
Converted Gutenberg shortcode block
2. Take a Backup of Your WordPress site
If you aren’t testing on a development or staging site (which you should be) make sure to take a complete backup of your WordPress site. There are a lot of great WordPress backup plugins you can utilize. If you’re a Kinsta client you have access to a staging site as well as four different types of backups, including automatic backups which are stored for 14 days.
However, due to the fact that WordPress 5.0 is such a huge change, we also recommend taking a downloadable backup of your entire site. This includes all of your files and your MySQL database. You never know, you might miss something after those 14 days have passed. It’s always handy to be able to launch a backup if needed. Kinsta clients can download a full backup with a simple click anytime in the MyKinsta dashboard.
Download full WordPress backup
3. Check Plugins and Themes (They are Impacted by Gutenberg)
As part of your testing with Gutenberg, you’ll want to make sure that all of your third-party plugins and theme work with Gutenberg. Anything that interacts with the WordPress editor will most likely be affected. Yoast SEO is a good example as it has custom meta boxes. Advance Custom Fields would be another one.
Check with the developers of your plugins and theme. Many have started announcing Gutenberg support or when they will have it. Many theme developers are also releasing their own Gutenberg blocks.
4. How to Update to WordPress 5.0 (Once It’s Released)
Depending on your hosting provider, your website might automatically update to WordPress 5.0 after it’s released.
Once WordPress 5.0 is officially released it will be available via the WordPress admin dashboard. Simply click on the updates icon in the toolbar. Then click on the “Update Now” button. While your site is being updated, it will be in maintenance mode. As soon as your updates are complete, your site will return to normal.
Update to WordPress 5.0
As long as everything goes well with the update you should then see the “What’s New” screen. And that’s it! Quick and easy.
WordPress 5.0 and WooCommerce
WooCommerce has released an official statement regarding the release of WordPress 5.0. If you’re running WooCommerce, make sure to update to WooCommerce 3.5.1+ before updating to WordPress 5.0 to avoid breaking changes.
WordPress 5.0 and Plugins
The team over at Yoast is consistently pushing out new features, bug fixes, and improvements for Yoast SEO and Gutenberg compatibility. We highly recommend updating to the latest version (version 9.2.0 was released on November 20th) before updating to WordPress 5.0.
Troubleshoot Issues with WordPress Update
As with every new release of WordPress, there are always some that experience issues, and that is due to the thousands of different plugins and themes currently co-existing in the market. Here are a few ways to troubleshoot common issues.
- Getting the white screen of death? This is commonly resolved by simply restarting PHP and deleting the full page cache on your WordPress site.
- Seeing a “Briefly unavailable for scheduled maintenance. Check back in a minute” screen that won’t go away? Your site might be stuck in maintenance mode.
- Try deactivating all your plugins to see if that fixes your issue. Then reactivate them one by one until you find which plugin might need an update from the developer.
- Try switching over to a default WordPress theme, such as Twenty Nineteen (once it’s available). If this fixes your problem, you might want to reach out to your theme developer.
- Troubleshoot and diagnose JavaScript issues in your browser. This can be especially helpful if a crucial component like the Visual Editor (TinyMCE) breaks.
Summary
WordPress 5.0 and Gutenberg is the biggest update to WordPress that we’ve had in a long time. It affects everyone, from how users interact with the editor and write content, to how developers code plugins and themes. Only time will tell how successful the Gutenberg project is. But no matter what, it’s best to start testing as soon as you can to ensure nothing breaks on your WordPress site.
Have any thoughts regarding WordPress 5.0 or Gutenberg? We’d love to hear what you think about it.
Still worried about updating to WordPress 5.0?
Our WordPress Maintenance and Support Services are here to help. Let us do help you through the transition. We’ll update your website to WordPress 5.0 when it is available, ensure compatibility with your current software, make the classic editor available, . Contact us today and we’ll help your website transition smoothly to WordPress 5.0.
