14
Aug
2018
Installing a WooCommerce theme
The commercial WooCommerce-compatible theme, you will have to install it through the WordPress administrative panel or upload it using FTP. Before we do so, let’s first take a look at what we actually received. In almost all cases, you’ll receive a ZIP file holding different folders.
The content and names of the folders will differ from theme to theme. Still, it’s good to have a closer look at it and get familiar with commercial theme packages.
An example of the contents of a downloaded theme can be found in the next screenshot:
Table of Contents
About ThemeForest
Note that this is just an example, coming from a ThemeForest WooCommerce them named The Retailer. The folder structure of this theme shows that it differs from just a regular WordPress theme.
There are separate folders holding Assets, the original Photoshop files and Demo data for instance. The actual theme files we need to install the theme have been placed in the folder theme files and we first need to extract (unzip) the whole package in order to be able to continue with our installation.
Although the folder names will differ from theme to theme, this is an approach that you will see with lots of premium themes.
Always look for a folder named Documentation and start reading this before doing anything else! Often, you’ll see that the documentation is offered in an HTML format, starting with index.html that you should open using your browser. In the following screenshot, there’s an example of such a documentation:
Theme Installation
To install the theme, we head over to the WordPress administrator and choose Appearance | Themes in the menu. Click on Add New, and then click on the Upload Theme link:
Click on Choose file, and then browse to the folder where you unpacked the theme files a minute ago. We open the file theretailer.zip from the subfolder named Theme files and click on Install Now. Remember to upload the ZIP file and not the theme folder inside it.
Next, since this theme is already delivering a child theme, we’ll install that one as well. We repeat the preceding steps for the file the retailer-child.zip. Note that we must do it in this order: first, install the main or parent theme and after that the child theme. Besides that, not every theme will deliver a child theme as well. Often, you’ll just receive a single theme package.
Child Theme
Working with a Child theme is a best practice if you need to make changes to your theme. By using a parent and child theme, we’ll avoid losing our changes if the developer ever needs to update the theme—and this will happen. If the theme of your choice does not deliver a child theme in the package, it’s not very difficult to create one.
Don’t forget to activate the Child theme by clicking on the link after installation! Note that our theme requires us to install a couple of additional plugins. We receive a warning message that we can do this by clicking on the link, as shown in the following screenshot:
You would see the following screen after clicking on the link:
Select the plugins and install them all at the same time.
Whether or not your theme will ask for similar steps completely depends on the way it was set up by the developer. Refer to the documentation for your theme when you’re in doubt about the steps to take. Note that after bulk-installing the plugins, we also need to activate them.
After installing the parent and child themes and activating it, our store page looks as follows on the frontend:
It’s functional but still requires additional setup.
Building E-Commerce Solutions with WooCommerce
This book has been written for everyone who wants to learn how to expand an existing WordPress website with e-commerce functions using the WooCommerce plugin.
