WooCommerce Tutorial

— A Beginner's Must-Read WooCommerce Getting Started Guide

Naiba has frequently encountered users ofWordPress Website Buildingwho stumble in WooCommerce design, so this WooCommerce tutorial has been updated, hoping to help beginners avoid detours.

First, it's essential to clarify that using WooCommerce can build a B2C online store, or it can be used for a B2B standard product inquiry website.

Correction of Common Beginner Misconceptions

Misunderstanding 1

B2B websites cannot use WooCommerce because it's for online stores.

This understanding is inaccurate. WooCommerce is indeed for online stores, but in reality, by removing its sales functions, it can also be used purely for product management and display, applicable to B2B websites.

Misunderstanding 2

Using WooCommerce necessarily requires using Elementor Pro to design the product page layout yourself, otherwise it won't meet your needs.

Actually, for many beginners, using Elementor Pro to create a WooCommerce layout is much more difficult than adjusting the default layout. A normal B2B website can be achieved directly with WooCommerce's default template. We often encounter situations where users have problems creating product layouts with Elementor Pro and then ask Naiba how to solve them.

WooCommerce Installation Tutorial

WooCommerce is a Plugin under the WordPress platform, so the installation method is the same as other plugins. You just need to search and install it in the Plugins section of your WordPress Admin Dashboard.

WooCommerce安装教程

Activate the plugin after installation.

Woocommerce教程

After installing and activating WooCommerce for the first time, you will be redirected to a setup wizard interface. If you have B2C needs, just follow the wizard to complete the setup. If you are a B2B user, you can simply skip it.

WooCommerce Product Categories

After installing WooCommerce, we need to go to the Products menu in the Admin Dashboard to create product categories, as shown in the image below:

When creating a product category, fill in the Name, select whether a Parent category is needed, and then add it.

WooCommerce Add Product

After creating product categories, we can upload the first product. Click Add New under Products.

Then fill in the product title, description, category, and images before publishing.

Refer to the annotations in the two images above and below for the specific fields to fill in.B2B clients will not see the cart button as long as they do not fill in the product price.If the cart button still appears with the Theme you are using, please refer to this article:Several Methods to Delete and Hide the WooCommerce Add to Cart Button

After publishing, you can visit the product's Frontend page to check the result.

WooCommerce B2B Product Customization

1. How to remove the 'Add to Cart' button?

Normally, not filling in the product price in the Admin Dashboard will hide the cart button. If your Theme doesn't work, you can trySeveral Methods to Delete and Hide the WooCommerce Add to Cart Button

2. How to add an inquiry button where the cart button is?

Refer toHow to add an inquiry button below the WooCommerce add to cart button?

3. How to remove the Reviews tab?

Woocommerce教程

In WooCommerce settings, find Products, then uncheck the option for Reviews and it will be gone.

4. How to insert a table on the detail page?

Copying and pasting directly from Excel is the easiest, or you can refer to6 Methods to Add Tables to WordPress

5. How to add several more tabs on the detail page to separately display parameters or download resources?

Search in the backend Plugins forCustom Product Tabs for WooCommerceThen install it. After that, when creating a new product, you will see the option for new tabs in the Product Data section. Add as many tabs as you want.

How to view the product archive page on the website Frontend?

Many people don't know how to bring up the default product archive page, wondering if they need to use Elementor Pro to create a product template page. Actually, you just need to do this.

WooCommerce商城页面

By default, after installing the WooCommerce Plugin, a shop page named 'shop' is automatically generated and set.

At this point, you just need to add the link of this page to your navigation Menu, and you can access the shop page by visiting this URL.

In the backend Pages, create a new page, name it 'Products' or any other name you prefer, and publish it directly.
In WooCommerce settings, find Products, then select the page you just created as the Shop page and save.

woocommerce商店页

How to create a product archive page for a specific category?

You don't need to create a separate product category archive page using the Pages section either. Simply switch to the backend Product Categories, hover over the category name, and there will be a 'View' link. Copy that link.