Learn How To Use WooCommerce and WordPress to Set up Your eCommerce Website

Doing your business online has become so easy that one could just hit the ground running from the start, thanks to WooCommerce plugin software.

By the way, WooCommerce is a free plugin that is simple and straightforward in application to use. In other words, using it is not a rocket science…you just hit the ground running with it.

Using WooCommerce to start your online store or business is the best way to turn your WordPress website into a fully functional eCommerce store without breaking a sweat.

There are a whole lots of other eCommerce softwares, and plugins. However, WooCommerce beats them all.

The following below are my reasons for recommending WooCommerce plugin for you:

  • WooCommerce is free and open-source – just similar to WordPress.
  • It’s the most popular and widely used eCommerce plugin for WordPress powered sites out there.
  • It is not a rocket science setting it up, you can set it up and configure it by yourself.
  • The setup is fast. Usually, it’s just a matter of an hour.
  • It works with any design/theme you currently have on your WordPress site – you don’t need to ditch your current website design.

We could continue with the list above, but instead, let me just say that it simply gives you all you could ever need for building a high-quality eCommerce store with WordPress.

NB: In this how to setup WooCommerce tutorial, I’ll show you (step-by-step) how to set up an online store using WooCommerce and WordPress where you can sell both physical and digital products/services.

 

What You Can Sell WordPress Using WooCommerce?

As far as eCommerce is involved, there are many options to explore using WooCommerce, for example:

  • Digital products (e.g. software, game downloads, e-books)
  • Physical products (clothes, Shoes, etc.)
  • Services (tutoring online, and collecting paid subscription fees)
  • Bookings (e.g. for appointments, hotels, flight, etc.)
  • Selling of other people’s products – as an affiliate

Whichever way you choose, you can always make money with your website.

Provided there is a price tag on anything, I can comfortably say that WooCommerce gives you the freedom to sell anything, and anyone can use it irrespective of location.

 

Steps On How to Build an Online Store With WordPress and WooCommerce

 

Step 1. Get a Domain Name and Web Hosting

In order to start an online store or any other type of websites, you’re going to need two things that are indispensable:

  • A domain name is your store’s unique address on the web. Something like YOURSTORE.com
  • Web Hosting is basically a remote computer that stores your website and then serves it to whoever wants to visit it.

There are hundreds of different hosting/domain providers. I suggest you carry out a research online. You know what is up…?  Google is your friend.

Hopefully, after your research online, you will have found befitting Domain name registrars, and hosting providers to work with.

However on webhosting of your store, most web host services start on the average of $2.75/month billed cumulative over 6 months or a year intervals.

For details on how to go about this step, I have you covered, checkout the front page of this site to see the: How to create a website guide that I have for you..

Similarly, do checkout also this guide on: How To Register A Domain Name

 

Step 2. Install WordPress (FREE)

Here, installing the WordPress software is straight forward. Like I stated above, I have covered it in details on: How To Create A Website Free Of Cost.

You can find it on the front page of this website

 

Step 3. Install WooCommerce Plugin (FREE)

Like with all WordPress plugins, the fun starts by navigating to your WordPress Dashboard -> Plugins -> Add New.

Once there, type “woocommerce” in the search field. You’ll see it as the first result:

woocommerce install

 

Just click the “Install Now” button next to the plugin.

In a couple of seconds, the text on the button will change to “Activate.” Go ahead and click it.

After the plugin is activated, you will see a “WooCommerce” option in the left sidebar. Click on it and you’ll find the following on-screen setup page.

WooCommerce setup

 

Now, Let’s go through these below steps together to ensure proper configuring.

 

Store Details

This is quite self-explanatory. You just have to fill in your store’s information and that’s it.

WooCommerce store details

Once you’re done, click “Continue”.

 

Industry

Next, you have to pick out in which industry does your store operate (you can choose several options).

online store industry

 

Click “Continue” once you’re done.

 

Product Types

Now is the time to choose what kind of products you’re going to be selling. You can choose between physical products, subscriptions, downloads, bookings, and many more.

WooCommerce product type

Once again, you’re able to pick several options.

 

Business Details

When you’re done with selecting product types, it’s time to move on to business details.

Here you have to note down how many products are you planning to sell and whether you’re already selling elsewhere.

WooCommerce business details

If you’re just starting, you can start by choosing “I don’t have any products yet”.

In the “Free features” tab you can enhance your store with free extensions that WooCommerce offers.  All of them are pretty useful, so there will be no harm done if you decide to pick all of them. (More on that later.)

 

Theme

By default, WooCommerce works with any WordPress theme. This is great news especially if you’ve already picked your design and you want to stick with it.

Alternatively, you can go with special WooCommerce-optimized themes. Those themes come with pre-set styles that will make it easier to visually integrate these into your website.

The official WooCommerce theme – and the one that’s the most likely to work properly – is called Storefront. The default version is free, and it should be enough to get you going.

WooCommerce choose theme

 

Regardless if you’ve decided to stick with your current theme or have gone for something new and WooCommerce-optimized, what you need to do is to make sure that the individual pages of the store look good.

Once you’re done with the setup, you’ll have access to the store checkup list that includes the most important tasks that you have to do in order to get your online store ready and running.

Store Checkup List

 

You can also skip this by clicking on the “Hide this” button and just start editing your store in your own way.

 

Step 4. Choose a Payment Gateway, Currency, Shipping, and Set Up Taxes

First thing first, I will take you through the process of payment options integration before delving into the stocking of products on the online store

Lets talk about payment gateways.

 

Choose A Payment Gateway

The bedrock of any eCommerce store is being capable of accepting payments from customers online, no matter their geo-location.

Starting up in this regard, please go to WooCommerce -> Settings -> Payments.

WooCommerce payment methods

As I stated somewhere above, WooCommerce integrates several payment options.

However, the two most popular payment options or methods are PayPal and Stripe. Although, there are so many other options aside these two.

It’s highly recommended that you integrate your site with these two payment options. Reason being that many people are familiar with PayPal and Stripe.

NB: You must install PayPal, and Stripe Plugins separately.

In case you wish to install other payment methods do so here. In fact, there are going to be even more options available later on in your WooCommerce settings panel.

However, one of the notable options is WooCommerce Payments, developed by WooCommerce itself.

NB: You must signup to the services of PayPal, and Stripe separately in other for online payments to work. The setting up of WooCommerce are only for integrating your existing PayPal and Stripe accounts with your new eCommerce website.

 

Understand Sales Tax and Define Currency

Many people hate paying taxes. Unfortunately, they cannot run away from it, and eCommerce industry has taken cognizance of that and have made sure that WooCommerce takes care of this making tax payment easily.

Because, some countries have strict laws against tax evaders. Your transactions may not work in those countries if you did not tick the WooCommerce setting Box that enables payment of taxes where it applies.

To do this, first, go to WooCommerce -> Settings – > General.

Then tick the “Enable tax rates and calculations” box as can be seen below.

Online stores enable taxes

Once you are through with this, scroll below to define your currency options and save your changes.

online store currency options

 

Start configuring the taxes. For the configuration go to WooCommerce Settings -> Tax.

As can be seen from the screenshot interface below, the Tax tab has several configuration options that you can choose from and that fit your needs.

WooCommerce tax configuration

NB: Even though WooCommerce will pre-fill the tax settings for you, you still need to double-check with your local authorities what the actual current taxation rules are, especially if you’re not in the US.  Learn more about WooCommerce’s way of handling sales taxes. You can change everything later, so don’t worry if you’re not sure about the rules right now.

 

Shipping

Shipping is very crucial in running online store. Particularly, when running on larger scale and wider coverage of Geo-locations.

If you sell physical products, it is expected that you expedite action towards delivering those products to your customers as quickly as possible once orders have been placed.

Your delivery of the ordered products must be safe and affordable also.

To integrate/set up shipping, go to WooCommerce -> Settings -> Shipping.

Shipping

 

While setting up shipping, you can set shipping zones and classes, set fixed prices, and offer free delivery, etc.

In addition, you can define shipping destination options and also enable the shipping calculator on the cart page.

You can even migrate live and updated rates from common carriers like FedEx and UPS.

Furthermore, if you want to set up a dropshipping option; you have no problem for WooCommerce has an extension that helps to manage your dropshipping account effortlessly.

 

Step 5.  Build Your Store

Your online store will take form here. Because, you will start building your online store from here (in this step).

However, before you go ahead with adding of your products, you must create some suiting pages that are in tandem with what you sale – your products.

While creating pages is good, there are certain pages that are must-have for every functional online store. These pages are very important if you want your store to excel. They are:

  • Home Page – Make it beautiful, and click-attractive
  • About Page – Where you tell the world what your online store is all about
  • Contact Page – Must include your email, Business Phone Numbers, and Physical Address
  • Privacy Policy Page – You tell customers what you do with their data.
NB: Some pages like, Cart, Checkout, Shop, and My Account pages were already created for you by default during the installation and setup stage.

 

Add Your Products or Services

Before you can call your store a functional store, you need to stock up some products in the database. This could be services, or downloads, or whatever it is that you want to sell.

To start working with the products is to go to WooCommerce -> Add Products -> Start with a template.

Alternatively, you can go to Products -> Add New.

WooCommerce add products with template

 

Hope you are already familiar with the screenshot below? For, either way, what you’re going to see is a classic WordPress content editing screen:

adding online product

 

Let’s go over one-by-one concerning what you have to fill out:

Product name

  1. The main product description. This large field allows you to enter as much info about the product as you wish. Since this is WordPress, you can put not only simple text there but also images, columns, headings, even videos, and other media. Basically, whatever you see fit.
  2. The central product data section. This one is where you set the type of product that you’re adding, and whether it’s a physical, a downloadable, or a virtual product (services are considered virtual products too). As part of this central section, you also get tabs for various parameters of the product:
    • General. This is where you get to set the pricing and taxes.
    • Inventory. WooCommerce allows you to manage stock levels.
    • Shipping. Set the weight, dimensions, and cost of shipping.
    • Linked Products. Great for setting upsells, cross-sales, etc. (Think, “Customers who bought this also bought that.”)
    • Attributes. Set custom product attributes. E.g., if you’re selling shirts, you can set alternative colors here.
    • Advanced. Additional settings. Not essential.
  3. Short Description. This is the text that gets displayed on the product page under the name. Works best as a short summary of what the product is.
  4. Product Categories. Group similar products together. E.g., “hoodies.” It works just like the standard WordPress categories.
  5. Product Tags. This is an additional way to help you organize your database of products. It works just like the standard WordPress tags.
  6. Product Image. The main product image.
  7. Product Gallery. Additional product images to showcase their awesomeness.

After setting up all of the above, click on the big “Publish” button and your first product has just been added!

In addition, after adding a handful of goods to your database, the products section in the dashboard should look something like this:

woocommerce products

 

Step 6. Make Your eCommerce Store Design User Friendly

Look is equally important and should be taken seriously when creating an eCommerce website. Your online store should be good looking and aesthetic.

In other words, design is key. Before, I go in details, lets discuss some important stuffs that make an eCommerce store look good, and aesthetic.

Below, are some of the important parameters:

  • The design needs to be clear and not confusing in any way. Moreover, people cherish good looking website. If a visitor dislikes your store, he may bounce off, and may never return.
  • The center content block or front page content needs to grab the visitor’s attention the moment they storm your site. The center block is where the products will be displayed.
  • Adjustable sidebars. Decide the number of sidebars, and also disable the appearance of sidebars for some pages, particularly, the front page.
  • Responsive and mobile-optimized Store. Endeavor to optimize your online store for mobile devices. This is important because 60% of online visits to most websites are from mobile devices. If you fail with regards to this, you will have yourself to blame.
  • Good navigation structure. Always make your menu bold and elaborate enough for proper, and swift navigation of your online store. It will help them in finding what they are looking for.

Now with the above in mind, here’s what you can do with the individual pages of the store:

 

Your Shop Page

This is your main products listing page. However, if you’ve gone through the WooCommerce setup wizard, this page can be found at YOURDOMAIN.com/shop

WooCommerce shop page

This is a standard WordPress page – you can edit it by clicking on “Customize” located in the header.

Below are the things that are worth doing:

  • Add some copy that will entice, and encourage your visitors to shop with you.
  • Decide to have a sidebar on the page or not. This is done following Widgets -> Sidebar.

You can explore many opportunities to make your shop page look good and help you can customize it according to your needs.

Just take your time and carefully try out different styles to find the perfect fit.

WooCommerce customization options

Do understand that the main trait of the Shop page is that right below the standard content, it features a custom part where it displays your product listings.

This is what it looks like on the Storefront theme after you added some text and removed the sidebar:

woocommerce shop page

As you can see, good product images and design choice are the key to success. Remember, first impression last longer. In this case, this is your customer’s first impression about the products on your online store and it should be attracting!

In other words, devote time, energy and resources to ensuring that your products images appear great and appealing to your visitors. 

WooCommerce also enables you to display your products in alternative ways on this page as can be seen below. For that, in the left sidebar, go to WooCommerce -> Product Catalog.

WooCommerec products display

 

You are at liberty to choose whether you want to display individual products or product categories on the Shop page. Select whatever makes the most sense for you while having your visitors also in mind. Then save settings.

 

Shopping Cart

This is another crucial page that has to be adjusted is Cart.

I recommend you go for the full-width layout (for Widgets -> Sidebar).

You wouldn’t want to give the buyer too many options on this page, apart from asking them to proceed by clicking on checkout button.

woocommerce cart

 

Checkout

This is from where you would reap the benefits of your handwork. Because, your customers must click the checkout button before you can earn.

However, if your customers do not click on this, you wouldn’t make any sale, talk more of making a single cent as a profit. Therefore, it is not just crucial, but also the most important page on your store.

In other words – checkout is perhaps the most important page of them all. It’s the page where your buyers get to finalize their orders and make the payments.

I don’t actually encourage you to do any tweaks to that page apart from one:

In terms of Appearance, the Checkout page absolutely needs to be full-width. 

The only acceptable way out of the checkout page is to encourage the buyer to hurry up and finalize their order, and nothing more.

Please do not bug nor your distract your customers by adding an unnecessary sidebar.

To achieve this, just repeat the process you went through with the Shop and Cart page.

Apart from that, the default look of the Checkout page is great:

woocommerce checkout

NB: Completing the step number 6 above, you have basically adjusted the design of your store. However, I shall talk briefly about the possibilities of extending your store’s functionality, and that would come as step number 7.

 

Step 7. Extend WooCommerce

One more thing that makes WooCommerce such an impressive eCommerce solution is that there are hundreds of free and paid extensions and plugins available.

Let’s list some of the most useful ones:

WooCommerce Extensions

Let’s start with the extensions – the official add-ons that have been approved by the WooCommerce team.

That catalog is truly impressive and vast. We don’t want you to feel intimidated by it. You certainly don’t need all of those extensions. Also, the good news is that some of the useful extensions were already installed during the setup process, remember?

 

Marketing

 

Shipping, Payments, and Taxes

  • Payment gateways. These extensions allow you to accept more payment methods on top of the standard PayPal. In general, the more methods of payment you can afford to accept (those gateways are often paid), the better.
  • Shipping extensions. These are going to be handy if you want to automatically integrate your store with the official shipping rates from companies such as UPS or FedEx.
  • Accounting extensions. Integrate your WooCommerce store with the accounting tool of your choice.
  • WooCommerce Bookings. Allow customers to book appointments for services without leaving your site.
  • WooCommerce Subscriptions. Let customers subscribe to your products or services and pay a weekly, monthly, or annual fee.
  • EU VAT Number. For those operating within the EU.
  • TaxJar. Put your sales tax on autopilot.

Alternatively, if you don’t want to spend any money on new extensions, you can browse around in the free category. There’s more than enough stuff to keep you occupied.

 

Plugins That Supercharge Your eCommerce Store

Setting the extensions aside, you can also use other WordPress plugins to further supercharge your store. Here’s what you should get:

Wrap-Up: How to Use WooCommerce for Online Store

As you can see, the degree of difficulty when it comes to creating your own eCommerce store with WordPress isn’t high, but it will still take you a while to get through all of the steps above – probably an afternoon or two.

That’s still incredible considering that just, say, ten years ago you would need to hire a developer and pay them north of $5,000 to get something similar created. Now you can do everything yourself!