woocommerce shopping store

Build Online Store: WordPress + WooCommerce step by step guide 2019

Last updated by Sanjay Howale

woocommerce shopping store

WooCommerce is most popular open source ecommerce technology.

According to BuiltWith, WooCommerce now powers 25% of eCommerce websites around the world. It has 7+ million downloads till now.

WooCommerce_Market_Share

As Ecommerce sales are booming and if you’re looking to open online shop, going with WooCommerce is one of the best decisions you could make. Powering your ecommerce store with WooCommerce is most reliable, cheap and easy to manage.

Here I’m going to explain you, “how to create ecommerce store using WordPress and WooCommerce step by step”.

So, let’s get started.

To create an ecommerce site, you need a hosting plan and a suitable and attractive domain to your niche business.

Then how to choose your site name? Here are the few tips.

  • Choose your name wisely based on your niche and product category.
  • Choose the name which is unique and easy to pronounce. Never pick a tongue twister as those names are very tough to remember.
  • Once you decided name, search domain availability on that. BlueHost is one of the best and affordable hosting and domain providers.
  • .COM or .ORG are the preferred domain names. Avoid using .info or .net because they tend to rank bad in search engines. Also try to avoid using long name. Try to make it as simple as possible, so people can remember and easy to share with others.

An attractive domain name and unique niche will get more shares.

Step 1:  Purchase Domain and Hosting from [BlueHost].

If you purchase a hosting from BlueHost they will provide free domain of your choice for first year. Click here to go to BlueHost.

Hit the green Get Started button.

BlueHost

By the way, images may vary, and it may look slightly different in mobile, but the process mentioned here is the same.

Click a green Select button to choose a plan.

BlueHost Select Plan

We recommend the “Choice Plus” plan because it has more unlimited features and includes domain privacy. Domain privacy keeps your personal information hidden from the public.

Create a Domain

BlueHost Domain Choice

Enter your domain in the "Create a new domain" box. If you already purchased a domain, enter it in the "Use a domain you own" box. If you are currently using it elsewhere, you can still use that. This is only used to identify your bluehost account.

If you haven't yet decided your domain name. You can choose it later and map it to your hosting whenever you are ready with the name.

Fill out your billing details on the registration page.

BlueHost Billing Details

Choose your hosting package and options.

BlueHost Account Plan

All packages have everything you need to get your site up and running, including a free domain name, easy WordPress + WooCommerce installation, web hosting, and branded email accounts (ex. yourname@yourdomain.com). You can opt-out anytime those products from Package Extras. You can buy those later as per your requirements.

Enter your payment information

BlueHost Payment Information

Fill payment details, don’t forget to check the Terms box, hit Submit.

Once you successfully created your account click on Create Account button.

BlueHost Purchase Success

Create a password for your account

Enter the password for your account and hit Create Account. Always use your password with combination of letters, numbers and special characters.

BlueHost Create Account Password

Click the “Login” button to get to the login screen and login to your account using your domain name and password.

BlueHost Account Login

Once you log-in to your account, you will be taken to your BlueHost Portal.

Enter the name of your site and a tagline. This can be changed later.

Follow the instructions provided there to move farther. You can skip the free themes for now. You can select later from Appearance -> Themes.

Note:

If you chose a new domain, it would take 2-24 hours to get it registered. When it’s ready, BlueHost will switch your blog from the temporary domain to the one you chose.

If you used an existing domain or going to choose a domain later, you can set it up once you get this site is ready to launch.

Step 2: Install plugin and configure WooCommerce

Install WooCommerce Plugin

  • To install WooCommerce, go to Plugins -> Add New.
  • In the search bar up top, enter the name “woocommerce”.
  • Click "Install Now." Once you installed your plugin, you have to activate it by clicking "Activate" button from Plugins -> Installed Plugins.

WooCommerce Setup Wizard :

After installing WooCommerce, you’ll be prompted to walk through a setup wizard. You can skip this for later, but we recommend to complete these now.

Fill the address and select type of the product you want to sell.

woocommerce wizard store details

Choose your payment method

On the next step, you can decide what payments you’ll enable for your online store. You can choose Stripe, PayPal along with offline payments such as cheque and cash.

woocommerce wizard payment methods

woocommerce offline payments

If you don’t have Stripe or PayPal account, create one from below links.

Configure Your Shipping Options

WooCommerce Shipping details

Here, you can decide and enter rate of shipping you want to charge for your customers. You can set one rate for your preferred zone, and another for customers who are in other locations. If you want, you can also offer free shipping to one or both groups.

Choose Recommended Settings

You can choose any of the below options. We recommend to select Storefront theme, This is a WordPress theme designed specifically for WooCommerce and can make setting up your store quicker and easier.

woocommerce wizard recommended settings

You can choose some optional add-ons for your new store.

  • WooCommerce Admin is a new interface for managing your store, with improved reports and a dashboard to monitor key metrics of your site.
  • The Mailchimp for WooCommerce plugin allows you to automate emails, send promos, and build mailing lists.
  • Facebook for WooCommerce brings your products to social media.

Automated Taxes requires a Jetpack connection. If you selected this option, you will be prompted to activate and connect.

woocommerce jetpack plugin

Before going to add products, let’s first complete the settings.

Click on “View Dashboard”

Step 3: Products Settings

Here you configure settings for products and how your product looks like in front-end, including inventory of the product, image sizes, downloadable products settings

General tab in WooCommerce

Go to: WooCommerce -> Settings -> Products -> General:

Shop Page

Select which page you want to display as the default shop page. It’s not mandatory that the "Shop page" is same as WooCommerce installed. You can choose different page or option to display products.

Add to cart option

  • Redirect to cart page after successful addition: Automatically takes the customer to the cart page upon adding a product.
  • Enable Ajax add to cart buttons on archives: Adds the ‘Add to Cart’ option to shop archive pages.

Placeholder Image

When no image appeared in the front-end and no other image is available to select , you can set a default ‘placeholder’ image. You can select your brand logo or your product's image.

You can change logo and icon in Appearance -> Customize, if you are theme has the option.

Measurements

In the drop down select unit of measurement for weight and dimension of the products. This will help to calculate Shipping cost later.

Reviews

How To Enable Reviews

  • Enable product reviews
  • Choose to display only if the reviewer bought the product.
  • Control only genuine buyers can leave a review or everyone can review it.

Customize Product Ratings

  • Enable stars on reviews.
  • Set if it's optional or required.

We recommend to select all those options. These helps to get more traffic and track the fast selling products.

Inventory Options

Here's how you can edit inventory options in your shop,

Navigate to: WooCommerce -> Settings -> Products -> Inventory

woocommerce inventory settings

Choose whether to enable stock management. If selected, you have these options:

  • Manage stock
    • Enable stock management : For Physical products inventory is automatically managed in WooCommerce. You can enter quantity of the product, and WooCommerce subtracts products based on sales, in-stock, out of stock or if product is on backorder.
    • Disable (box left unchecked) : You can enable stock management based on requirement and on a per-product level. Also, you must enter inventory and status of the physical products manually.
  • Hold Stock (minutes) : If stock reached limit or pending order, pending order is canceled. For unpaid orders, you can hold products for X minutes. Keep it blank if you want to disable this option.
  • Notifications settings
    • Enable low stock notifications, to notify if product reached near to over .
    • Enable out of stock notifications, to notify if product reached lower than the limit.
  • Notification Recipient : select email address to receive notifications.
  • Low Stock Threshold :  Choose how many number of products left over to trigger low stock notification.
  • Out Of Stock Threshold : Choose after how many products sold to trigger out of stock status.
  • Out Of Stock Visibility : If you don't want to display out of stock items from catalog to your customer. You can hide it here.
  • Stock Display Format :
    • Always show stock – I have selected, “12 in stock”. You can change this as per your requirement
    • Only show stock when low – I opted “Only 2 left in stock” vs. “In stock”
    • And selected "Never show amount".

Downloadable Products in WooCommerce

If you want to sell downloadable products than physical products such as eBooks or software. This is the best option in WooCommerce you have.

Navigate to : WooCommerce -> Settings -> Products -> Downloadable products.

woocommerce downloadable products

  • Force Downloads :  Here files are downloaded forcefully. In this option, files are not accessible to anyone except purchasers. Here direct downloadable links are not visible, mostly hidden.
  • X-Accel-Redirect/X-Sendfile :  It's Similar to ‘forced’ option, but it has better performance than that and helpful to provide larger files with capacity..
  • Redirect only : You can provide an external URLs to download your files.

Most of the stores should use either of the first two options to keep files safe and secured. Redirect Only option used if problem triggers  or you don’t mind to provide non-secure files to download.

Access Restriction option

  • Select if downloads require login :  This will not applicable to guest purchases.
  • Grant access to downloadable products after payment :  You can enable this option to provide access to downloads when orders are Processing, instead of  Completed.

If you already completed Tax and Shipping settings in WooCommerce wizard setup, you can skip this. However, am going to write in detail if you missed any steps there.

Step 4: Tax Settings

Setting up taxes and tax rates is one of the first tasks you want to perform when setting up a store.

Enabling Taxes

To access the tax settings screens, they first need to be enabled.

  1. Go toWooCommerce -> Settings -> General.
  2. Select the Enable Taxes and Tax Calculations
  3. Save changes.

enable taxes woocommerce

Configuring Tax Options

To start configuring taxes:

Go to: WooCommerce -> Settings -> Tax. This tab is only visible if taxes are enabled.

configure tax option

Prices Entered With Tax

This option is the most important when managing taxes in your store, as it determines how you input product prices later on.

  • “Yes, I will enter prices inclusive of tax”Choose this when you want to enter your product price which is already included tax rate.
  • “No, I will enter prices exclusive of tax” would mean that your catalog prices need to be tax exclusive. For this provide below inputs.

Calculate Tax Based On

This setting determines which address is used for tax calculations.

  • Customer billing address.
  • Customer shipping address (default).
  • Store base address.

If you use store base address, taxes are always based on your store location and not your customer’s location.

Shipping Tax Class

In most setups, shipping tax class is inherited from the item being shipped, e.g., Shipping a reduced rate item such as baby clothes would also use a reduced rate. If this is not the case in your jurisdiction, choose a different tax class.

Rounding

If you enable Rounding tax at subtotal level, instead of per line, the rounding is done at the Subtotal level. Check your tax jurisdiction to know if this is done.

Additional Tax Classes

Tax Classes are assigned to your products. In most cases, you want to use the default Standard class. If you sell goods that require a different tax class (i.e., Tax, except zero-rated products) you can add the classes here. To get started, we include Standard, Reduced Rate and Zero Rate tax classes.

Each class is listed at the top of the tax settings page. Click a class to view tax rates assigned to the class.

Display Prices in the Shop

This option determines how prices are displayed in your shop/catalog. Choose from inclusive/exclusive tax display.

Display Prices During Cart and Checkout

This option determines how prices are displayed in your cart and checkout pages. It works independently of your catalog prices. Choose from inclusive/exclusive tax display.

Price Display Suffix

Allows you to change display to: “Prices include __% tax/VAT” or anything appropriate for your store. You can use these two placeholders if you want to have text before and after the price:

  • {price_including_tax}
  • {price_excluding_tax}

For example: “Price incl. VAT: {price_including_tax}” will display as: “Price incl. VAT: $15” (if that is the price, of course). So, if you’ve set the taxes to display excluding tax, you could add in small print what the tax inclusive of tax will look like:

WooCommerce Product for Tax

Display Tax Totals

This determines if multiple taxes get displayed as one total during checkout, or as an itemized list of taxes.

Step 5: Shipping Settings

Go to: WooCommerce -> Settings -> Shipping.

Shipping Zones is the main shipping settings screen in woocommerce. Based on geographic region or zone, adjust shipping rates and methods.

Read here to get more information about setting up shipping zones.

Shipping Options

woocommerce shipping options

Shipping Calculations

  • Enable the shipping calculator on the cart page: Check this option if you want to display shipping cost as soon as your customer adds products to cart.
  • Hide shipping costs until an address is entered. Check this option only if you want to show shipping cost in before the payment checkout.

Shipping Destination

Ship to billing address or customer shipping address by default or only ship to the user’s billing address. We suggest to use “Default to customer shipping address”.

Debug Mode
Enable this option for troubleshooting purposes. Keep it unchecked if it's not required.

We will skip Payment Method here as it is already done in initial setup wizard.

Step 6: Accounts and Privacy Settings In WooCommerce

To control customer accounts and data retention related options, navigate to WooCommerce -> Settings -> Accounts and Privacy.

woocommerce guest checkout

Guest Checkout

  • Allow customers to place orders without an account : If it's checked, without creating account customers can check out. Also, orders will not be tied to a user account in WordPress.
  • Allow customers to log into an existing account during checkout : If customer is not already logged-in, this displays a login form and prompt on the checkout page.

Account Creation in WooCommerce

  • Allow customers to create an account during checkout : Here you can allow your customers to create an account during checking out.
  • Allow customers to create an account on the My account page : Provide an registration page or my account page to allow customers to create account as soon as they visit your site.
  • Automatically generate username from customer email : It will generate an unique username from customer email. If this option is disabled, there will be an input box where user can enter their own username.
  • Automatically generate customer password :It will generate password automatically and send it to user email address. If this option is disabled, there will be an input box for the user to create their own password. Note that password strength notification will be displayed to customers and they can choose any password irrespective of times unless they submit.

Account erasure requests

  • Remove personal data from orders : Here you can remove personal data on request. If you enable this option and user belongs to the user being erased group, user data will also be removed from your orders.
  • Remove access to downloads : This allows you to remove personal data on request. If you enable this option and the download data belongs to the user being erased, it will be removed. If this happens, the erased user will no longer have access to any purchased downloads.

Personal data removal

  • Allow personal data to be removed in bulk from orders : Adds a new bulk action to remove personal data on the Orders page. Useful if you need to manually remove orders in bulk.

Privacy policy

Here you can select a page for your privacy policy, and display privacy policy details on your account and checkout pages.

Providing privacy policy page is very important to run your business legally and as per the local government regulations.

woocommerce privacy policy

  • Privacy Page : Select a privacy policy page. Using short code[privacy_policy] will link to this page. Some themes also use this option to link to a privacy policy in other places, such as the footer.
  • Registration privacy policy : Privacy policy can be shown on the registration form on the My Account page. You should include information about your privacy policy, and link to your privacy policy page for more information.
  • Checkout privacy policy : Show it in the checkout form. You should include information about your privacy policy, and link to your page privacy policy page for more information.

Personal data retention

You can decide how long you want to keep order data on your store. You should specify how long your site will retain data in your privacy policy; consider as per local laws.

woocommerce personal data retention

Enter a number and choose the duration from days, weeks, months, or years for each options. These options will be disabled if you left it blank.

  • Retain inactive accounts : You can opt to retain customers account which have not logged in or placed any order for the specified duration.
  • Retain pending orders : You can retain pending orders which are unpaid or abandoned and no need to be fulfill orders.
  • Retain failed orders : Failed orders are unpaid or abandoned and no to be fulfilled.
  • Retain cancelled orders : If any orders cancelled by customers or admin or waiting for payment timed out, those orders can be retained.
  • Retain completed orders : Set duration to retain completed orders which are placed in the past.

Personal Data Exporter

In this section, you can export personal data to an HTML file which associated with an email address. WooCommerce adds to below information to the generated export file while exporting the following data:

  • Customer address/account information.
  • Orders associated with the given customer email address.
  • Download permissions along with logs associated with the given email address.

woocommerce export personal data

To ensure your requests are genuine or not, a confirmation email is sent to verify the request. The verification process:

  1. Enter an email address or username.
  2. User is notified via email with a confirmation link.
  3. Confirmation link is used, and request is marked “confirmed.”
  4. Email with link to download their personal data is sent to the user.

Example of a Personal Data File:

woocommerce export data file example

Step 7: Email Settings in WooCommerce

Go to: WooCommerce -> Settings -> Emails.

Customize Email notifications

You can configure your email settings in WooCommerce and this method is optional.

woocommerce email settings

Email Sender Options

Set the ‘From’ name and email address for the sender.

Email Templates

Here how you can customize your emails.

woocommerce email template edit

Header Image

Enter the URL of an image which you want to show in the email header. You can upload an image by clicking the "Add Media" button or by Media -> Add New.

Email and Text

  • Base Color : You can choose base color for WooCommerce email templates.
  • Background Color :  Select background color for your email templates.
  • Email Body Background Color :  Main body background color can be changed here.
  • Email Body Text Color : Body text color can be changed here.

Editing Individual Email Templates

In the list above in Email Notifications are these templates:

New order | Cancelled order | Failed order | Processing order | Completed order | Refunded order | Customer invoice | Customer note | Reset password | New account

Click the gear wheel on the right side of the panel, and select a new screen appears.

woocommerce email order update

Select below options or enter preferences as per your requirement:

Enable/Disable
To get email notifications enable this option.

Recipient(s)
Enter recipient email address here. You can add multiple email IDs by separating with comma separated.

Subject
You can customize email subject line here. Leave it blank to use the default subject for this mail.

[{site_title}] New customer order ({order_number}) - {order_date}

Email Heading
This controls the main heading contained within the email notification. Leave it blank to use the default heading.

Email type

Choose which format of email to send. Options include:

  • Plain Text
  • HTML
  • Multipart

Note it down, If using Plain Text emails. Here text fields are limited to 155 characters. If your products have long names and/or numerous variations/add-ons, the field may be truncated.

Step 8: Advanced Settings in WooCommerce

You to change WooCommerce defaults and integrate it with the API in the Advanced settings.

Navigate to: WooCommerce -> Settings -> Advanced.

woocommerce advanced email

Page Setup

Pages need to be set so WooCommerce knows where to send users to perform certain actions:

  • Cart Page : In this page,  customers can see items added to the cart.
  • Checkout Page : Here, In this page, users will enter their payment information to submit orders.
  • My Account page : Registered customers will go to view their orders or account details from this page.
  • Terms and Conditions : Select terms and conditions page here.
  • Secure checkout : Force SSL (HTTPS) on the checkout pages. An SSL Certificate is required, if selected.

You need not use the pages WooCommerce installed, but you must have a page set for the Cart and Checkout pages. Otherwise your customers cannot buy and pay for your products. These pages are normally created and set when installing/setting up WooCommerce.

To use a Terms and Conditions page, create a new page for it at Pages -> Add New, then select the page in the dropdown. The Terms and Conditions appear inline during checkout, and the customer can scroll through content and tick the checkbox to accept.

Step 9: Add and Manage New Product in WooCommerce

To add your first product, go to Products -> Add New

woocommerce new product add

Then, create a title and a short description of the product.

Here is how title and description looks like,

woocommerce new product preview

  • There you can add all the details about your product. Very top, you can select whether product is virtual (if it is downloadable product like eBook or software) or not.
  • In the "General" tab, You can can enter regular and sales prices.
  • If you want to sell digital product, you can upload file, download limit and expiry date.

woocommerce new product general

  • In the "Inventory" tab, you can manage your stock by entering the quantity of the product, if product is in or out of stock, and if you want to allow backorders.
  • Also enter the SKU (Stock identification number) of the product.

woocommerce new product inventory

  • In the "Shipping" section, enter the item's weight, dimension and shipping class.
  • In the "Linked Products" section, you can add up-sells and cross-sells.
  • In the "Attributes" tab, describe the products's characteristics.
  • You can enter custom purchase notes, enable or disable reviews and the product a set position in your menu in the "Advanced" tab

Creating Attributes and Variable Products in WooCommerce

As you know, there are many options in WooCommerce for adding details to your products and customizing them. Let's discuss on two most useful options in the "Product data" tab.

Attributes : They are the key descriptors of your product. They describe important information about product like color of your product, material your product made up of, size, type and more. They'll appear on the product page, When you add these details into your product in the Attribution section.

woocommerce new product complete

Even though you provide lot of necessary information about your products in attributes, sometime you need to sell items which come in multiple options. In that case, you can select Variable product option:

woocommerce new product variation

In "Variations" tab, you can create multiple versions of your item along with attributes you already created. For example, if you offer a T-Shirt in red, blue and green color. You can add variation for each color and provide a unique description of the product, price and so on.

After that, your customers will be able to see all those available variations on the product page.

woocommerce new product options

With this, you don't have to create separate product pages for each variations on the same item. These options also makes it easy for your customers to view everything you offer.

How To Customize Your Product Short Description

You’ll find a section labeled Product short description, under the Product data widget,

woocommerce new product description

  • There you can create a brief tagline that will appear in the product’s title. Using this description, you can use one or more keywords to highlight the item's benefits and help customers locate easily in searches.
  • Once you customize your product's data and description, don't forget to check product page for other options. You can use include featured image, select relevant categories and tags to your product. Here you can include image gallery as an option.

Below is how the final product might look like to your customers:

woocommerce new product data

When your product is ready, click "Publish" button to make your product live on your site. You can repeat this process whenever you decided to add new products to your site.

How To Manage Products In WooCommerce

You can include any number of items to your WooCommerce shop, in such case, you need an easy way to manage the products. Luckily, you can manage them from the "Products" tab in dashboard.

Here, you can see every item listed in your store by selecting "All Products" option. Where you can add, edit and delete products.

woocommerce all products

You can view your product categories, tags and attributes in the pages underneath the product's section. These pages looks like the Categories page in the standard WordPress Posts, which will help you to keep your inventory organized.

Step 10: Ways To Customize Your WooCommerce Store

Till now, you configured few basic settings for your WooCommerce store. There are a lot more other options available in the new WooCommerce tab to play with.

Here you can view Orders, Coupons and reports, add new extensions and customize settings. Let us discuss on these options one by one.

Managing Orders In WooCommerce

The Orders page, displays list of recent purchases made by your customers in the store:

woocommerce all orders

You can find what products need to ship and the status of the orders, only when you sell physical items. If you sell digital or downloadable products, there's nothing much to do other than view what has been bought lately by your customer.

Create Coupons in WooCommerce

There are several and useful options are there for adding new coupons to your WooCommerce store. Go to, "Coupon" tab and to access editing screen, select Create your first coupon

wooacommerce create coupons

  • Here you can add coupon code and description of your coupon. In the "General" tab you can edit basic information such as, type of coupon (discount in percentage, fixed cart or fixed product discount), coupon value, whether it's applicable to free shipping or not and expiry date.

woocommerce coupon usage

  • In the "Usage Restrictions" tab, you can set, how much minimum amount your customer need to spend in order to validate the coupon created. If you don't want your customer to use the coupon along with other offers, check the Individual use only box.
  • You can also set if the coupon is applicable to certain products and products categories and exclude items which are on Sale. You can even restrict coupons to certain email addresses.
  • Finally, set how many times the coupon can be used as per customer and both overall in the "Usage Limits" tab. To activate the coupon, publish it and let your customers know about your coupon code.

Step 11: Reports in WooCommerce

Reports tab, a powerful built-in tracking functionality in WooCommerce where you can view your sales, orders and shipping costs over different time periods. You can also view these using data mapping options provided, such as charts and graphs.

woocommerce complete reports

Graphs can be used to view sales of particular product, category and coupon. You can also view customer acquisition over the time period under the Customers sub-tab.

Under the Stock sub-tab, you can review products by stocks like low in stock, out-of stock and most stocked products. All these data can be exported to CSV file.

Finally:

If you have some technical knowledge you can go ahead to create your own eCommerce store using WooCommerce. WooCommerce is also best one if you have vision to expand your business from smaller one to larger. Using Rest API option integrated, you can easily bind your data with your mobile applications.

If you have minimum or no technical knowledge and never worked in WordPress, and you don't have want to sell only few numbers of products which are less than 100. If you don't want to manage server, updates and all. I recommend you to try Shopify.

Also refer below [Infographics] to create WooCommerce store in brief.

WooCommerce store in brief

Have more questions?

If you have any doubts or questions, you can write your queries in below comment box.

2 thoughts on “Build Online Store: WordPress + WooCommerce step by step guide 2019

Leave a Comment

Share via
Copy link
Powered by Social Snap