WordPress 5.0: What the new Block Editor means for WooCommerce

Written by Claudiu Lodromanean on November 30, 2018 Blog.

UPDATE: WordPress 5.0 has been released. Remember: it is important that you update to the latest version of WooCommerce before updating to WordPress 5.0
We recommend viewing our documentation on how to updatemaking a backup, updating extensions, and finally updating WooCommerce via WP Admin.

WordPress 5.0 introduces the new block editor to WordPress. Through a complete revamping and modernization of the WordPress content-editing experience, content will be created as a series of blocks in a brand new interface.

For WooCommerce store owners and developers, it’s the start of an exciting process that will make large parts of the admin interface easier-to-use, and more dynamic – including customization and management of posts and products.

The transition to block-based editing will take place incrementally, but here is what you can look out for:

New Block Editor

The Gutenberg Editor in action

One of the strongest reasons to use WooCommerce over other eCommerce platforms is because you also get access to WordPress’ content capabilities. You’re able to write and publish all sorts of promotional content and blog posts for your shop in the same place you manage your products and orders. This is a powerful integration, and it will only be improved by the block editor.

With it, you can create highly-customized landing pages, blog posts, and articles with full control over each individual section, with many different types of sections available.

With thousands of developers in the WordPress plugin ecosystem, it is only a matter of time before all sorts of useful new blocks are available for your content: from blocks for newsletter signups and calls-to-action, to blocks for image galleries and testimonials, to the WooCommerce-specific blocks we’re developing.

WooCommerce Blocks

WooCommerce’s initial block for the WordPress 5.0 launch is the Products Block. Using this block, you can feature your products in posts and pages. Products can be filtered and sorted by all sorts of criteria, and you can also adjust display features like the number of rows or columns.

It’s a much more powerful, visual, and intuitive way of featuring products in content compared to previous solutions such as shortcodes or toolbar buttons in the classic TinyMCE editor.

The Products Block is currently a feature plugin while we refine and polish the user experience to make it as natural and intuitive to use as possible. Once the experience is dialled-in, we will be merging it into the WooCommerce core plugin, where it will be available to all WooCommerce stores.

Read more about the Products Block here – or if you’d like to start using it now: get it here.

Storefront

Storefront 2.4 and higher supports all of the new blocks introduced in WordPress 5.0

We’ve been hard at work getting our Storefront theme ready for WordPress 5.0. The block editor introduces a lot of new blocks and features of which themes can take advantage. Some of these include full-width cover images, parallax images with text overlay, all sorts of different embedded content blocks, and column support for up to six columns.

Storefront 2.4 and higher supports all of the new blocks introduced in WP 5.0, and is available for download now.

Twenty Nineteen Theme

WordPress 5.0 introduces a new default theme: Twenty Nineteen

In addition to the new editor, WordPress 5.0 introduces a new default theme: Twenty Nineteen. This theme is designed from the ground up to be super-flexible, taking full advantage of the block editor.

WooCommerce 3.5.2 and higher supports Twenty Nineteen, and you can use this new theme as the base for all sorts of different shops.

Block Editor Phase Two and WooCommerce

Design prototype showing how editing a product might look in the future.

The block editor’s next phase will introduce the concept of templates. The specific implementation of how templates will function is still in the works, but this will enable WooCommerce to modernize and improve the product editing experience even further.

Instead of a bunch of meta boxes scattered about the product admin interface, you could soon be editing products using a visual editor, where you can see and customize in great detail how the product will appear in the shop.

We Look Forward To WordPress 5.0 and Beyond

We’re looking forward to all that WordPress 5.0 will bring to eCommerce on WordPress in the immediate and longer term.

Stay tuned throughout 2019 for more info about phase two, and what it means for WooCommerce.

Refresh your store with Storefront - a theme built by WooCommerce for WooCommerce

80 Responses

  1. Run 3
    December 1, 2018 at 8:43 am #

    This is Really a Great Combination. I love this New Block Editor. I’m happy to work with Woocommerce. It helped me to decrease a lot of work for E-commerce people. That is why am loving woocommerce more and more, they are not just a business but a family which helps there customers or rather family grow with this useful tips.

    • Marina Pape
      December 3, 2018 at 3:53 pm #

      Thanks for sharing this. GLad to hear you’re excited about the new editor 🙂

  2. Jyoti Raghuvanshi
    December 1, 2018 at 10:55 pm #

    That’s really great and hope that that everything will be rolled out soon.

  3. Aayush
    December 2, 2018 at 11:40 am #

    Great Combination. will be waiting for this update 🙂

  4. Kili
    December 2, 2018 at 12:10 pm #

    Waiting for this update and I hope you can do it well.

  5. Kevin Steve
    December 2, 2018 at 5:14 pm #

    The cover image thing looks great. It will be really helpful to quickly add images and then overlay the text but any news on the release date?

  6. Nick Weisser
    December 2, 2018 at 8:57 pm #

    Thanks for the nice write-up. I translated it into German on our blog in case anyone prefers to read that in German 😬 https://www.openstream.ch/blog/woo-tenberg/

  7. Prosperi Architecture
    December 4, 2018 at 3:50 pm #

    I am really excited to see this.

  8. Barbara Escher
    December 6, 2018 at 3:58 pm #

    I am just getting ready to begin loading products and getting my online store up and running. Am concerned about the impact of the changes in WordPress on my current theme (Divi) and Woo Commerce set up, which does not use Storefront.

  9. lpestudiocreativo1
    December 6, 2018 at 6:36 pm #

    Ya falta muy poco, espero que supere mis espectativas..!
    No he vista nada ni los Beta para que todo sea sorpresa paa mi

  10. Iftekhar
    December 6, 2018 at 10:02 pm #

    Am I the only one in here who thinks it’s a bad idea and the new editor sucks?! I already started smelling Wix. Damn!

    • tswidler
      December 13, 2018 at 12:13 am #

      No you are not alone. Boy does the new editor suck! I enabled Classic Editor plugin so that I can work normal.

    • Kelly
      December 18, 2018 at 11:58 pm #

      No. You are not alone…

    • Yogi Akal
      December 20, 2018 at 10:14 pm #

      This is THE FUCKING WORST INTERFACE EVER! FUCK YOU WORDPRESS, YOU JUST RUINED MY 30 WEBSITES!

  11. Erik Dattwyler
    December 6, 2018 at 11:54 pm #

    Seems all my sites have a woocommerce bug on the edit order screen
    white screen,
    every site that I have installed WP 5.0 and classic editor plugin

    • mlangis9
      December 7, 2018 at 5:12 am #

      same here

    • atoalizando
      December 9, 2018 at 12:51 am #

      same here

      And I I can’t integrate my store as the plugin warns

  12. Brian G
    December 7, 2018 at 1:57 am #

    I wish WooCommerce could be a standalone ecommerce solution. I hate feeling like at some point in 2021 that I will be forced to use Gutenberg, whether I like it or not.

  13. Ken Chiarella
    December 7, 2018 at 2:30 am #

    I had the same white screen. Install the Classic Editor plugin to fix the issue. The problem is that the blocks will be gone and the point of having this work well with Woocommerce is negated.

    I had to go with the classic editor so that I can post. 🙂

  14. Factoring
    December 7, 2018 at 6:19 am #

    I am recently update into 5.0 but it is not to good.

  15. prsetiadi
    December 7, 2018 at 8:36 am #

    This is disaster.. specially when you use some plugins or extensions.. good luck! I’m staying on WP v4.9.8 never update until they remove GB from the core.. or just switch to another perhaps.. huehue

    • atoalizando
      December 9, 2018 at 12:55 am #

      Agree! Terrible GB!

      I hate Gutenberg, not the one who invented the print, but this editor who is worse than WIX

  16. تالار عروسی
    December 7, 2018 at 10:51 am #

    Hi Claudia,

    It is very bad feature of wordpress 5.0 and I hate it.

  17. Granjacia
    December 7, 2018 at 2:34 pm #

    so the whole store just retruns 500 server error. hope this update fixes it. noone told me about this

  18. Matteo
    December 7, 2018 at 10:52 pm #

    Really cool for my website. <3

  19. Marco
    December 7, 2018 at 10:53 pm #

    Great Update, I hope It could be revolutionary as I think! I’m going to update my website!

  20. Anna Magdelena Harding
    December 8, 2018 at 1:18 am #

    A programmer set up my Websites in WordPress and Woo Commerce and I am unfamiliar with either. He has moved and I can not work either program in the time frame I need, immediately for my new Website for the Christmas market. Can anyone help me?

    • MegaChrono
      December 19, 2018 at 3:53 am #

      In which way can we help you?

    • chris swainhart
      December 19, 2018 at 5:40 am #

      Check out https://rm1.net we have a lot of developers who can help you.

    • Pablo
      December 21, 2018 at 9:00 pm #

      what’s your problem ?

  21. Forex Broker
    December 8, 2018 at 7:22 pm #

    I am totally disappointed with this.

  22. fredsjo
    December 9, 2018 at 1:00 am #

    Looks awesome! 🙂

  23. Anthea Forsdike
    December 9, 2018 at 8:18 am #

    I just updated WordPress to 5.0 as I didn’t see that I had to update the Woocommerce first. Now Woocommerce won’t update. Any suggestions

  24. leonardbianconi
    December 10, 2018 at 2:15 am #

    What if you already have word press 5.0 installed

    • Ral
      December 19, 2018 at 9:43 am #

      Same question. I have a shop that’s WP5.0, but WC not yet updated. What now?

    • Gareth Allison
      December 19, 2018 at 5:14 pm #

      Hi leonardbianconi, thanks for commenting here.

      I answered this question a little further down in this thread – hope this helps.

  25. Mary Rae
    December 10, 2018 at 4:43 am #

    I updated to WordPress 5.0 now my Woocommerce backend is text instead of the regular dashboard. I ran the Woocommerce updater afterwards since I didn’t notice it needed update. Now what? How do I get the regular dashboard back?

    • cyprian
      December 13, 2018 at 12:57 pm #

      i had to downgrade my wordpress back to 4.8
      5.0 is a disaster

  26. Bec
    December 12, 2018 at 3:07 am #

    What happends if you don’t update WooCommerce before you update WordPress to 5.0

  27. Piyush
    December 12, 2018 at 7:08 am #

    If I am installing a new WordPress site and don’t have WooCommerce at all yet, is it possible to upgrade to WordPress 5.0 first and then install WooCommerce? Would that work fine?

    • Jos
      December 12, 2018 at 12:06 pm #

      Yes, no problem.

  28. Pansy D Huffman
    December 13, 2018 at 9:35 am #

    The wordpress 5.0 has been released and so far, even up until now, I still find the block editor very confusing. The best I could come up with was this https://electrictoothbrushes.org (dont mean to spam) and now I am considering going back to the classic editor

  29. cyprian
    December 13, 2018 at 12:58 pm #

    wordpress 5.0 is very complicating
    I had to downgrade back to 4.8

  30. vina
    December 14, 2018 at 7:33 am #

    Interesting, Do not use yet but today i try..

  31. majordoit
    December 14, 2018 at 1:09 pm #

    Hindsight is a wonderful thing. Who thought it would be a good idea to issue a major release just before Christmas this release has caused our WooCommerce site problems with products that have variable choices. The symptoms are you try and add an optional item and find you are then unable to select it when clicking on Add to basket. We have found that if you make the choice and then refresh the page before clicking the Add to basket button it works?

  32. nunah
    December 17, 2018 at 10:22 am #

    If can I upload the description in bulk like in the demo theme?

  33. Kinetichen Klyuch
    December 18, 2018 at 7:47 pm #

    It’s like a completely new system. Very hard to learn. I installed the Classic Editor plugin.

  34. julio
    December 18, 2018 at 8:52 pm #

    Visual editors are being used everywhere before this launch, its not new…visual composer, elementor, all of them very developed and working fine .. lot of mess to include this functionality now… and compatibility issues ..

  35. wdburgdorf
    December 19, 2018 at 9:48 am #

    Has been asked a few times already, no answer yet:

    “it is important that you update to the latest version of WooCommerce before updating to WordPress 5.0”

    Why? What happens when you do it the wrong way round? How to fix it?

    • Gareth Allison
      December 19, 2018 at 5:08 pm #

      Hi there, wdburgdorf – thanks for your comment.

      What happens when you do it the wrong way round? How to fix it?

      That’s a good question.

      When our team was testing WordPress 5.0 with previous versions of WooCommerce (in this case, 3.4.7), they found that the product tags and product categories metaboxes were missing.

      The content in the product data metabox would also disappear when changing product type, proving tricky to bring back.

      Additionally, they noticed product short description and the reviews metaboxes went missing as well.

      Their recommendation here was to:

      • Update to WooCommerce 3.5.1
      • Manually add the snippet found at this link to the functions.php page in your child theme to disable the block editor for products only.

      If absolutely necessary, you could also then install the Classic Editor plugin which disables the block editor for all post types.

      Hope this helps. 🙂

      If you do have any more questions, please don’t hesitate to reach out to our friendly support team by submitting a ticket.

      Thanks!

  36. Ewald van der Hoop
    December 19, 2018 at 11:08 am #

    I am looking forward to working with GB, but am waiting for all the plugins used and the theme to be compatibel.

  37. Jadwal Liga Champions
    December 19, 2018 at 1:43 pm #

    I really like articles and stories in WordPress

  38. sellomasehela
    December 19, 2018 at 3:32 pm #

    hi

    i just want to add woocommerce to my website and use shopping cart, how do i do it, i want to sell items on line

  39. Rose
    December 19, 2018 at 9:10 pm #

    Can you guys please start dating your blog posts? When you talk about new features and features that are in progress, it’s really helpful to know when the post was actually written so we know what stage everything was at at the time of writing and how far past that stage we might be. Yes the “updates” are somewhat helpful but not that helpful without specific dates.

  40. Chazz Layne
    December 20, 2018 at 1:05 am #

    Um…yeah. What a crock of ****.

    Your cute little plugin completely ignores all of the built-in WP Block functionality and styling—rendering it essentially useless unless we want to bloat up our CSS with redundant styling that specifically addresses your stupid class names. You guys know better! All you had to do was match the standard block classes, add a token ‘woo’ class so it can be targeted specifically where necessary, and it would have automatically inherited all of the Gutenberg Goodness (for which you’re clearly unworthy). You do know how CASCADING style sheets work, right?

    If that wasn’t enough, come to find that your answer to Gutenberg compatibility—arguably the best thing to happen to WordPress since…WordPress—is to ripoff the Classic Editor plugin and completely disable ALL Gutenberg functionality on products? Are you ******* kidding me?

    Just when I was starting to think Woo would get their act together, what a disappointment.

    P.S. I echo Rose’s request that you put the dates back in your templates. I know you can’t comprehend why anyone would possibly want to know when an article was published, but the rest of us will find it very helpful.

  41. Daniel Ellis
    December 20, 2018 at 4:22 am #

    Hi

    The website update to 5.02

    And in woocomnerce orders

    All orders is blank and tab called mine is blank some if the others still appears to be there , I think a technical problem needing updating fast

    I have 2 others with same issue all ready

    • Andi
      December 20, 2018 at 5:02 am #

      Got the same Problem! Update 5.02 broke the Orders All Tab. All other tabs work and show orders, but the all tab is completly blank.

    • Meagan
      December 20, 2018 at 6:29 am #

      Same issue. Someone please tell me this is being fixed!

    • bighippo9990
      December 20, 2018 at 1:03 pm #

      Same issue, I found it also affects searching for orders 🙁

  42. sardar aly
    December 20, 2018 at 7:28 am #

    thanking for your informative blogs..one thing i need for my woo-commerce website that is ,, i want to generate reference link after user registration on my website.. like when he share his reference link with his circle then he will get some credit from my website when his friends register using his referral link of my website….

  43. Jadwal Liga Champions
    December 20, 2018 at 2:12 pm #

    It’s very long I don’t understand

  44. jackmejohn
    December 20, 2018 at 4:45 pm #

    Same Issue, Someone please sort out this issue.

  45. Krista
    December 21, 2018 at 8:52 am #

    Not sure which version update brought about this change, but I notice after payment is complete (paypal) and it redirects you to confirmation page – the confirmation page no longer displays Purchase Note or contains the download link for virtual product. Customer has to wait until email is received to see this information.

    Is this a known issue and are there plans to fix it back? Not sure how to fix so Purchase Note and virtual product link displays on Confirmation page after payment… any suggestions??? Thanks

    Running latest WooCommerce 3.5.3 with WP 5.0.2.

  46. John DHax
    December 22, 2018 at 11:43 am #

    I didn’t like WordPress’s new editor the old one was simple and easy to use but anyways I’ve disabled it using a plugin.

  47. mark
    December 22, 2018 at 3:06 pm #

    great read, thanks a lot for posting

  48. Ajab khan
    December 22, 2018 at 5:39 pm #

    I am new there please help me

  49. Jennifer K.
    December 25, 2018 at 7:48 pm #

    Hi there
    Nice update regarding WP latest version. I have a question in my mind that if i upgrade to new version and i am using some other editing plugin will it give any issue to my site?

    Jennifer K.

  50. Eduxpert
    December 26, 2018 at 7:50 am #

    The new block editor is good, but why the front end editors like wp-bakery not work with it? i had to switch back to classic editor because of this problem..

  51. Emmanuel Obarhua
    December 26, 2018 at 1:05 pm #

    Hello, Claudiu;

    Well done. Something you said caught my attention: “We’ve been hard at work getting our Storefront theme ready for WordPress 5.0.”

    That shows commitment and, more importantly, that WooCommerce is fully alive. Well done, once again.

    Compliment of the season,
    Emmanuel Obarhua

  52. Sourov
    December 26, 2018 at 10:34 pm #

    Nice update regarding WP latest version. I really like articles and stories in WordPress
    Thank You .

  53. Robb Fahrion
    December 27, 2018 at 5:35 am #

    Updating to WordPress 5.0 completely took down our PayPal Checkout Gateway. We restored the site before update and now functioning normally again. Anyone else experience this?

  54. Jack Gillman
    December 27, 2018 at 7:15 am #

    I’ve used WordPress for many years now and it works great overall. Personally, I dont like the new editor. I find Gutenberg incredibly confusing and extremely difficult.

  55. Sandra Smith
    December 27, 2018 at 4:34 pm #

    Hi I saw an Add on Facebook for wireless headphones. I purchased a set and paid for it. I received an email of confirmation of payment from Borocchi, at the bottom of the email it has your company name, it says power by WooCommerce. It’s has been almost 2 weeks and have not received anything. I’ve tried to contact them by email and messenger to not avail.
    Not sure if you can help me find out if Borocchi is a legit place or the advertising was a scam.
    I appreciate any help

  56. freebacklinkwebsite
    December 27, 2018 at 11:39 pm #

    I am new to WordPress, so I am learning, however article was very good.

    Below blog shows list of Free Backlink Websites I need to convert it into Word Press :

    Free Backlink Website

  57. john
    December 28, 2018 at 2:33 pm #

    After wordpress is upgraded to 5.02, woocomnerce is version 3.5.3, and the batch import function cannot be used. “Sorry, this file type is not supported for security reasons.” How can I solve this problem?