WooCommerce Tutorial Part 1 – Building an eCommerce Site with WordPress

July 3, 2012 · 30 comments

in WooCommerce Tutorials, WP Theme Tutorials

How to Setup a Robust Online Store with WordPress and WooCommerce

Here’s Why You Should Consider the eCommerce Model

In my opinion, one of the best ways to generate long-term, sustainable income online is by building a brand and selling your own products.  Yes, I would agree that the process of getting started can be difficult.  However, it’s definitely worth the effort in the long-run and here’s why…

If you’re able to find an under served market, and you’re then able to create a product that solves a problem for that market, you’re success is just about guaranteed IF you know how to setup an effective eCommerce site.  There are many budding entrepreneurs out there that understand the part about finding a market first and creating a product second.  However, the majority have no idea of how to bring their product to the online market.

Most people have no idea how to create an eCommerce site and they usually do not have enough cash to pay someone else to build one for them.  On top of the initial cost of building the site, they worry about the on-going monthly fees associated with keeping an eCommerce site up and running.  This usually results in settling for the affiliate marketing model because it’s easier to get started.

The problem with settling for the affiliate marketing model is that it’s very difficult woocommerce woostore WooCommerce Tutorial Part 1   Building an eCommerce Site with WordPressgenerate consistent income for a number of reasons.  First of all, you’re competing with hundreds or more likely, thousands of other affiliates that have been in the game much longer and have more money than you.  Affiliate products can lose popularity overnight, rules for promoting them often change, and you build zero equity. Sure, you could always sell a successful affiliate site (assuming the product it promotes is still relevant) and make a nice chunk of money but it’s a one time deal.

On the flip side, if you were to invest the same amount of time and effort into developing your own brand, your own products, your own eCommerce site then you could create something that produces steady income and builds equity.  Also, a profitable eCommerce site tends to sell for much more money than an affiliate site on Flippa.com.  So building up your own eCommerce site should be your focus if you plan on generating full-time sustainable income online.

The good news is that this UploadWP.com tutorial series (and our Free WooCommerce Setup Service) is designed to teach you how to create an effective eCommerce site that will get your products sold.  We’re going to build a site that mainly sells soccer related t-shirts.  We’ll build WorldCupTees.com from start to finish using WordPress, WooCommerce and the WooStore theme.  We hope that you’ll be able to use these videos to build a profitable eCommerce site of your own. So let’s get stared by installing the WooCommerce plugin and the WooStore theme…

Getting Started with WooCommerce and the WooStore Theme

Step 1:  Install the WooCommerce Plugin

The first thing you need to do is to install the “WooCommerce Plugin“.  WooCommerce is an open source plugin that you’re going to download in your WordPress admin just like you would with any other free plugin.  Log into your WordPress admin and go to Plugins > search for “WooCommerce” > find the “WooCommerce – excelling eCommerce” plugin > install and activate the plugin.

After activating the plugin a purple banner will appear at the top of the WordPress admin that says, “Welcome to WooCommerce – You’re almost ready to start selling”.  Next to the welcome message you should also see the “Install WooCommerce Pages” and “Skip Setup” buttons. Click on the “Install WooCommerce Pages” button and your shopping cart pages will automatically be created.  These pages include the; Cart page, Checkout page, Pay page, Thanks page, My Account page, Edit Address page, View Order page, and Change Password page.

Step 2:  Install and Active the WooStore Theme

In total, there are about 22 WooCommerce specific themes to choose from.  In this tutorial series we’re going to use the WooStore theme because I think it looks the best and is the most flexible.  Even if you choose to use a different theme, these tutorial videos will still be applicable because they focus more on the WooCommerce platform than on the individual theme.  Each of the WooCommerce specific themes are similar so what applies to the WooStore theme most likely applies to the other themes as well.

The WooStore theme is installed just like any other WordPress theme.  You can install it via the WordPress admin by going to Appearance > Themes > clicking the Install Themes tab > click Upload > browse and find the WooStore theme and click the Install Now button.  Or, you can upload the WooStore theme using an FTP client like FileZilla.  Both methods work eaqually as well.  After the theme has been installed, go ahead and activate it.

The WooCommerce platform and WooStore theme are now installed and ready to setup.  In the next couple videos we’ll show you how to configure the WooCommerce settings as well as the WooStore theme settings.  We’ll go through each section in detial and show you how we setup our soccer t-shirt eCommerce site, WorldCupTees.com. So please follow along as we show you how to build a professional, scalable, highly customizable eCommerce site from start to finish using WordPress, WooCommerce and the WooStore theme.  See ya on the next video…

If you need to get you’re eCommerce site setup the right way, consider letting us help you.  Take a few minutes to learn more about our Free WooCommerce setup service.  We’ll help get your site setup properly and we’ll provide ongoing WooCommerce support so take advantage of it today.

Teddy Triton

Article by

I'm a blogger and the founder of UploadWP.com. Upload WP was originally created as a training tool for my Flippa.com clients. Having bought and sold a large number of WordPress sites on Flippa, I needed an effective and efficient way to teach people how to make updates to their new sites. Upload WP was the answer and the site has since grown into a leading WordPress Tutorials destination. I enjoy helping people solve their WordPress related issues. If you have any questions or a WP issues that you need help with, please leave a comment below and we'll do our best to help.

Adam has written 106 awesome articles for us at Upload WordPress

Stay Updated - Subscribe

{ 29 comments… read them below or add one }

Josh October 28, 2012 at 6:02 pm

I changed my theme to Emporium. Could this be a cause for my “my account” and “orders” page not to work properly? Thanks a lot.

Reply

Teddy Triton Teddy Triton October 30, 2012 at 1:34 am

Hi Josh,

Thanks for your question. I took a look at your site Cuesportsclub.com but it seems like it’s just a slash page. Please send me the URL of site you have the issues with and I’ll take a closer look and do my best to solve the issue. One thing you might want to try is disabling the WooCommerce plugin and then re-activating it. If that doesn’t work, try disabling all other plugins except for woocommerce and see if that helps.

Adam

Reply

Victoria December 9, 2012 at 6:40 am

When I activated the theme it is not showing all of the tabs at the top like yours did. I have looked all over on how to fix it and I cannot figure it out. I have added one product and you can only see it on the home page because the categories I have set up are not showing up.

Reply

Teddy Triton Teddy Triton December 11, 2012 at 2:05 am

Hi Victoria,

I took a look at your site, austinranchtoo.com/ and am not sure what you mean by “tabs at the top not showing”. Please provide more information / clarity and I’ll do my best to help solve the issue.

One thing you might want to try is changing your Permalink structure. I have a hunch that is what’s causing the issues.

To change the Permalink structure log into your WordPress admin and go to Settings > Permalinks > change it to what’s illustrated in the screen capture below…

WooCommerce Permalink Structure

Reply

Victoria February 14, 2013 at 10:30 pm

I did change what you suggested and still did not fix the problem. The custom tabs I had created for the top menu bar are not showing. I noticed that in your tutorial video you said that when the theme was activated it should have automatically created “shop pages” but all of mine are completely blank when I go under settings and look. I do not know how that happened or if that has any affect on why the tabs are not showing.

Reply

Teddy Triton Teddy Triton February 16, 2013 at 2:55 pm

Hi Victoria,

Try deactivating the WooCommerce plugin and then re-activate it. If that doesn’t work then deactivate and Delete the WooCommerce plugin. After you’ve deleted it, go ahead and re-install and activate it. When you re-install and activate the WooCommerce plugin you should see a message to “Create WooCommerce Pages”. Go ahead and click that button and the WooCommerce pages should be created. Please try this and let me know if it fixes the issue.

Thanks,

Adam

Reply

Jeff Fredriksen January 20, 2013 at 2:52 am

First, thank you for your videos on Woo Commerce, they’ve been so helpful. I’m new to web design and my first foray into Wordpress is also an ecommerce site so I’m really jumping in.

I have designed a custom site for a friend. I have been unable to find any tutorial on how to turn my html drop down menu into a dynamic woo commerce menu. I also have been trying to find if I can use an index.php as the homepage or does it have to be adapted to just be used with their format of pages. Can you point me to any othe appropriate tutorials, I would greatly appreciate your help.

Reply

Allan Moore January 21, 2013 at 9:10 am

Hi Teddy
Your tutorials have been a great help to me,
What is the best sizes for the images for Landscape and Portrait CCTV Signs.

Also the sizes are A3.A4.A5, but I also need the costomer to provide me with ther Company Name and Contact Number on Bespoke signs, am I able to put a box next to the sign where the can put that information in and also a drop down Box to select what the want to put in writing on the signs.

Hope you can help

Kind regards
Allan
United Kingdom
.

Reply

Teddy Triton Teddy Triton January 29, 2013 at 12:38 pm

Hi Allan – Thanks for letting us know that our tutorials have been helpful. I’m not sure that I’m following / understanding your question on best sizes for Landscape and Portrait images clearly. Please provide more information / details and I’ll do my best to help. Thanks,

Adam

Reply

alexa January 27, 2013 at 10:07 pm

Hello,
Thank you for all the tutorials on woo commerce, I have watched them all! I am at the very beginning of this process. I am a novice so please excuse my lack of knowledge…
My big question is: can I link the woocommerce shop from original wp blog, and if so how?
thank you.

Reply

Teddy Triton Teddy Triton January 29, 2013 at 1:31 pm

Hi Alexa,

Thanks for your support and for taking the time to watch all of our WooCommerce tutorials! I’m glad to hear that you’ve decided to move forward with WooCommerce and are willing to take on the challenge. Hopefully I can help answer your question and move you one step closer to launching your eCommerce site.

In regards to your question on linking a WooCommerce shop from an original WordPress blog… My assumption is that you already have a WP blog that’s not in any way related to WooCommerce or any of the WooThemes.

The answer is Yes, you can link a WooCommerce store to your original WordPress blog (or to any type of blog or website) and the best way to do it would be to build the store on a sub-domain. For example, let’s say the URL to your original WordPress blog is: MyWpBlog.com

You could build your WooCommerce shop on the sub-domain: Shop.MyWPBlog.com

Then link your original WP blog to: Shop.MyWpBlog.com via a “Shop” link / page on your main blog. This sub-domain method is a common way to link an original site up to a new eCommerce site. The main benefit of using a sub-domain is that the URL is basically the same.

Or, you could also create your WooCommerce shop on a new high level domain (e.g. myWooCommerceStore.com) and link up your original WP blog to it the same way.

Either method should work well. Please let me know if this helps answer your question and feel free to ask if you have any more questions going forward.

Best of luck with your site!

Adam

Reply

John February 2, 2013 at 5:56 pm

As with other people commenting, I’ve learned a lot from your videos and thank you for them.

My question is similar to Alexa’s. In fact, I may be asking the same question, but since I, too, am a novice I want to make sure I am understanding correctly.

I built a site (thebaukegroup.com) using the Woo Canvas theme. Now, I want to add WooCommerce to it (specifically, to the thebaukegroup.com/foryou sub-site).

I want to use the WooStore theme for my ecommerce. My questions:

– do I need to set up a subdomain for my store and use WooStore on that (similar to what you suggest for Alexa)?
– or, can I simply add the WooStore theme to my existing site, then have a page
that only uses that theme? Specifically, someone would select the, say, “Shop” page then be able to use the entire WooCommerce/Shop theme from there?

I’m sure this is quite basic, but for some reason I can’t get my head around it.

Thanks,

John

Reply

Teddy Triton Teddy Triton February 6, 2013 at 10:14 pm

Hi John,

Thanks for your question and I’m happy to hear that they’ve been helpful. You pose a great question. It’s a question that we’ve had asked quite a few times so I decided to create a full tutorial dedicated to answering it. You can view our new tutorial on “How to Add eCommerce Functionality to an Existing WordPress Site via the use of WooCommerce and Multiple Installations of WordPress on the Same Domain Name” here…

How to Add a WooCommerce Store to an Existing WordPress Site

Please let me know if this helps answer your questions and thanks again for the support!

Adam

Reply

Phil February 6, 2013 at 3:34 am

I am watching the 5 videos by Adam for setting up a WooCommerce website-World Cup Tees-plus some other videos. Very good videos-no problem there. I am a retired aerospace accountant – learning curve is bit tough grasping all the stuff needed to be successful with my website. I am not trying to get bogged down in details but need to understand more clearly the layout of the website pages, the size, how much room do I have to add content/whatever and where do I place it on the page(s). I know under WooThemes setting there is Layout Manager, my site width is 940 px and I can see the boxes with vertical and horizontal columns. But these settings don’t explain beyond what is written on the settings page. Hope this is not confusing-don’t know that I am making my point clear enough.
Thanks
Phil Collilns

Reply

Teddy Triton Teddy Triton February 6, 2013 at 11:24 pm

Hi Phil,

Thanks for taking time to watch our WooCommerce tutorial videos. I took a look at your current site, PhilCollinsStudio.com and you’ve done a great job with it.

WordPress and the specific theme that you’re using does a good job of taking care of most of the details in terms of page size. You really only need to focus on adding content to your pages and blog posts. Your theme should take care of the rest in terms of sizing it appropriately with the layout of your theme. I’m not sure that I’m completely following you in terms of your specific question. Please provide more details as to what you might be struggling with and I’ll do my best to point you in the right direction.

Thanks,

Adam

Reply

Luck February 24, 2013 at 1:12 am

Hi,
First of all i would like to thank you and Adam for very helpful tutorial on you tube. They help me so much to build my website. I do still have a lot to learn and to do though. My question is about search engine, when i put my website name on yahoo. It never show up on front page or anywhere so i wonder why did that happen and also if i would like to get more traffic to my site what is the best way to do? I do have a lot more detail question about how to customize my site but i will ask you next time. Hope this won’t bother you too much.

Thanks again

Luck

Reply

Teddy Triton Teddy Triton February 24, 2013 at 5:00 pm

Hi Luck,

Thanks for your question and for the positive feedback. Letting us know that our WooCommerce tutorials have been helpful is very much appreciated. It takes time before new sites are indexed and start to rank for keywords in the search engines which is most likely while your site doesn’t yet show when searching on Yahoo. However, one thing you’ll want to check right away in the WordPress admin is that the site is open to the search engines. Here’s how to do that…

In the WordPress admin go to Settings > Reading > you’ll see a “Search Engine Visibility” check-box… make sure that box is NOT checked as shown in the screen capture below…

WordPress Search Engine Visibility Settings

In my opinion, consistently adding quality content to your site (mainly via blog posts) is the best way to drive organic traffic to your site over time. The more quality content you post, the more keywords that that you’ll rank for which sends traffic to your site from the search engines. In terms of quality content, I’m referring to blog posts that…

1. have a word count of at least 550 words or more – the longer the post the better

2. the content is completely original and helpful – you don’t wan to use recycled content

3. include interesting images and video if possible

4. are structured properly and include your main keywords in the title, H1, H2, and H3

It definitely takes time and a consistent effort to get your site ranking in the search engines but it’s worth the investment.

Let me know if this helps and feel free to ask whenever questions pop up. Thanks again for your support!

Adam

Reply

Luck February 26, 2013 at 2:36 pm

Hi again,
Thank you so much for your suggestion. It defenitely helps me a lot. I wonder that in your opinion google adwords and bing ad will help at all on traffic or should i invest in something else at the begining stage. I am not so sure when you mentioned H1 H2 H3 where are they and what is it, seem to be silly question but i do not have any clue about this.
My other questions are about the font on mystile theme, i do have a difficult time to control size and face of the font. Is there any trick or plug in to help on this? Will you be able to make more tutorial on mystile theme. It is hard to find info on this theme. If you can i would be really appreciated. Thank you again for your help and very useful website!

Luck

Reply

Teddy Triton Teddy Triton February 27, 2013 at 10:05 am

Hi Luck,

I’ve had decent success in the past in terms of driving traffic to my sites with PPC (Pay Per Click) marketing. If you have a marketing budget, then PPC can be a very good investment. Google Adwords and Facebook’s PPC are where I would start. I’d start small at first and make sure that the money I’m spending on PPC actually produces sales. Also, if you’re going to spend money on PPC, you should definitely setup a strong opt-in offer to build an email list.

Alternatively, I think a better way to invest your marketing money would be to invest in content. Find a good writer and pay them to write a few blog posts each week. The posts could be on anything related to your business or the products you sell. In my opinion, investing in content is a better way to spend your money than on PPC when starting a new site. Overtime, that content will result in natural / organic search traffic. In terms of finding good writers… I mainly use Craigslist when looking for writers for my sites but there are plenty of outsourcing sites that work as well.

We do plan on making more Mystile theme tutorials in the very near future. You should be able to change the font size by going to… Mystile > Theme Options > Typography

Let me know if this helps answer some of your questions.

Thanks,

Adam

Reply

Rob Sanders February 25, 2013 at 4:19 am

This site has really helped me put together a WooCommerce site for a friend of mine, and look forward to when it is finished off. I have spoken to them about setting up affiliate products, and was good to read that depending on the vendor, they will get credit for up to 60 days for any purchases made outside the site.

I have the site on a testing server (www.kolonel.net/shop) and depending on the screen size, found that the front page either has too much whitespace, or the footer bar sits up too high. Any recommendations ?

Keep up the good work !!

Reply

Rob Sanders February 26, 2013 at 2:50 pm

Hey guys,

Love your work, learning something every time i watch your videos.

I am currently working on the Woo Commerce setup (www.kolonel.net/shop) and find that the front page will have too much spacing, or the footer sits too high depending on monitor size. What would be the best workaround ?

Thanks again.
Rob

Reply

Teddy Triton Teddy Triton February 27, 2013 at 9:48 am

Hi Rob,

Thanks again for your support and encouragement to make more tutorials – it’s really appreciated. I’m not sure if there is an easy way or workaround in regards to reducing the spacing of the home page. It’s a question that other people have raised with the Mystile theme as well. To reduce the spacing on the homepage and footer of the Mystile theme you’d most likely have to add custom css.

If anyone else out there has used the Mystile theme and knows of a good way to reduce the spacing on the Homepage and in the footer please share it with us. You’ll be saving many people from pulling their hair out. Thanks,

Adam

Reply

Steve March 30, 2013 at 6:24 am

I have just started to build a WP website based on Woocommerce. I would like to follow all the video tutorials but I use the Mystile theme. Will the tutorials still make sense if I am not using the same theme used in the tutorial?

Reply

Teddy Triton Teddy Triton March 30, 2013 at 2:53 pm

Hi Steve,

Thanks for your question. Yes, even though most of our WooCommerce tutorials were created with the WooStore theme, they should still make sense if you’re using the Mystile theme. We also plan on releasing more Mystile theme tutorials in the near future so please watch for those. Please let me know if you have questions / need help going forward and best of luck with your site.

Adam

Reply

Dan April 2, 2013 at 8:42 pm

I’m really struggling to add a second products page under the existing base page. You know the theme comes with “shop” , but I want to have a separate page for the many different products like t-shirts, shoes etc. I would really appreciate some help. Thanks

Reply

ali July 11, 2013 at 1:01 pm

Sir.
I wanted to make a WordPress website, which will sell printer cartridges and refill them… I wanted a front page that gives an introduction of our business. The advantage of refilling and some other aspects.

The product classification should contain 3 categories .eg. model: hp,canon ,xerox. The second category should display the cartridge model used in the printer.[all the categories should be contained in box as a dropdown option and related to the model selected in option.] It would be like sorting or filtering the search. Plz guide me to the best possible WordPress theme and plugins(free). Each cartridge would be having 3 options, like eco-fill, normal etc…
plz rply ASAP

Reply

Teddy Triton Teddy Triton July 11, 2013 at 2:52 pm

Hi Ali,

Thanks for your questions. There are a ton of really good WooCommerce compatible themes that would work for the type of printer ink cartridges site you're describing. The free WooCommerce plugin will give you the functionality you need in terms of product categories, attributes and variations. So if you're looking for a good, free WooCommerce theme then I would suggest looking at Mystile, Artificer and WooTique. Just go to WooThemes.com and you'll find them. If you're looking for premium themes that are compatible with WooCommerce you'll find them there as well.

Let me know if that helps or if you have more questions. Thanks,

Adam

Reply

Pretty August 21, 2013 at 5:19 am

Hey… i wanted to make the homepage of my site the shop page… however, the options for the shop base page in page setup doesnt have "home"… but it has everythin else.. Please help me out here..

Reply

Teddy Triton Teddy Triton August 21, 2013 at 9:03 pm

Hi – To make the homepage of your site the Shop page do the following… In the WordPress admin go to Settings > Reading > select "A static page" radio button > in the Front page drop down select "Shop" > for Post page select "Blog"

That should make the homepage the Shop page.

Reply

Leave a Comment

{ 1 trackback }

Previous post:

Next post: