WooCommerce is the most popular and “most customizable eCommerce platform for building your online business.” You can download WooCommerce for free, but you really begin to see its power when you start using WordPress WooCommerce plugins and themes.
But do you really need to use a WooCommerce theme?
While it’s not required, I highly recommend it.
Not only are WooCommerce themes eCommerce-centric by design, the entire theme is centered around WooCommerce styles. The CSS that WooCommerce uses to define how products are displayed is then used by the WordPress WooCommerce theme to really pull everything together—making for some of the most beautifully designed eCommerce storefronts.
Not to mention the fact that installing and setting up a new WordPress WooCommerce theme isn’t any more difficult than setting up any other WordPress theme.
Let me show you how to do it.
How to Install and Set Up a New WordPress WooCommerce Theme
If you already have WooCommerce installed, that’s great! If not, I highly recommend Rachel McCollin’s Beginner’s Guide to Using WooCommerce. This will introduce you to WooCommerce and take you through all the steps needed to get your online storefront up and running.
Now let’s get started with how to install and set up a new WordPress WooCommerce theme.
Step 1: Install Dummy Data
If you’ve already added your products to WooCommerce, I recommend skipping this step and starting with step 2.
Installing dummy data adds fictional products to your storefront to help you visualize your store with products. After you’ve completed installation and set up your new WordPress WooCommerce theme, you’ll want to delete all the dummy data before adding your products. Otherwise you risk accidentally deleting your own product data.
The dummy data is included with your WooCommerce plugin. If you’ve installed WooCommerce within the WordPress Admin, go ahead and download the plugin from the WordPress Plugin Directory to your computer. This will be easier than logging into your FTP, going into your plugin directory, and downloading the dummy data from there.
Once your download is complete, unzip the file so you’re ready to import your dummy-data.xml file.
Go to your Tools and click on Import:
Don’t let the “WooCommerce Tax Rates (CSV)” confuse you. This can be done later if you like. For the WooCommerce Dummy Data, you’ll want to choose WordPress.
More than likely you won’t have the WordPress Importer plugin installed, so go ahead and Install Now.
Once installed, go ahead and Activate Plugin & Run Importer.
Do you remember where you downloaded and unzipped the WooCommerce plugin? Great! Now you need to click Choose File and make your way to it.
Your dummy data should be in your unzipped folder: (woocommerce.version.number) > woocommerce > dummy-data.
Open the dummy-data folder, select dummy-data.xml, and you’re ready to upload the file and import.
This is the last thing you’ll need to do before importing all the dummy data.
Some of this is personal preference, but here’s what I do (screenshot further below):
Import the default author “wooteam” instead of creating a new author or using a preexisting author. This way you know what content was imported/created in this process based on the author name (I recommend deleting the author when you remove the dummy data after you’ve finished installing and setting up your new WordPress WooCommerce theme).
I also recommend that you Download and import attachments so that you have images associated with each product (again, you’ll want to make sure the media is removed when you’re finished with the dummy data).
Once you’ve made these selections, submit:
Visit yourwebsite.com/shop/ and you should see a fully imported test store:
Yeah! You did it!
It’s not very well designed, is it? Good thing we’re going to install a great-looking WordPress WooCommerce theme like Savoy.
(NOTE: After you’re done installing and setting up your theme, don’t forget to delete the products and images from the dummy data import before you start adding your own products.)
Step 2: Install a WordPress WooCommerce Theme
Now, let’s look at how to install WooCommerce theme. If you haven’t downloaded your WordPress Commerce theme already, go ahead and download it to your computer (make sure you know where you’re downloading it, so you can access it).
There are two different ways you can install your theme:
- Access your website using FTP
- From the WordPress Admin
FTP Your Theme
If you’re comfortable using FTP, go ahead and connect to your server and make your way to the wp-content > themes directory. This is where you’ll want to send your theme. Before you send your unzipped folder to your server, however, make sure you’re sending your theme. Let’s take a closer look by using our example WordPress theme from ThemeForest.
After unzipping your download, you’ll see there are a number of different folders:
Not every theme you download will be packaged like this. Sometimes the zipped folder you download is the actual theme folder. It’s always a good idea to double-check, since this varies from place to place.
The Savoy – Minimalist AJAX WooCommerce Theme includes some extra things like documentation, assets, etc. If you look in the Theme Files folder for Savoy, you’ll find your theme (savoy.zip).
If you’re installing via FTP, go ahead and upload your unzipped theme folder (for example: “savoy”) into the themes directory. If you’re not sure about using FTP or would prefer to install from the WordPress Admin, that’s fine. I prefer using the WordPress Admin, too.
From the WordPress Admin
Installing a WordPress theme from the Admin requires that the theme folder be zipped (themefolder.zip). As we discussed previously, you’ll want to make sure you’re working with the actual theme folder and not the folder your theme may be packaged in.
From the WordPress Admin, under Appearance, click Themes:
Add new theme:
Upload theme:
Do you remember where your theme zip file is located?
(Our example theme is titled: savoy.zip)
Click Choose File and make your way to it:
Once installed, you can visit Appearance > Themes in your WordPress Admin to see if it’s installed or click to activate it straight away.