Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Testing Your Site for Gutenberg

Testing Your Site for Gutenberg

WordPress 5.0 & Gutenberg are set to bring big changes to the WordPress editor, which will potentially affect your sites and those of your clients. In this webinar, we’ll show you how to be completely prepared for the upcoming change by giving you a rock-solid test plan to make sure those sites are ready for WordPress 5.0.


Joe Casabona

May 08, 2018


  1. Testing Your Site for Gutenberg Joe Casabona

  2. @jcasabona Outline • A Look at What Could Break, and

    what likely won't • How to Upgrade to Gutenberg Safely • Developing a Test Plan
  3. @jcasabona Current State of Gutenberg • 2.8 Came out last

    week • It looks like it's in the "Refine and Polish" Phase • WordPress 4.9.6 or .7 will have a CTA to try Gutenberg
  4. What Can Break?

  5. @jcasabona What Can Break? • Current Content • Content Generated

    from Plugins • Customized Editors / Page Builders • Your Theme
  6. @jcasabona What Can Break: Current Content • Edited vs. Unedited

    after Upgrade • Unedited will be fine! • 5.0 will not change how content is stored • Will be one large block when you open old content • Be mindful blocks handle certain elements slightly different
  7. @jcasabona What Can Break: Plugin Content • Not as clear

    as current content • Depends heavily on plugin developers • WordPress Core is helping as much as they can • Custom Admin Pages not affected - only in-editor content
  8. @jcasabona What Can Break: Customized Editors / Page Builders •

    Things vary wildly here • Depends heavily on developers & how tied to current editor experience they are • Customized Editors that still load Classic Editor will likely be affected most • Page Builders that bypass editor completely (like Beaver Builder) could be safe
  9. @jcasabona What Can Break: Your Theme • Highest Risk Here

    (bad news) • New types of content with minimal styles that affect frontend • Ex: Cover Image, Columns • You have a lot of control here (good news) • Add blocks, test, add styles
  10. How to Upgrade Safely

  11. @jcasabona Upgrading Safely • It's important to have parity with

    your live site - same content, plugins, etc. • Create a Staging Site on your host (easier on some than others) • Install the Gutenberg Plugin • You can also try WordPress 5.0's beta, but I haven't tested that • Install any beta plugins that add Gutenberg Support
  12. Coming Up with a Test Plan

  13. @jcasabona High Level Plan • Inventory your content, pages, and

    plugins • Create a “kitchen sink” filled with blocks • Conduct tests • Document everything • Offer feedback
  14. @jcasabona Inventory Content • List all the different types of

    posts you have • Long-form articles, press releases, etc. • Do this same thing with your page layouts, page templates, and existing plugins • Your goal is to make these lists as thorough and complete as possible • Allows you to test representative content
  15. @jcasabona Kitchen Sink • Add a page to your staging

    site. You’ll use as a “kitchen sink” for holding all the advanced and custom blocks • Buttons, Columns, Cover Image, Pull quotes, Tables, Text Columns, Verses • These add new markup to your site & pose the highest risk of breaking your theme
  16. @jcasabona Conduct Tests • You'll want to put your site,

    your content, and Gutenberg through the ringer • Create new content (with all content types) • Update old content • Test plugins • PDF of test plan available at casabona.org/ithemes/
  17. @jcasabona Handling Test Results • Document Everything for your dev

    team • Screenshots would be great • Offer feedback • If you come across a bug in the Gutenberg plugin (or another plugin), let the team know!
  18. Developer, Educator, Podcaster @jcasabona
 casabona.org/ithemes/ Joe Casabona

  19. Special Offer! Get 35% off my course, An Introduction to

    Gutenberg. Visit creatorcourses.com and use the code ITHEMES at checkout. For this offer + more resources, you can visit casabona.org/ithemes/