The Gutenberg WordPress editor has been the center of attention since its release last December. People can’t decide whether to believe that change is good or stick with the saying “if it ain’t broke, don’t fix it.”

But regardless of how you feel about this major WordPress release, Gutenberg is here to stay. And if you run an online shop using WooCommerce, there’s a lot to consider.

Powering a solid 22% of all eCommerce websites, WooCommerce definitely stands out as the most popular, widely used, and affordable eCommerce platform. But more than that, WooCommerce offers online shop owners the chance to build flexible websites with all sorts of functionality.

From bookings to membership sites, affiliate stores to paid job listings and directories, WooCommerce has it all. Top that off with unlimited customization options and anyone wanting to build an online store can using this freemium eCommerce solution.

If you own a WooCommerce shop, and are wondering how WordPress 5.0 and the new Gutenberg editor is going to affect your ability to create, customize, and operate an online store, keep reading.

Today we’re going to share with you everything you need to know as you transition from the old Classic Editor to the new (and some say improved) Gutenberg Editor.

 

WooCommerce Gutenberg Products Block

If you’ve tinkered with Gutenberg at all by now, you’ve probably noticed some of your favorite plugins have added easy to use Gutenberg blocks to make creating and editing content easier than ever.

 

 

And WooCommerce is no different.

Designed to work with WordPress’ newest content editor, the WooCommerce Product Blocks plugin helps you select and display the following types of products in your online shop:

  • Products from specific categories
  • Individual products
  • On sale products
  • Bestsellers
  • Top-rated products
  • New products
  • Featured products

 

 

In short, the new WooCommerce Product Blocks plugin is an upgraded version of the Product Shortcode. With it, you can control all aspects of product display right in the content editor.

To start, choose where to pull your products from.

 

 

Then, view a real-time preview of how your product will look when pushed live, and start adding more products to your site’s posts and pages with ease.

 

Gutenberg + WooCommerce: Things to Consider

 

When it comes to managing an eCommerce shop, there’s a lot of moving parts to consider if you want to secure sales and generate money.

That’s why before making the transition to anything as significant as WordPress 5.0, you should take the time to think about some important factors that may affect your success as an online shop owner.

 

1. Theme Compatibility

 

WordPress experts designed Gutenberg, so the chances your WooCommerce theme will conflict with it is minimal. But that’s not to say it’s automatically compatible or that something won’t happen when you make the change to Gutenberg.

Gutenberg is slated to work with most WordPress themes right out of the box. In fact, your theme has the ability to customize Gutenberg in the following ways:

  • Custom block styles
  • Gutenberg-related hooks
  • Custom editor styles
  • Block templates
  • Color palettes
  • Align wide and full support

However, just because a theme is labeled “Gutenberg compatible” doesn’t mean it can accomplish all of the above.

Many WordPress themes are playing catch up when it comes to Gutenberg compatibility. So, switching straight to Gutenberg and hoping your site renders well is a bad idea.

You don’t want to risk losing out on business because your site breaks and people can’t access you online shop.

 

2. Testing WooCommerce Product Blocks

 

As with all WordPress plugins, even before the release of WordPress 5.0, you should always test newly added plugins in a staging environment before pushing them live on your site.

Again, you don’t want to risk breaking your site and experiencing serious downtime (and lost sales) because WooCommerce Product Blocks didn’t play nice with your shop’s theme, other plugins, or Gutenberg itself.

It’s also a good to test the following on your local site before going live:

  • Custom fields, as many “Gutenberg compatible” plugins’ custom fields don’t work
  • Page builders (to make sure they work) and to see whether Gutenberg will kick you to another editing screen
  • Any plugins on your site that might integrate or conflict with the editing and display of content created using Gutenberg
  • All shortcodes

It’s important to test all things related to the creation of your online shop when it comes to Gutenberg, WooCommerce, and WooCommerce Product Blocks.

 

3. Monitoring Site Speed and Performance

 

The bigger your WooCommerce shop grows, the more strain you place on your resources. Add in the fact that Gutenberg carries some extra weight and has the potential to slow your site down, and you could end up unknowingly harming the user experience and your site’s search rankings.

Anytime you make a significant addition to your website, whether it be content, products pages, a new plugin or theme installation, and yes, even the addition of the Gutenberg editor, you should monitor your site’s page loading time to make sure you’re not harming your WooCommerce shop’s performance.

 

4. WooCommerce Product Blocks’ Limitations

 

There’s no denying that the creation of WooCommerce Product Blocks is a great thing for WooCommerce shop owners. After all, if publishers get to enjoy the benefits of Gutenberg, online shop owners should too.

That said, Gutenberg is brand spanking new, which means WooCommerce’s block is even newer. There are still changes to be made, bugs to work out, and initial limitations to the plugin and its capabilities.

For example, this plugin will only work with Gutenberg on your site’s posts and pages.

You cannot create new products using anything but the Classic Editor.

Though it’s relatively safe to say that will change at some point, the truth is, right now WooCommerce Product Blocks has some limitations you should be aware of.

 

4. Know That Expert Customizations Might Be Necessary

 

It’s important to remember that Gutenberg signals a major shift in the WordPress ecosystem. It holds great potential and will change the way WordPress users of all kinds create and edit content for their site visitors.

But it’s easy to get caught up in all things that are shiny and new and forget that with new things come issues when it comes to complex customizations.

Large online stores rely heavily on the customized look and feel of their websites to beat out the competition. But be advised, risking your online shop for extensive customizations is not worth it.

Have a plan before you shift to using Gutenberg. Know exactly what you envision your site looking like, have a technical plan for how you’ll execute that vision, and be ready to hire an expert if you need any advanced custom development.

The future of WordPress remains as bright as ever with the introduction of the Gutenberg editor. And for those who operate WooCommerce shops, there isn’t too much to be concerned about, save for some initial growing pains.

That said, if you need help with your WooCommerce site, including improving site speed and performance, and maintaining things like server infrastructures, security, and backups, get in touch with us for your managed WooCommerce needs.

We can help ensure any upgrades or changes you make to your online store go smooth, as well as help you scale your business like never before.