Woocommerce Setup Tutorial

In this Woocommerce Setup Tutorial, we will explain how to build your WordPress website into an eCommerce site using Woocommerce, a powerful WordPress plugin.

The Woocommerce setup tutorial will demonstrate the setup of the entire eCommerce process including shopping cart page and checkout page, and online payment methods (i.e. PayPal and Stripe for credit card payments) with Woocommerce on WordPress.

WordPress + Woocommerce:

• Enables you to develop and launch an online shop with your own purchased domain name and on your chosen web hosting service.
• Lets you quickly extend your WordPress site with new features and publish many more products when your online business scales up.

An eCommerce website that are developed with WordPress is highly SEO-friendly. Refer to mobile SEO best practices for tips optimize your website’s SEO.

Below are the topics in this Woocommerce Setup Tutorial:

• Woocommerce Preparation List
• Install Woocommerce Plugin
• Woocommerce Settings
• Create Product Page
• Simple Product
• Grouped Product
• External/Affiliate Product
• Variable Product
• Set Up Online Payment Methods
• Set Up PayPal Payment Method
• Set Up Credit Card Payments with Stripe
• Set Up Other Payment Methods (Alipay and WeChat Pay)
• Set Up Woocommerce eCommerce Pages
• Map All Pages in Woocommerce
• Conclusions

Woocommerce is a WordPress plugin. Before installing and using Woocommerce with your WordPress site, you will first have to complete the steps below.

Step 1

Purchase a web hosting to host your website. Siteground, Hostgator, etc are some of the web hosting service providers.

Step 2

Register a domain name. Your eCommerce website needs your own custom domain name.

Step 3

Install WordPress on Siteground, Hostgator, or your choice of web hosting.

Step 4

Enable SSL on your website by installing a SSL certificate. SSL helps securing your website, and is a SEO ranking factor for your site.

Step 5

Install a WordPress theme. You may refer to OceanWP Theme Tutorial before installing the OceanWP theme.

Log in to your WordPress admin area.

Click Plugins at the left side menu, and select Add New from the sub-menu.

On the Add New Plugins page, enter Woocommerce in the keyword search.

The Woocommerce plugin will appear in the search results.

Click Install Now, and then click Activate.

Or you can download the Woocommerce plugin directly from the official Woocommerce page, or WordPress.org.

https://wordpress.org/plugins/woocommerce/
https://woocommerce.com/

When Woocommerce is activated on your WordPress website, you may choose to continue the Woocommerce setup.

If you click the Yes please button, you will enter the Woocommerce Setup Wizard process.

The Setup Wizard consists of 5 steps:

• Store Details
• Industry
• Product Types
• Business
• Theme

Store Details

Enter your business address, including:

• Street address
• Country/region
• City
• Postal code

Click Continue.

Industry

You must select an industry for your WordPress website, including:

• Fashion, apparel, and accessories
• Health and beauty
• Art, music, and photography
• Electronics and computers
• Food and drink
• Home, furniture, and garden
• Education and learning
• Other

Click Continue.

Product Types

Select one or more product types:

• Physical products
• Downloads (e.g. eBooks)
• Subscriptions
• Memberships
• Bookings
• Bundles
• Customizable products

Some product types may require you to install additional paid WordPress plugins.

Click Continue.

Business Details

You will be asked 2 questions:

How many products do you plan to display?
Currently selling elsewhere?

Woocommerce Setup Wizard assumes you want to have the following plugins installed.

• Facebook Ads
• Google Analytics
• Mailchimp

If you do not want to have any of the above installed, you can uncheck.

Click Continue.

Theme

You can select a theme for your WordPress site. Woocommerce has made some themes available for installation.

If you do not want to install a new theme at this stage, click the Skip this step link (at the bottom of the page).

At an later stage, you can install one of the powerful WordPress themes, such as OceanWP. Refer to OceanWP Theme Tutorial for installation and setup of the OceanWP theme.

Complete Woocommerce Setup Wizard and Continue

You will be asked if you want to have JetPack plugin installed. You can click No thanks to skip the installation.

You will have to continue the Woocommerce setup, including:

• Add products
• Set up payments
• Set up tax
• Set up shipping
• Personalize the store

In Woocommerce settings, you will see these tabs:

• General
• Products – Create Product Page
• Shipping
• Payments
• Accounts & Privacy
• Emails
• Advanced

General

When you have opened the Woocommerce Settings page, you will be default to the General tab.

Store Address

Under General, enter the physical street address of your business.

General Options

Specify the selling location(s) of your WordPress site. You may choose all countries, include one or several specific countries, or exclude one or several specific countries.

Specify the shipping location(s). You may choose to ship to all countries (in the world), include shipping to one or several specific countries, or exclude shipping to one or several specific countries. You may even specify no shipping is required.

Specify default customer location.

Currency Options

Choose the currency for your WordPress site.

If you are selling products to Hong Kong customers, you will choose HK$ as the currency.

To display and sell products on your WordPress website, you must create at least 1 product page.

Below are the different types of product page that you can create with Woocommerce.

• Simple Product
• Grouped Product
• External/Affiliate Product
• Variable Product

You can create a single product page with Simple Product in Woocommerce.

In this Woocommerce setup tutorial, we will create a Simple Product, and enter all the information of the product.

Click Woocommerce at the left side menu. Click Products. Click Add New. It will open a new page for you to create a new product (or a Simple Product, in our case).

Enter product title and description

Enter the product’s name (i.e. title) and description.

Select Simple Product

Under Product Data, select Simple Product, if it is not already selected as default.

Enter product price(s)

Enter your product’s price in the Regular Price field.

Enter your product’s discounted price in the Sale Price field.

Enter product short description

You may want to enter a short description. This allows your product to show additional text information for your customers.

The product short description is an optional field.

Add product photos

Customers always look at product photos before they can make decisions to buy your products.

Under Product Image, click the Set product image link, and upload at least 1 product photo.

You can always come back to upload more photos.

Publish product page

When you click Publish, your product will go live on your WordPress website and will be available for your customers to buy.

If you want to group multiple products into a bundled product and sell this bundled product as one product on your WordPress site, you can create a Grouped product in Woocommerce.

Below are the steps to create a Grouped Product:

• Create a Simple Product page in Woocommerce, and set a price.
• Create a second Simple Product page, and set a price. You may continue creating more Simple Product pages, but two Simple Product pages will be sufficient for this example.
• Create a Grouped Product page.
• Add all the Simple Products to this Grouped Product.
• Set a price to the Grouped Product.

All the Simple Products that are added to the Grouped Product have their individual Simple Product page URL.

Create Grouped Product page

Under Product Data, select Grouped Product.

Click Linked Products.

In the Grouped products field, enter the name of the Simple Product that you have previously created.

Add all the Simple Products (that you want to group together) to the Grouped Product.

Click Publish to publish the Grouped Product page.

If you are not selling your own product, but you are selling products of other websites, you can create an External/Affiliate Product in Woocommerce.

To create an External/Affiliate Product, select External/Affiliate Product under Product Data, and enter the product’s information.

When your website visitor opens a page that shows an External/Affiliate product, and clicks on the product, this visitor will be taken to another website (i.e. the original product owner’s page).

Refer to Affiliate Marketing Blog to find out how affiliate marketing works.

Simple Product is unable to let you show multiple variations of a product on one page.

You may create multiple variations of a product under a Grouped Product. But the best practice is to use Variable Product.

For example, a laptop computer may have 3 color variations in black, blue, and white. In this case, you will only have to create 1 Variable Product, and add all 3 color variables to this Variable Product.

To create Variable Product, select Variable Product under Product Data, and enter the product’s information.

All the variations of the same product will share one single page URL on your WordPress site.

Your eCommerce site must provide online payment options for your customers to pay for the purchased products online.

You will set up (or enable) the online payment methods (e.g. PayPal, credit cards, etc) through Woocommerce.

In this Woocommerce setup tutorial, we will demonstrate how to set up PayPal and Stripe (for credit card payments).

• Set Up PayPal Payment Method
• Set Up Credit Card Payments with Stripe
• Set Up Other Payment Methods (Alipay and WeChat Pay)

You must set up payment methods/options in Woocommerce, before your website visitors and/or customers can make payments on your WordPress site.

To receive payments from your customers through PayPal on your WordPress website, you must own a PayPal account.

You can sign up a new PayPal account at the official PayPal site:

https://www.paypal.com/

Click Woocommerce at the left side menu, while you are in the WordPress admin area.

Click Settings, and you will be taken to the main page of Woocommerce.

Click Payments from the top menu, and you will be shown a list of payment options/methods available with Woocommerce.

One of the default payment options/methods is PayPal. Enable PayPal Standard.

Check the Enable PayPal Standard checkbox.

In the PayPal email field, enter the email address that you have registered with PayPal.

Click Save changes.

To enable your customers to pay with credit cards on your website, you will have to:

• Sign up a new Stripe account.
• Install a WordPress plugin that can integrate Woocommerce and Stripe payment option.

Sign Up Stripe

Register a new Stripe account at the official Stripe website:

https://stripe.com/

Install Woocommerce Stripe Payment Gateway (WordPress plugin)

Click Plugins, and select Add New from the left side navigation while in the WordPress admin area.

Enter Woocommerce Stripe Payment Gateway in the plugins keyword search.

When Woocommerce Stripe Payment Gateway appears in the Plugins search results, click Install Now, and then click Activate.

Set Up Stripe Payment Method

Click Woocommerce on the left navigation in the WordPress admin area.

Click Settings to open the Woocommerce Settings page.

Click Payments from the top menu, and you will be shown a list of payment options/methods available with Woocommerce.

We have installed the Woocommerce Stripe Payment Gateway plugin. Now Stripe is available as a payment option/method.

Check Enable Stripe.

Click Manage to open the Stripe Settings page.

On the Stripe Settings page, check Enable Stripe. This will make credits cards (through Stripe) available as a payment option at the checkout page of your WordPress/Woocommerce website.

Fill in Title and Description.

• Enter Credit Cards in the Title field.
• Enter Pay with credit cards in the Description field.

With the Woocommerce Stripe Payment Gateway plugin, you can first test by making an online payment under the Test Mode.

When the test is successful, you must switch the Stripe payment option to Live Mode.

Get/copy the Live Publisher Key and Live Secret Key from your Stripe account. Paste both keys on to the Woocommerce Stripe Payment Gateway plugin.

Disable Test Mode (which is only for testing).

Click Save changes.

Your online store may have China customers who prefer making online payments through Alipay or WeChat Pay. You have different options to make Alipay and/or WeChat Pay available as payment methods on your WordPress/Woocommerce website. You may:

• Set up one of the WordPress plugins that will integrate with Woocommerce to accept Alipay and/or WeChat Pay payments.
• Develop your own app (or WordPress plugin) to connect through APIs that are provided by Alipay and/or WeChat Pay.

The Woocommerce setup best practices include creating and setting up the these important eCommerce pages:

• Shop page
• Cart page
• Checkout page
• My Account page
• Terms and Conditions page
• Privacy Policy page

Shop page

In your WordPress admin area, create a new page, and name the page Shop.

Add this shortcode to the page in the text editor, and publish the Shop page.

[products]

Cart page

Create a new page, and name the page Cart.

Add this short code to the page in the text editor, and publish the Cart page.

[woocommerce_cart]

Checkout page

Create a new page, and name the page Checkout.

Add this short code to the page in the text editor, and publish the Checkout page.

[woocommerce_checkout]

My Account page

Create a new page, and name the page My Account.

Add this short code to the page in the text editor, and publish the My Account page.

[woocommerce_my_account]

Terms and Conditions page

Create a new page, and name it Terms

Add the text content of terms and conditions in the text editor, and publish the Terms page.

Privacy Policy page

Create a new page, and name it Privacy.

Add the text content of privacy policies in the text editor, and publish the Privacy page.

You will have to map all the pages you have created to Woocommerce.

In Woocommerce Settings, click Products.

Click to open the dropdown menu list that is next to Shop page.

Select the Shop page, and click Save changes.

In Woocommerce Settings, click Advanced.

In each of the dropdown menu list under Page setup, select the pages to match the names next to them, including:

• Cart page
• Checkout page
• My Account page
• Terms and Conditions page

Click Save changes.

Under Settings (at the left side main menu), click Privacy.

Once you have opened the Privacy page, select the Privacy Policy page from the dropdown list.

Click Use This Page to save your changes.

Why using WordPress and Woocommerce together?

WordPress lets you create all the required pages of your website.

Woocommerce gives your website the core capabilities of an eCommerce site.

Except WordPress + WooCommerce, you may also use other methods (or platforms) to create your eCommerce website.

Both Shopify and Shopline provide readily features to create eCommerce websites (or online shops). With Shopify or Shopline, upload and display product information, and accept online payments from customers. Refer to this Shopify setup checklist.

Whether your eCommerce website choice is WordPress + Woocommerce, Shopify, or Shopline, most commonly used online payment methods (e.g. credit cards through Stripe, PayPal, etc) will be available to your customers.

With WordPress + WooCommerce, you are required to pay for annual web hosting fee, and other fees (if you use any paid WordPress plugins).

But with Shopify or Shopline, you need to pay for the annual fee for using the platforms (i.e. Shopify or Shopline). Additionally, you may have to pay for several very expensive apps to enhance necessary features for your Shopify or Shopline website.

Often your overall cost will be lower with WordPress + Woocommerce when creating and maintaining an eCommerce website.

I have written the Chinese version of this Woocommerce Setup Tutorial / Guide.

• Elementor Form Builder Tutorial
• Switch to Classic Editor (WordPress Plugin)
• Install Google Analytics on WordPress
• Enable Wordfence 2 Factor Authentication
• Deactivate WordPress Plugins