Blog

Let’s begin with the understanding that you can not use regular JavaScript when creating blocks for Gutenberg. Well, you could try that but the code will be hardly readable. Believe me, I know what I’m talking about because I started learning blocks in 2019 with regular JavaScript without using what I am going to show you in this tutorial.

In this lesson we are about to create a project for our custom Gutenberg block and configure the development environment using @wordpress/scripts tool. This tool is what I use personally when I create any blocks either for my plugins or for my client projects.

In this tutorial I would like to share with you a ready to use example how you can sync WooCommerce products and variations inventory with a CSV file automatically.

Our CSV file is going to look like this:

To make this tutorial a little bit simpler we are going to put the file in the WordPress uploads folder, but for sure you can create a WooCommerce settings page where you can upload it.

When you turn the option “Manage Stock” on for your WooCommerce products (or variations), then every time an order is made, stock quantity of the products from the order is going to be automatically decreased.

But sometimes you don’t need that, or just need it for specific order statuses or payment methods. In this tutorial I will show you how you can do that.

In this tutorial I will show you how you make both Stock Quantity and Stock Status to be automatically shared between different products on your WooCommerce store. But if you come to this tutorial looking for a product inventory synchronisation tool between different WooCommerce stores, then please take a look at my plugin.

Also I am going to show you an example with variations of the same product.

The whole idea is pretty simple and can be breaked down into two steps:

1. Creating a custom function connected either to the woocommerce_product_set_stock or to the woocommerce_variation_set_stock action hook if we talking about variations.
2. Obtaining the connected products and to setting the same stock values for them.

Easy peasy.

Since I’ve been working a lot lately with synchronising product stock quantities between multiple WooCommerce stores or within a WordPress Multisite network, I can share with you some interesting insights how it is working.

Recently I was developing vertical alignment controls for my carousel block and decided to share the process with you. Especially since there is not a lot of information about vertical alignment, but tons of tutorials about wide and fullwidth alignment.

Here is how it looks:

Quite recently I was guess what – working on my Simple Inventory Sync plugin and I was needed some kind of functionality that allows to push the actual product stock quantity to all substores via WooCommerce REST API (and that’s why it should be doing it in the background).

And I think that to create a tool in WooCommerce > Status > Tools is the most seemless way to implement that functionality.

For me it is still doesn’t make any sense why plugin developers overload WordPress admin menu with tons of settings when you can use build-in UI for that. Well, this is another story.

Here is a status tool we are going to create in this tutorial: