WordPress E-Commerce Development w/ WooCommerce & Storefront

Let's review the basics of e-commerce!

When you are creating an online store is key to define an audience, doing this and you will be closer to success!

The most important in an online store is the security, let's see some considerations that you should keep in mind!

Why you should use WordPress for e-commerce?

WooCommerce is the best option, flexible, powerful, here's why you must use WooCommerce for your next project!

A lot of clients will tell you that Shopify is cheaper (notice CHEAPER not Better) than WooCommerce, but, this is true? let's see some examples!

Let's install WordPress localy, i'm going to be using MAMP, but you can use WAMP, XAMPP, Bitnami or Flywheeel

Let's install WooCommerce 

Let's become familiar with the WooCommerce Interface, let's create our first product

You can add a description for your products, let's see how in this video!

If you have several images of the same product is a good idea to create a gallery, let's see how  in this video

You can manage the inventory of your products in WordPress too! let's see how in this video!

Setting weights and sizes for your products will make more precise calculations when you setup a live rates shipping plugin, let's see how in this video!

Here's the difference:

Upsell: When you want to sell a more expensive / more profitable product when the user is checking a lower price product

Cross Sell: when you want to sell a complementary Product

If you have different color and sizes for your products, is a good idea to create a Product Variation,  let's see how in this video

Let's continue working with product variations!

You can also add global attributes, this will are attributes that can be used in any product

If you wanna sell music, audios, images, logos, or something, Downloadable products are here!

Storefront, a beautiful WordPress theme specially designed for e-commerce, let's install this theme

When you activate storefront it comes with a section specially for the main categories, let's see how you can add the images there

Let's see how to manage shippings in WooCommerce

Let's add a Flat Rate for the shippings!

Let's enable Free Shipping for our store!

Let's customize the shipping labels

Let's add support for shipping to other countries

Let's see how you can support all the rest of countries

Let's add a Shipping class and apply it to a Product

The general tab contains most general adjustments, but is really important too!

In the products tab you can manage the inventory messages and more, let's overview this tab!

The Tax tab is really powerful and complex

Let's take a look at the shipping tab

The Checkout tab has some nice adjustments, in this video i'm going to show you an overview

Let's review the last 3 Tabs

Receiving Payments will define the success for your store, check for a solution that works well in  your country, but also is important to know the fees!

Let's see how you can configure PayPal Express

Let's review some other options avaiable to receive payments!

In this video let's see how you can create a coupon and the options available

Let's create more content  the About Us and the contact us pages

A child theme is a safe way to modify an existing WordPress theme, so let's review the basics of child themes!

Now that we know what's a Child Theme let's create a child theme of storefront

In the course materials for this video, you will find the finished version just in case that you ran into trouble :)

When you're working with WooCommerce you have 3 ways to make changes in your store

So let's see a small example of using CSS!

Overriding template is less common in my experience, but let's see how you can override a WooCommerce Template

Hooks are the most powerful and common way to modify an online store, let's see how we can make some changes

Another way but less powerful and more limited is the customizr, let's add the final changes before jumping into the code!

In Storefront you have 3 different menus available, let's create the Main Navigation first!

The Secondary Menu is great for a Social Media Menu, let's create some links

Also we have a 3rd menu specially designed for mobile

So let's add some CSS to the Main Navigation

Let's add some CSS to the Mobile Menu