This flatsome theme tutorial video will show you how to make an ecommerce website with wordpress and the flatsome theme. So if you like the video tutorial, make sure you give them a big thumbs up and a subscribe on their youtube channel as well.

The goal here is to teach you everything about the flatsome theme and wordpress so by the end of this video, you have a professional ecommerce website.

Watch How to Create an Ecommerce Website with WordPress 2021

This is the text tutorial. In the video description and this video, we may include affiliate links for you to use. They help support the channel and help us make videos like this. 

Disclosure: Hostinger and our other affiliates pays us a commission if you use our link or coupon code. No charge to you, so thanks in advance.

I’m all about saving money and helping you create a site that makes money from Day 1. You can pay someone thousands of dollars to create you the same site, or you can follow this tutorial.

I say the above in all seriousness. Someone just emailed me saying they used one of my free tutorials and charged someone $1,200 to build the site and they have no technical background. Sad but it happens. Don’t get taken advantage of!

What You Need for this Flatsome Theme Tutorial

What You Don’t Need

What You Will Need

Step 1: Hosting and Domain Hostinger (save 90%):

We need a domain and hosting in order to run a website. Hosting lets you store your content and run your website so it loads for your visitors.

Go to Hostinger for a free domain and 90% off hosting.

We also have a coupon code: SUPER10 for an extra 10% off. Make sure to use it to save some additional money. (use the code SUPER10 for an extra 10% off!)

You can choose any plan you want. I recommend the WordPress Starter plan.

Watch the video if you need any help with any of the options or signing up.

Step 2a: Install WordPress

Now that we have our domain and hosting, we need to install wordpress so we can build our online store with the flatsome theme.

To install wordpress for your ecommerce website

Click to create a new website

Choose your domain and add it

Once it is added (for free) select install a new wordpress website

And you’re good to go!

Make sure you save the login information but we will change our password together in this video in the next section.

For now, click to go to your wordpress website dashboard.

Step 2b: Login/Change Password

We want to make sure our ecommerce website and online store are secure. This starts with having a secure password to login to your wordpress website.

If you want to change your admin password

Step 3: Flatsome Theme

Here is a link to the Flatsome theme ..which is what we are going to use to learn how to create an ecommerce website with wordpress.

I talk about why the Flatsome theme is so good in the video but I can list out a few bullet points for you here.

If you need to go to the themeforest website for the Flatsome theme, just click on the link.

Step 4: Install Theme

Now we need to install the Flatsome Theme. Make sure you downloaded the theme from Themeforest first.

Once you do that, go back to the wordpress dashboard for your ecommerce website

  1. Hover over appearance
  2. Click on themes
  3. Click on the add new button at the top
  4. Click on the button in the middle
  5. Find the theme zip file. It needs to be the zip file so it should be something like if it is just a folder, you cannot upload it.
  6. If you have a folder and not a zip file, go to the downloads folder or wherever you saved the file. Right click the folder and compress it to turn it into a zip file
  7. Click upload/install
  8. And then activate the theme and we are ready to rock!

Step 5: Install Plugins

Now we need to install some plugins to really build out our ecommerce website. Plugins are tools that are really going to help us out with functions and security and speed for our wordpress website.

To install the required plugins, there might be a link at the top of your wordpress dashboard that the theme recommends. Go ahead and click install for those and then activate them.

If you need to install some additional plugins, you can add more by going to your online store wordpress dashboard, find the plugins tab on the left side, hover over it and click on add new.

These are the plugins we need to install and activate.

One we have call of these, we are ready to really get going on learning how to build an online store with wordpress and the flatsome theme!

Step 6: Demo Content Demo content:

Here is a link for the demo content.

To install the demo content for your online store / ecommerce website with wordpress

You can edit the images in your media library as well using wordpress. Just click on the media library button when you hover over media.

Step 7: Woocommerce Settings

The woocommerce settings are not hard. But they do take time to go through. This is necessary if you want to make sure the online store you are learning how to build is up and running.

There are a bunch of tabs that we go through to set up our ecommerce business, to integrating payment options, shipping, and everything else. If you follow our video tutorial on how to create an ecommerce website with wordpress using the flatsome theme then you will be able to set up all the settings.

Let me know if you have any questions.

Step 8: Choose Homepage Template

The great thing about the flatsome theme is that we don’t have to build anything from scratch. We can use pre designed templates to customize our online store.

I think this is a great way to build something professional that looks great and also saves you a lot of time so you can start selling and making money instead of spending a bunch of time trying to figure out how you want to design your ecommerce website with wordpress.

So if you want to do what we do in the video, just go to the demo website of the flatsome theme, find an online store homepage that you like.

Now we’ll go through the steps of customize this site a little bit later πŸ™‚ But we are on the right step to building our own online store.

Step 9: Theme Settings

In the theme settings, we cover everything from how to choose your header, the colors, the font styles, and layout options. Let me write out what we put into each section here for you, just incase I go to fast in the ecommerce video.

Header tab – where you can change the header options and layouts

Drag and drop whatever you want into the header section

You can customize your top bar and add your logo

I was going to type out this entire section but it doesn’t really make sense, since you will most likely customize your ecommerce website however you want. Instead, I will just add the color codes and the link to the free logo making site.

Step 10: Create Logo

Make a logo at Logomakr

To upload your free logo, go to the header tab and click on logo and site identity

Step 11: Colors, Layout Settings

Color codes for this demo online store ecommerce website –

Step 12: Customize Homepage

In this section, we customize most of our homepage. From adding slider images to text. To customizing featured product widgets and other sections.

All you need to do is either use the modules on the left side and double click on them and expand them to edit OR you can double click on the section on the preview side and get the edit section.

Add your edits and you can add background overlays for your images if you want as well.

Pro tip: Make sure you add links to your buttons and images you want to link. You can also add a # if you want to make a static link and come back and update it later.

You will not see featured products or categories right now since we haven’t make them yet for our ecommerce website. But we will soon.

Make sure you click the update button to save your changes!

Step 13: Optin Forms

I want to take a break to talk about how to create an option form for our online store because we have a section on our homepage for this.

Step 14: Create Products

An ecommerce website would be incomplete without being able to create products to sell on our ecommerce website

In this video, we are going to make a bunch of products: single products, variable products, virtual products and affiliate products (for example, if you want to sell amazon products).

So in the next few steps we will show you how to make them all and hen you can do it on your own.

Step 15: Single Products

The first type of product we are going to learn how to make is a single product. This means that we only have one option, no different sizes or colors or options.

To make a single product, just go to your wordpress dashboard and hover over products and click on add new

Step 16: Variable Products

Variable products are very similar to single products. The only difference is that we have to add all the different options.

You can add any type of variables that you want.

You can also add different price points for your variables.

You can follow all the steps like a single product, except for the product section.

Step 17: Save Variables (attributes)

Typing out variable options for your ecommerce website products each time is time consuming, so in this section, I’m going to show you how you can save the variables so you can add them with a click or two instead of typing everything out as you make your online store with wordpress.

Step 18: Virtual Products

Virtual products are products that you sell but do not have a physical product.

For virtual products and downloadable products, just check the boxes and then you can upload the files you need to.

Everything else is the same

Step 19: Affiliate Products

For affiliate product, you need to go to the product section and select affiliate products.

Then you can add your links and customize the button text.

Step 20: Shop Page Layout

To change your shop page layout, you can go to the theme settings to woocommerce

If you want to customize your widgets, then go back to the wordpress dashboard

The great thing about this tutorial is you can build any type of online store you want!

Step 21: Product Categories

To edit your product categories for your online store, just go to your wordpress dashboard and hover over products and click on categories.

I like to delete he uncategorized option. To do that, you need to set another category as the default first.

Step 22: Blog Posts

Blog posts are very easy to make. All you have to do is go to the wordpress dashboard on your ecommerce website with wordpress

Hover over post and click on add new

Publish when you’re done!

Step 23: Add Gallery

In this video tutorial, I wanted to show you how to add an image gallery for your blog posts as well. So if you want to do that to showcase some of your online store products, then just click on the plus button on your blog posts and find the gallery module and you can add your gallery that way.

Step 24: Add Instagram

If we go back to our homepage, we will see an instagram feed module. To integrate that into your website, you need to turn your instagram feed into a business account and then connect it with facebook.

You can follow the directions here – instagram integration with flatsome theme

Step 25: About Page

The about page uses a pre-designed template from the flatsome theme. All we do is find the online store about page we like, change the title and and customize it however we like. Super easy!

I hope you are enjoying this tutorial on learning how to build an online store using wordpress 2021 and the flatsome theme. I hope you are realizing how easy it is to create an ecommerce website with wordpress 2021.

Step 26: Contact Page

The contact page uses a pre-designed template from the flatsome theme. All we do is find the online store about page we like, change the title and and customize it however we like. Super easy!

Step 27: Footer

For the footer, what we need to do is just go back into our widgets on the ecommerce website and add any of the widgets you want.

After that, we are going to add our menu a little later. But if you want to change the style of your footer, you can do that in the theme settings for the flatsome theme website.

Step 28: Delete Pages

Now that we have all the pages made for our ecommerce website, I want clean things up so we don’t have any excess pages.

The easiest thing to do is watch the video on learning how to make an ecommerce website with wordpress 2021 to see all the pages we keep and delete so you only have the pages you want for your online store.

Step 29: Edit Permalinks

One of the things we need to do is make sure our URLs look good for our ecommerce website so they’re easy to type in.

So we go to the edit page on each of the pages for our online store we are learning how to make and we edit the permalink on the right hand side.

Make sure you click update when you make an edit!

Step 30: FAQ Page

For any online store or ecommerce website, we want to make sure we have a frequently asked questions page to help our customers out.

So we are going to create a new page. And we can just add an accordion module and add a title and a text box for an answer πŸ™‚

Add as many as you want.

And that’s it!

Step 31: Terms and Conditions Page

The terms and conditions page for our ecommerce website is important because we need to link this page in our check out process for our online store we are learning how to build.

So create a new page and title it Terms and Conditions

Add a text box and type in your terms and conditions.

Publish the page

Then go to your woocommerce settings and go to the advance tab and set the terms and condition page

Make sure you click save!

Step 32: Menus

To create our new menus for the online store we are learning how to create for free using the flatsome theme, please go to your wordpress dashboard and hover over appearance and click menus

We are going to delete our menus and create new ones.

Create a new menu

Title the menu

Select to make it show up as the main menu (and footer for the second menu)

We also will need to make a top bar menu!

Add the pages and links you want

Click save

Do this for the footer, and the top bar for your online store.

Step 33: Mega Menu

Having a mega menu just adds to the professional look of your ecommerce website. So I wanted to show you how to make one here.

Step 34: Coupon Codes

Coupons can be created for your customers by going to your wordpress dashboard of your online store and just hover over coupons and click add new coupon

Step 35: Test Transaction

All I do here is run through a test transaction to show you that our online store that we learned how to build works…and it does!

If you have any issues with your online store or ecommerce website that you learned how to make, please let me know in the comment section of the video.


Congratulations on learning how to make your own ecommerce website with wordpress 2021 using the flatsome theme! If you need any help customizing or building your online store, please let me know! I hope you enjoyed this tutorial using the flatsome theme to create an online store.

All the best in 2021 and beyond!

We will be coming out with more tutorials using the flatsome theme and wordpress to build more websites, online stores, and talk about ecommerce everything soon.

Have a great day!