How To Create A Killer Ecommerce Website | Complete Webshop Tutorial

hello people my name is Ferdy, and in this  tutorial I will show you step by step how   you can create an amazing e-commerce website using  WordPress woocommerce and the Astra theme We will   create this High converting eCommerce website  and in my case I will be selling game consoles   and of course I do not expect you to sell the same  things but through the principles I teach you in   the tutorial you'll be able to sell anything to  anyone in the world and the great thing is that   we can put everything on autopilot so first I  will show you how to create six different kinds   of products the first product we'll create is a  simple product what does it mean it only has one   option in this case a PlayStation 5 controller it  can also be a cap or sunglasses any product that   only has one option after that we will create  a variable product what does it mean there are   multiple options so I can choose a different color  for this case but also a different Edition so the   digital Edition or the disc Edition and when I  click somewhere you see that the image adjusts   and also when I go for the disk Edition you see  that it costs more money so for every variation   right now there are eight I can adjust the price  the stock the image and that will help the visitor   to navigate to all the products you have to offer  on your website the next product is a digital   product it can be a coaching call or service that  you offer the fourth product we will create is a   digital downloadable product like an ebook stock  images software or anything digital that you want   to sell we will create an affiliate product that  means that you promote someone else's product or   service and when you sell that through your unique  affiliate link you get a commission so if you have   my affiliate link if I click on it and somebody  buys this through my unique affiliate link I get   a commission and let's go create a group product  where you can have multiple products on one page   so the PlayStation with three extra controllers  and a wireless headset and using the extra theme   we will configure our product page in a way that  it will look better and it will increase the   sales then we will configure the shop page that  displays all of our products we can change the   amount of columns the way we display our products  the information that we show about our products   and much more and then when people visit our  website they can browse to all the products to the   homepage or to the category Pages or by searching  they can add products to their cards and then   they can view their cards and adjust things and  when they go to the car page there's a beautiful   overview of all the products in the cards and the  total price you have to pay and if is the one to   adjust something they just click and everything  will be updated here below people can add coupon   codes and I will show you how to configure coupon  codes it's a great way to increase your sales for   new and returning visitors and there are a lot of  things we can do we can work with a fixed discount   in money or in percentage we can create a free  shipping coupon code we can create coupon codes   for specific products and limit the use of coupon  codes for instance only the first 20 people can   make use of this coupon code or every user can  use this coupon code twice and every Cuba code   can also be activated for just a specific time  we'll make sure that our website calculates the   shipping of your customers on autopilot based on  the weight of their order or based on the total   amounts or based on the shipping address of the  buyer we can also give away free shipping from   a certain amount so when people spend more than  100 they get free shipping and that can motivate   people to buy more stuff on your eCommerce  website using the extra theme we will make   this checkout experience real smooth for both new  visitors and returning customers and if they want   to change something in the cart they just click  here and they can adjust everything and then every   everything will be updated I'm really excited  about this part of the tutorial payment methods   I'll show you how the money that people pay on  your webshop goes directly to your bank account   visitors will be able to pay with credit cards  PayPal klarna and a lot of other payment methods   and then at the right you see Texas we will  configure the taxes in a way that people will   pay the amount based on where they come from or if  they buy it as a company or as an individual and   also Texas will be put on autopilot so everything  will be calculated automatically we'll talk about   the emails people get when they buy something on  your website and how to sell those emails and I'll   do handle on process incoming orders we'll also  create a header from scratch and take inspiration   from the most successful web shops in the world  visitors can navigate through the categories and   products check their cards and search for products  with a smart search filter they see the first   results already and when they click on few all  results they will see all the results that match   the search term also a great way for visitors to  find the products they are searching for we can   make the header sticky transparent and also decide  that only certain parts of the header will stick   with us after that we will take a look at the  footer with more information about our webshop   through the tutorial we'll talk about designing  your website the right way why and how you can   add blog posts to your website if you want to how  to give visitors discount when they sign up for   your newsletter and of course we'll talk about  making your website responsive for all devices   last but at least we'll have a professional  looking homepage where you can highlight   certain products make sure that people can  find the products they are searching for and   with astra's global pellets it's really easy to  change the look and feel of the website just like   that so changing your website from this look to  this look or this look or this look it's just   a matter of a few clicks when you follow all the  steps in this tutorial you are able to create an   amazing e-commerce website automate everything and  start selling products to your local area to your   country to your continent or to the entire world  if you like what you've seen so far then please   like this video feel free to subscribe and if you  have any question feel free to leave a comment in   the video or maybe you want to thank me feel free  to thank me in the comments when you think that   this is a great tutorial and a good fit for you  so two more practical things when I go too fast   for you you can go to the settings of the YouTube  video and change the playback speed to a slower   one or you can click on the left arrow on your  keyboard and go back five seconds in the video   in the description of the video I've timestamped  so if you want to go to a certain part of the   video you can click on one of the timestamps  and you go directly to that part of the video   okay let me show you the four steps we'll take  in order to create an amazing e-commerce website   so there are four things we need to do if you  don't have it yet I will show you how you can   get your own domain name and web hosting and I can  give you 70 discounts after that we will install   WordPress then we'll get the extra theme and then  we will create our amazing e-commerce website if   you already have a domain name and web hosting  and you have already installed WordPress I will   show you on the screen right now where I need to  go in order to continue with this tutorial now   it's really time to get started the first things  we need are a domain name web hosting let me tell   you what a domain name is and what my posting is  a domain name is the address of your website so   if I would go to facebook.com facebook.com is the  domain and everything you see on this website is   the web hosting web hosting is a really fast  computer that is turned on 24 7 with all the   information on your website you can rent it for a  few dollars per month it's like having a house if   you want people to visit you you need to give them  your address and your domain name is the address   of your website so your domain name is the address  of your website and everything you see over here   is the web hosting if Facebook would have no  domain name it would look something like this   and that can be quite a challenge to Remember  by heart and that's why we need a domain name   and when we have a domain name we want to display  things on our website and that's why we need web   hosting if you have that already that's great  then you can skip this part if you don't have   it go to web hosting20.com hit enter and then  you can click on the link go to siteground I   love siteground siteground is in my opinion  the best web publishing provider there is   and I'm not the only one with that opinion in  a Facebook web hosting group with more than 5   000 members siteground is mentioned most when it  comes to the best web hosting provider and I agree   with them I scroll down a bit and there are three  plans you can choose and the best value for your   money is to grow big plan what is the difference  between the grow big plan and the startup plan   here with the grow big plan you can have unlimited  websites look at this unlimited websites with the   startup playing only have one website and all the  time people are upgrading from startup to grow big   because they want to create more websites so I  suggest real big and can always upgrade later if   you want to over here you can have unlimited  websites 20 gigabyte of webspace well most   websites are 200 megabytes so you can have up to  100 websites with this plan you can have up to 100   000 visits per month and I hope you will get  that because that will mean a lot of business   for you and then if you have that you can always  upgrade to the Go Geek plan and then you have 40   gigabyte of web space you can have up to 400 000  visits per month this is the plan I have right   now because I have a lot of websites and a lot of  visitors but keep in mind you can always upgrade   later so I will start with the grow big plan and  more great things about it you can have free SSL   so your website will be secured with some web  hosting providers that cost money here it is   free you have daily backups that's amazing if you  somehow mess things up siteground got you covered   you will have a backup of the day before and of  the day before that free CDN that means that your   website will be fast throughout the whole world no  matter where the visitors come from your website   will be blazing fast you can have unlimited free  email accounts and really important this is great   for e-commerce and if you somehow really don't  like it you have a 30-day money-back guarantee   so there's no risk for you so I will choose to  grow big plan by clicking here now we need to   choose a domain name if I would say facebook.com  I want to buy facebook.com I click on proceed of   course it will say if chosen invalid domain name  because it's already taken so you need to choose   a domain name that is still available what I  would advise everybody in the world to do is   get your own domain name with your first name  and your last name I hope it's still available   for you otherwise you can use a company name or  a custom name and if you offer local Services you   can place your hometown in domain for instance web  design ers the great thing is that you can choose   a lot of different extensions.com.net.org I always  suggest use.com or the local one from your country   I go for console delivery so let's see if it's  still available I click on proceed yes it says   congratulations your domain is available  for registration with your hosting accounts   let me make this a little bit bigger for you now  I can leave some details over here first my email   address jk24co gmail.com I need to create a  password and I need to confirm my password   and then over here I need to say from  which country I am from the Netherlands   and I will fill in my details 30 or Pursuit 30 and  Anna media if you have a company fill your name   over here in your vet slash tax ID if you fill in  your text ID you don't have to pay taxes for this   order it's okay great siteground gives feedback at  once which is nice I'm from this city this street and my ZIP code if I would say is  wrong it will correct me it will   say hey you need to remove the space  and then over here I need to fill in   my phone number and it's really important  that it's the correct number so say Plus   three one six and then your phone number really  important to have this over here the country code   I scroll down and depending on where you come  from there can be a local payment provider so if   I would enter this website from the Netherlands I  would see I do over here you will maybe see PayPal   I will use credit cards so I will fill in my  details and then we go to the purchase information   we go for the grow big plan and the data center  we can choose a few depending on where I want to   focus on if you want to focus on people from the  United States keep it in the United States if you   want to focus on people from the Netherlands or  somewhere near the Netherlands choose Germany or   Netherlands I want to go for for people worldwide  so I choose the USA and the period is 12 months we   pay 6.69 per month and then we can have unlimited  websites on our grow big account which is amazing   and then if we scroll down I highly urge you to  get domain privacy it will cost you 12 per year   but it will save you so much spam because if you  don't turn it on a lot of companies can see that   there's a new domain name with your personal  information with your phone number your address   your email account your email address and then  they can send you spam emails like hey I can make   a logo for you I can do SEO for you you don't want  that so for twelve dollars you don't have that   then I scroll down and I will pay a total amount  of 110.27 it can be a little bit more or less with   you depending on where you come from and with this  amount you have a domain name or web hosting for a   complete year and you can add more domains to  your account and create multiple websites and   they are all blazing fast and there's a great  support if you get stuck somewhere I confirm   that I've read the terms service and I agree with  them and I would like to receive news updates from   sitegrounds if you got it through webhousing20.com  you don't pay more but you get amazing discount   and I do get credit for it so it's a win-win  situation and then I click on pay now   and then the great thing is that our website  will be live immediately we don't have to   wait for 24 hours it will be live at once  if everything goes right you should see   this right now and that's amazing and then  I want to congratulate you with your domain   name and web hosting if you don't see that  it can be that you see something like this   if this case fill in the confirmation number you  get in the text message and then you should be   able to proceed and in some cases siteground will  put an amount on your credit card account and you   need to fill in that number so they know for  sure it is your credit card account you can do   that by going to your account or your credit card  account or by calling your credit card company I   had to call them I want to check everything so  you know exactly what to do in every situation   I hope both of those confirmations do not appear  for you but now you know what to do when you see   those two screens so let's continue and my account  was successfully created how great is that I can   proceed to the customer area then I need to log in  with the details I use to sign up for sitegrounds   now it says welcome 30 and here we can set up  our website but what I rather do I rather go   to websites then it says over here set up  incomplete so I click on finish site setup   then I choose my domain name which  I have over here I click on continue   and I want to skip and create an empty site I  don't need those two tools I scroll down and I   click on finish and now it says it will take less  than two minutes before your website is created   and outside your website a Witcher domain is  created and I want to go to the site tools by   clicking here the first thing I want to do I want  to make my website secure so I go to security   SSL manager then I select my domain  name and then I select let's encrypt   I click on get this can take a minute so we have  to wait there it is now I can configure the https   but what I rather do here below I go to actions  enforce HPS and then I turn this on and that's it   now I go to Wordpress install and manage  then I want to install WordPress even if   I'm going to install woocommerce I rather  start with WordPress so I click on select   then I choose my domain name I can choose the  language for my website the installation path   that means that I can install the website on  my domainname.com forward slash new or test   but I'd rather install this on my main folder  then I need to create a login name for WordPress   and a password and an email address then I scroll  down I don't need to have the WordPress starter I   click on install and WordPress will be installed  on our brand new domain name and there it is   now WordPress is installed on our brand new  website so what we have we have an admin panel   I open it in a new tab and we have the website I  open it also in a new tab then I close this window   what we see over here is the back end of our  website here we're going to configure our website   create Pages create blog posts upload images and  then over here we can see the front and this is   what people will see when people enter your domain  name right now they will go right to this page   we are live a great thing is that our website is  also secure so this is what people will see when   they enter your website and this is where we can  configure our website well the first thing I want   to do I want to clean up my website so what I will  do over here at the back end I will dismiss this   message then I want to collapse all this stuff  over here or even better go to the screen options   uncheck everything so it will not  be shown so our dashboard is clean   then I want to go to the plugins and for now I  want to remove all the plugins by selecting this   checkbox build actions deactivate we first need to  deactivate plugins before we can remove them apply   and since I've deactivate them I see  that my menu is a little bit cleaner   those two things are not active anymore  book actions again delete apply I'm okay great then I go to the posts there's one  example post how to bring it to the trash   go to the trash and empty the trash  the same with pages I go to the pages   select both pages move to the trash apply  then I go to the trash and I empty the trash   I go to appearance themes and the themes I do  not use right now this one 2020 I don't use that   I delete it okay and this one I will leave it  for later because I want to show you an example   of what you can do with themes then over here at  the right top corner I can edit my profile I can   change the look a few of the back end so you can  choose something you prefer I prefer the default   one right now it says howdy 30 Corp so when I  write a blog post it will say written by Fergie   Corp I rather use my full name so over here my  first name is Freddie my last name is Corpus hook   and then I can change my display name publicity  as 30 corpse and that's what you now see over here   then over here I can have an email  address and this email address is linked   with a graphter account I'll talk about it in a  minute and because it is it has a special profile   picture I can change it by clicking here and then  I go to gravitar I can sign up and if I sign up   with the same email address I use over here then  the image I upload at gravatar will be displayed   over here and also in your website here where  you want to display this so if I've written a   blog post and I want to show my face it will show  this image I can say something about myself so if   I created a blog post and it says something but  the author this text will appear and I can create   a new password and I can update my profile if  I want to go to the front end I click over here   if I want to go to the back end I click over here  so I actually don't need this so this looks better   in my opinion this is how it looked this is how it  looks right now it's cleaner and it helps me to be   productive in creating a beautiful website I want  to go through a few more settings over here at   settings General I want to make my website secure  over here so I'll add an S over here and over here   I probably need to log in again  so if I click on Save changes   oh it's all fine but sometimes you need to log in  again and then we're going to talk about the site   title on the tagline later in a few minutes and  over here I don't want people to register the side   language I can change over here the time zone well  I live in Netherlands so I search for Amsterdam   there it is and then automatically in the  winter and in the summer the right time zone   is selected and how do I want to show the date  July 25 2022 or different I like this one you   can also create a custom one with those codes  but I prefer this one and in the time format I   like to work with pm and am with capitals my  week starts on Monday so I save the changes   so I want to give my website a name right  now it's called my WordPress if I go to   google.com and I search for Justin Bieber the  first organic result over here is Justin Bieber   music it's the website of Justin Bieber and what  do I see over here what's the title the title is   Justin Bieber so if you want to be found on  something on a specific keyword the best you   can do is place it at the left of your title so if  I go to my website to settings General I want to   give this website a title and I'm a photographer  I should not say welcome on my website   I am 30. because then people have no idea what I'm  doing and then when they search for a photographer   let's say in Amsterdam I  scroll down organic results   I see photographer Amsterdam photographer  Amsterdam photography Amsterdam Amsterdam   photographers so be really clear in your site Idol  about what you offer so in my case in this case   PS5 forward slash XBox One series one in  stock we deliver globally so I bought a   lot of consoles and now I will deliver them  throughout the whole world that's my unique   selling point and the tech line can be something  like three see if your console within a week   I save it and I close this and now if I take a  look at the website it looks like this so you have   your own domain name you have your own web hosting  and you have installed WordPress well it doesn't   look too appealing let me show you how we can make  it look so much better using the extra thing let   me show you how to get the extra thing so in order  to make it look better we need a theme and I've   chosen Astra because Astra enables you to create  an amazing e-commerce website within WordPress   so in order to get it we go to 30 corp.com forward  slash Astra Pro hit enter and you'll be redirected   then you can go to pricing and there are a lot  of different packages and I want to make use of   extra Pro this is also great this is amazing but  we don't need that for the website we have in mind   and the great thing is when you get extra Pro or  the essential bundle or the grow bundle you can   use it on unlimited websites so you could become  a web design agency and start making websites like   crazy for all people make a lot of money with it  or you can just make it for yourself it costs 47   per year and it will enable you to create an  amazing woocommerce website in WordPress and   I will show you step by step in the tutorial how  you can do that so you pay per year or you can go   for the lifetime deal I personally use this one  I bought it like five years ago and I can still   use it on unlimited websites and when there are  updates I still get them so I really love lifetime   news because then you pay once and you can use  it for the rest of your life and get updates   and support so if you do the math this is 47 per  year so if you will have a website for five years   you pay around 250 and if you would go for a  lifetime pay 227 so if you assume you will have   your website more than five years then I would go  for Lifetime do if you just want to try it you're   not sure you can always upgrade later then you  can go for the 47 per year so I click on buy now and then I need to fill in my details so I say 30  Corpus hook at gmail I need to create a password   my first name and my last name I would go for extra Pro annual subscription and  I want to pay with credit card and also pay with   PayPal I leave my details over here and I want  to check out with cards and I'm redirected I want   to get extra Pro over here extra Pro and I want  to go for the S5 Pro add-on plugin I click here I go to my website to the back  end I go to appearance themes   I click on add new and over here I search for  Astra there it is extra I click on install now   then I activate it how to get rid of  this one I don't need this anymore now I want to go to plugins at new because extra  Pro is a plugin as an addition to the theme I go   to upload plugin I drag this file which I just  downloaded over here and I click on install now   over here I can close it then  I can activate the plugin great and now I can activate my copy of extract  Pro to get update notifications access support   features and other resources so I click on  activate then I go to brainstorm Force again   I scroll up I go to the licenses and scroll down  and here for extra Pro double click or triple copy   and over here srpro license not active I paste  it I activate license and now it is active and   we see over here that we have so much more  options right now we can make a Next Level   website using Sr Pro and also for woocommerce  there are a lot of amazing additions but we   need to install woocommerce in order to make  use of all those additions woocommerce is a   free plugin that will extend your website with  a web shop so you can start selling products on   your website it is amazing and when you combine it  with extra Pro you can create an amazing website   so let me show you how to install woocommerce  so in order to do that I go to plugins add new   who Commerce and the great thing is  woocommerce is free I click on install now   and I activate the plugin so now we need  to set it up so we need to fill in a few   details I will do that so I click here I  come from the Netherlands this is my address I don't need any tips I click on continue   and I don't want to share my data with woocommerce  to make woocommerce better because I don't want   it to become too good because I will get  overwhelmed like wow how amazing is Jason   I don't want that so in which industry does  the Store operate so what kind of products   are you gonna sell food and drinks Home  Furniture Garden education online learning   you can also say other and describe it I go for  electronics and computers I click on continue   I want to sell physical products and maybe  downloads if that's something you want to do   you can click over there don't use these stickers  money and you just don't need them there are free   alternatives for this so I click on continue  and I don't want to give any information about   this so I just say I don't have any product  yet and I'm not seeing anything anywhere else   continue I don't need this I turn it off and  I click on continue and I want to use the   extra theme which I have already installed  so I click on continue with my active theme   now we've configured woocommerce and what happens  a few pages are created in in a minute I will show   you which pages are created and how you can  make them look so much better using extra Pro   so the first thing I see I don't like those  numbers because then I think hey there's a   new message for me and I'm going to show you  step by step what you need to do so you don't   need those five messages so I click on the  three dots over here I say hide the setup list   now I refresh the page and they are gone so much  better so this is how our website looks right now   there's room for improvements and before  we continue I want to go to the back end   go to appearance Astra options then I scroll  down and I want to activate woocommerce   and Now ladies and gentlemen woocommerce is on  steroids which is totally fine because it will   make our website better and before we start to  create products I want to make this look better   because we need to take a look at this all the  time so how can I do that I go to the customizer   and then I click over here what I can  do now I can upload a logo or maybe I   have a logo maybe you don't if you want  to follow along with images I use in the   tutorial you can go to 30 corp.com forward  slash images hit enter and there they go and then over here I want to select a logo so  I click here and then I can select files from   my computer so let me open this bring it to the  desktop then I go to my images tutorial folder   console shop and there you can find all the images  I have them right now on my desktop so I select my   colored logo open then I want to optimize it copy  paste it in the alt text and in the description I   want to select it skip the cropping and there's my  logo now I want to get rid of this so here we go   I can turn this off display the site title  then I want to change the logo width to 300   and I can decrease it like that and then  I see how big it will be so let's say 200   and 60. great then I want to go to the primary  menu over here I click on it we're going to   take a look at the header later right now I  just want to make it look a little bit more   appealing because we're gonna look at this all  the time and then I go to the store I go to the   design tab so I click here go to the design  tab I scroll down I want to change the colors and the text link color I want it to be this  dark one and when I hover over it I want it to   be the second color and that's it then I scroll  down and go to the menu fonts I want to make it   uppercase so the text transformation uppercase and  I want to make it a little bit bigger or thicker   bolder so I go to medium 500 great now I go back  and I go back and I go to the global settings to   colors and I want to use this Global palette that  means if I create a color over here so I make this   green everywhere Global color was chosen it will  appear so in that way I can change this color   and it will change on a lot of places in the  website over here over here so that's a great way   to save time I will use the color pick eyedropper  it's a Chrome extension it's free I grab this   blue color copy it that's the main color in my  website so I go to the color click on this icon   right paste this color and then the second  color it is this orange one I copy it   go to the second one this icon and I paste code  all the other colors are lagoon so now this   is blue when half of it becomes orange so this  looks a lot better and since we use woocommerce   I want to go back go back to the header Builder   and then over here I want to click on the  plus scroll down and I want to edit the card   yes I click on the cards I change the icon  and I can also turn off the card counts   so we'll take a look at this later right now  I'm okay with this I click on publish closes great okay what I want to do I want to make the  shop page our home page so I go to the customizer   later we're going to change that but for now  I like that so I scroll down I go to the home   page settings now to choose a static page as  the home page and then I select the shop page publish close it so now if we click on the logo we  go to the home page and it says this is the shop   but there are no products yet so we need to create  a few products and before we do that let me take a   look at the pages that are created by woocommerce  the first one is a shop page that's this one right   now then we have the card page so if we products  in our basket or in our cart it will appear over   here then we have the checkout page everything's  empty yet and then we have our account page   so if you've bought something you see your  orders your downloads your addresses so it   is time to create our first product well you  can create six different kind of products   within woocommerce let me show you the first  one a simple product so the first product I   will create is a simple product what doesn't  mean it's a product with only one option it   can be a cap or sunglasses or a PlayStation  5 dual sense wireless controller so that's   what I'll create as my first product it's the  PlayStation 5 dual sense wireless controller   that's the title if I publish this look at this  look at this view the product we have created our   first product wow so if I go to my shop page or I  go to the home page now I see a product over here   so as you see we only have a title No categories  no add to car button yet so let's configure this   further but right now since we create our first  plug it's over here so what is next now we can   have a description of this product so I have  this text over here about this amazing dual sense   wireless controller for the PlayStation 5. and  if I would update it let me see how it will look click over here I see the description over here  what I also can do I can scroll down and over   here there's a product short description this  is the original PlayStation 5 controller so   where does that appear if I refresh the page  that is what will appear over here so here   we can have a small or short description  and then below there's a long description okay right now over here we can have  different kind of products well we   start with a simple product it's not virtual  it's not downloadable it's a real physical   product so I don't check these on  the regular price is 69.99 [Music] but the sale price is 65 dollars  but what I don't like over here I   see a comma I want to have a point and  over here I see Euros so let me update   it and if I want to change that I go  to woocommerce settings I scroll down and I change this to United States dollars and  the currency position the dollar sign I wanted   without a space and a thousand separator is  a comma and decimal separator is a point I   want to have two numbers of decimals because  those are the amount of sense so I go back   to the website to the product and I edit the  product so right now I have a point over here   and when it will be a two thousand  dollars there will be a comma as you see there's a lot of discounts  it's not true so I will remove this   then let's go to inventory the SKU what  you can do if you sell a product from   Adidas or from PlayStation or it's a known  product you are reselling it what you can   do you can search for PlayStation 5 dual sense  controller or Wireless and then search for SKU   and then if you scroll down you can find a the  SKU over here it is this number and you can   use it and why would you want to do that well  maybe people are searching for the controller   but it's out of stock everywhere except at your  place so what they can do now they can search for   the SKU number when I do that look at this they  can find your website based on that SKU number   and if you create your own products then you can  give this your own number stock keeping unit do   we want to manage stock level do we want to work  with a stock well I bought 50 of those controllers   so if I would update it and I refresh the page  it says we have 50 in stock when somebody buys   one or two it will be 49 or 48. so woocommerce is  keeping track of that automatically so let's go   back over here when I sold all the 50 controllers  what should happen can people still buy it right   now I say it's not allowed so when it's out of  stock people cannot buy it I can also say they can   still buy it but I will notify the customer saying  hey right now they're out of stock you can still   buy them but it can be that they will arrive later  or you just say nothing they still can keep buying   and you do your best to send the products as soon  as possible well I turn this to do not allow but I   want to get an email when there are only 10 left  in stock because then I know I need to reorder   them right now it says 10 if I say nothing I  will get an email when there are only two left   so I want to change it for everything in my  website because I never want to run out of   stock and for me it takes some time before the  new PlayStations and the new Nintendo switches   arrive so I want to get a notification  when there are only 20 products left in   by stock per product so I can go to woocommerce  settings then I go to products over here inventory   and then I want to get an email when I only have  20 left in stock and that email will go to this   email address save the changes and since we're  here I want to go to products General I want to   change the weight unit from kilograms to ounces  and the dimensions from centimeters to inches   save the changes I go back to the website back to  my controller edit the product so now we talked   about General and inventory what I can say over  here people can only buy one product per time   for this product and then it will not say add this  amount to the card but it will say add to the card   so they can only buy one well it's after media can  buy 50. should I turn this off update now I want   to go to shipping so here I can place the weight  of the controller well I know it's 15 ounces 15.   2 and the length you can just Google it so if I  would say Google for Amazon and search for this Amazon always has a lot of information about  these products so I can scroll down 7.44 inch by 2.67 and 7.56 this can help when you want to ship  things and you can create automatic calculated   shippings based on the weight or Dimensions  so we'll talk about shipping later we can link   products upsells and cross sales so when we're  on this page of this product we can say hey if   you buy this controller maybe you also want to  buy the supercharger for the controller so and   then scroll cells if you add this to the card and  you view the card and you can also show over here   what else you want to sell so if I would buy  this add to the cart I want to go to the cards it says customers who bought items in your recent  history also about this so something like that can   be shown over here when you use cross cells  attributes we're going to talk about later   when we use variable products Advanced maybe when  people buy this particular product you can say hey   enjoy enjoy gaming on the PS5 and you can change  the menu orders so um over here I have my cards   I have multiple products I can say which product  should be on top I leave it as it is and I want   people to be able to leave a review so I turn  it on and there are more options name your price   that's the plugin so there are extensions that  you can use you can browse all the extensions but uh for now this is perfect for  me everything I need well I talked   already about show description if I  want to I can have my own review as an   administrator but I will talk about reviews  later then there's the right area over here   we can select the product image  set the product image well you can   download this one by clicking here save image f  is and then rename it I will go to my computer console shop I have four  Images over here I open them and then I set this one as the product image   product gallery I select all the other ones  and I hold shift then I can select those three   and this will make the website look  so much better because look at this   I see this image now so I go to  the product now it looks like this is starting to look better already so let's scroll  down a bit further let's talk about categories   right now we have the category uncategorized  well that does not sound or look professional try   uncheck it I create a new category I'm talking  about consoles so I create a category consoles then I want to have a subcategory PlayStation   5 which is a subcategory of consoles and in that  way I can create a beautiful structure in my   website so I select consoles as my subcategory and  look at this now PlayStation 5 is a subcategory   of consoles and I think this also falls in  a different category which is accessories sometimes I find it hard to write so I  just copy it and go to Google I get the   right version copy it and paste it add to the  new category so I have three categories two   main categories and one subcategory and now  if I would update this my refresh the page   you see home consoles PlayStation 5 PlayStation 5  Tool sends wireless controller and if I would go   to one of these categories I see all the products  that are in that category so when I create a new   product and I give it the category accessories it  will appear over here when I click on accessories   so that gives uh your website a really nice  structure and helps your visitors to buy the   things they are looking for what else do we  got here below we have product tax it works   the same way I can create a text so I can  say controller comma space PlayStation five   Sony Wireless if I click on ADD I  update it I'll see the text here below   now if I click on PlayStation 5 I will see all the  products that have the tech PlayStation 5. so in   that way you have categories and tags that will  help people to find products on our website so   maybe someone who buys a PlayStation 5 for the  first time he clicks on PlayStation 5 and sees   everything he can buy the console the controllers  the Chargers the headphones so that's a great way   to create some structure in your website and it's  all made possible thanks to woocommerce but over   here we have extra settings so maybe for this  particular page I do not want to have a header   so I disable the primary header update refresh  and then it's gone so uh Hey that is possible so right now it looks like this   we have our image our cell we can click  over here navigate through the images now we can zoom in click  here right here and zoom in   we see the breadcrumb the categories the title the  price with the discount then the short description   the stock how many products we want to add to  the cart the SKU number the categories text and   then the description additional information and  reviews so let's talk about reviews and create one   so I say it's five reviews whoa this  controller is amazing it feels so good in   my hands and I do not get sweaty even  after gaming for 16 hours straight submit this is on the administrator it will be  placed immediately but now you see how it looks   so if I would go to the console page it looks like  this I see it's a seal I can add it to the card   I see it from accessories the title the amount the  star rating and then the price and I can add it   to the card or I can click over here then I go to  the page so that's how it looks but I can make it   look better we'll talk about it later right now  I want to have my icon over here so I go to the   customizer and then automatically I will go to  all the settings about this page but I want to   go back and back scroll down go to site identity  select the site icon which will appear over here   upload files select files and I go for my fave  icon it needs to be PNG and it needs to be square   and at least 16 by 16 pixels minus 200 by 200 I  select it I skipped the cropping now to appear   over here so if I'm in this step you see here  I'll go back to my PlayStation 5 console website   and then I can go there right go there at once  now we've created our first product we can change   look a few of the product page right now it looks  okay people that know woocommerce they immediately   see this is definitely woocommerce we can make  it look better using extra Pro let me show you   right now how to do that so how to make this look  better using S5 Pro so I click on the customizer   so what I can do I can make this boxed   so I have this area around it and I have to say  I like it so I leave it with that I can also   make it full width and contained that  means if I make this website smaller   it stays within those areas but it's full  with it takes all the width of this website   then there's also fluid stretched  and then it will be completely from   the left to the right and that's what  Amazon does so if I go to this product and I make the website smaller okay there there  is a boundary over here but it's really white   so when you make your website smaller  it stretches but um I don't want that   just in I don't know I just want don't want it I  can choose what I want so I like this one boxed then if I would have a sidebar I can have a  sidebar and those cyber widgets will appear   over here it can be uh most featured  products best sold products filters   categories tax helping people to navigate to  your website well if I take a look at Amazon   the focus is on that Pro this product right  now and here below you see related products   so I want to do that uh Amazon is doing a lot of  work in order to make their website convert better   so I like to stick with them no sidebar on the  product page and then we have the gallery over   here and also here I can take a look at different  options I like it but if you take a look at   Amazon they have this over here at the left I'm  sorry if I say Amazon the wrong way sometimes   I want to go and do the same thing  so the vertical slider just like this and I want to enable the zoom effect so when  I hover over it I see see it from close by   the image white right now or the width right now  is totally at the center if I make it smaller   there's more space for the text less space  for the image I can also make this bigger   and I bring it to 50 percent and then over here  what do I want to display first well I want to   display the title first so I bring this that to  the top they also have that then I want to have   the categories then the rating then the price  you know above or out of the short description that to the card button and if I see this that  means I can adjust a few things and here I can   change the button button width I can say 100  percent and then it will have the whole Space   but um I'm okay I bring it back the more information do I want to show this or not   if I do not want to show this I turn it off and  then it's gone I want to show it and there are   also some extras which can be really nice look  at this free shipping on orders over 50 so what   I can say from fifty dollars and more there's  free shipping well let's bump it up a little bit to 100 dollars because that  will increase the amount people   will spend on my website because  people want to have free shipping   there's no risk money back guarantee well since  I'm a shopping worldwide I wonder if that's a   smart plan because then people need to send  things back from all over the world it costs   a lot of money so I wonder if I should do that  but if you want that do that if you don't want it close it no hassle refunds and secure  payments well about payments I can   turn this on like I say you can pay  with Visa Mastercard American Express   if I turn this on I can also  show PayPal and Apple pay and I also want to make it a great show because  I don't want to attract too much attention to   those colors I want to have this as my big  Attention Point so I make them gray skill maybe I don't use this cover or I only  want to show that the most popular ones yeah that's included great so enable the breadcrumb that is  this over here I want to turn it off then enable the shipping text after the text it  says and free shipping well it's not the case   because uh if People's order for just 65 there's  no free shipping only when people pay more than   um 100 dollars and enable sticky  product summary well if I scroll down   okay let me let me go to the gallery put  everything below each other look at this there's a little bit of white space over here  okay I cannot show you that well but let me   show you enable product sticky summary  that means that this area will be sticky   you see it's a really small area because there's  a lot of information but if I would get rid of let me see if I would get rid  of the product description let me see the extras and the payments then  you see it better it will stick with us   so um that's what I want I want to turn these on and change this back to left area   okay product navigation over here we can have  product navigation in a circle like that so we   can go to the next product but I I don't want that  I don't want people to go from a PlayStation 5 Duo   controller to a Nintendo switch because it's  not relevant to them because they're searching   for something about PlayStation 5. so I turn  this off but hey you can turn it on and if you   turn it on you can even turn on previews when  you hover over it only product and there's only   one product right now so you don't see other  products but I don't want it so I disable it and products variations we'll talk about it  later we enable the product description there's   everything here below and what I don't like  is those steps it's just weird people don't   want to click there so what I prefer is  to distribute it show everything like this display upsells over here display related  products definitely won't do that just like   Amazon a lot of related products and the amount  of columns for the related products let's say four   and also show four really products if you  say eight there are two rows with related   products that's what Amazon does Maybe no  but if you want to do it you can do that we want to Sticky add to cart that means when  we don't see the end of card add to cart button   anywhere on the page of the product it will  appear over here or at the bottom so it will   disappear when I see the add to cart and what  I don't see anymore it will appear over here so   all the time people can click on the add to car  button I think that's a great addition so that's   it for the products page we're going to take a  look at a lot of other settings right now I think   this looks great people go to my website they  see a product and it is displayed beautifully they can add it to the cards they can view  the cards they can view the card over here   categories head to the car button description  they can pay safely more information reviews   people can add a rating so I think this looks  great now we will create a variable product a   product with multiple sizes colors and now  you'll start to see the power of woocommerce   so let's create a variable product unless you  really don't want to have a variable product   on your website or maybe you want to learn  it but you don't use it on your website well   feel free to skip this part or to watch the  part just watch it it's better for the The   View time on my YouTube channel and that  will make this video go viral so please   watch it do it for me even if you run away  go away do something else keep the video   playing and please like the video because  it's all about the algorithm of YouTube   okay weird let's create a variable product  it's time to create our second product this   time it's a variable product so I hover over new  and I click on products this time we're going to   sell a PlayStation 5 console case so now I  console but the case we can have different   cases for PlayStation 5. so you know the drill  long description short description but right   now I want to take a look at the product data this  time it's not a simple product with one version a   cap or glasses or controller no it's a variable  product and instead of talking about the same   things I want to go to attributes and I want to  work with attributes what's an attribute it can be   a color now you can have multiple colors it can be  a size and then you have multiple sizes it can be   a certain addition you can have multiple additions  so we can create attributes over here but a better   way is to go to products so let me save it  first or update to products and then attributes   before I'm gonna create a new attribute I want  to download a plugin that will make everything   look better all the attributes can be displayed  as image label or color maybe I'm overwhelming   you like crazy like what are you talking about  let me show you step by step what we're talking   about I go to plugins add new and then I search  for woocommerce swatches and then card flows   there it is variation swatches for woocommerce  by card flows install now activate then I go   to products attributes and now I create  the first attributes and lettuce and color   I leave this lock I don't enable this for the  archives the default sort order is custom and   now over here this is from the plugin what  kind of variation switch do I want to have   I can have a label that's just a simple text  I can have a color and then I can select color   or I can have an image so let's start with the  color and the shape I want it to be a circle   and the size I want it to be 36 because that's  my age what really yes it is at the attributes   and now I can configure the terms and I  can create colors so let's start with black   and then I select black over here add a new  color and then white and you can place here   all the colors you think you're going to use in  your website not only for a specific product for   all the products and then at the product area we  can select the colors we have for our products   so white let me show you what I mean so  here I say light blue because I have a   light blue case for the PlayStation 5.  and I grab this color which is exactly   the same color as the PlayStation case and I  added that color next one green and the color next purple and then orange okay oh then I can add red normal blue I think for now this is uh fine  okay let's add yellow yellow great so this is a color swatch then I go back  to the attributes so we have color I want to   have something else I say PlayStation 5 Edition  because there are two editions disc Edition and the digital Edition so the type in this case  is a label I want the label to be custom which is 36 and then this one  okay also 36 add the attribute   now I configure the terms and I have two  terms the disk addition and people that   know uh buy PlayStations and controllers  and stuff in cases they know if they have   a digital version or the disk version  so the second one is the digital version that's it just a simple label   and I go back to the attributes the third  one we can have let me call this Prince is an image so what people can do people can  click on an image and then see a variation   the shape I want it to be a circle of 30 6 I  can't make it bigger but let's try 30 36 edit   so now if I configure the prints I need to  upload an image so the first one is Mountain upload an image upload files select files is this the mountain it's a palm tree this is  the mountain so print two small square from   the 63 by 263 add a new print and then the  second print is palm tree I upload an image is one okay and a new print great so if I go to the  attributes we have three kind of kinds of   attributes the first one is color type scholar  and you see all the colors the second one is   image the third one is label and I can always  change them so I can add new colors if I want   to now I go back to my product I can go to the  front end to this product or I go to the back end   to woocommerce name below  products I select a new product   so let's go to the right area product  image upload files select files let me add all these images and then the mountain  print and palm trees print and then this one open so I use this as my featured image and then  below I can have a gallery with multiple Editions great categories I can say uh covers or cases that has to do with PlayStation 5. and  accessories decks PS5 case PS5 cover updates so if we take a look at the product  it looks like this it is out of stock   so let's talk about variations and go to  attributes we've created three so I select   the first one color and I click on ADD well I  don't have all colors so I just select the colors   I have over here so I have a light blue one I  have an orange one purple one and a green one   I want to use it for variations and make it  visible on the products page then I click   on Save the attributes then I want to create a  second variation or add a second variation that's   the PlayStation 5 Edition I added and I select  them all digital version and the disk Edition   save the attributes what I want to do now   I want to create a variations for all the options  over here so I want to have a green cover for the   disk Edition an orange cover for the digital  version a purple cover for both so I won't have   a different variation for all the possibilities  so there are four options over here two over here   that means that there are eight different options  when you combine those so I go to the variations   then I click on ADD variation and I say  create variations from all attributes   so now it's going to create all the combinations  which is total of eight so I click on go   I can have a maximum of 50 per run and  it says there are eight variations added   and now the fun start begins I can expand them  all I want to set a price so I click on ADD   variation I want to set a regular price click  on go and I say they should all be 29 dollars but the disk version is a little bit  bigger so it costs more to make it so   I want that one to be a bit more expensive  so I can expound this and all the digital   or disk versions I want to make them more  expensive so 34. so the disk version 34. 34. and 34. then over here I can save it then  what else I want to enable the stock because   right now if I open this it is not enabled so  I click here I want to toggle manage stock yes   so now everywhere it is enabled and now  I want to set the stock for everything   oh wait stock I want to set it to 10 because  I want to have a lot of stock of everything   so now if I open this stock  quantity of every variation is 10.   of course only if that's the case so  I have a total of 80 different covers   and I want to have that because I want to  never run out of stock so I take the risk   I buy a lot of of those cases and then I  never want to run out of stock and if I see   hey there are only three left I need to order  new ones and then I can fill up my stock again   now now comes the nice part in my opinion if I  uh update it and I take a look at this product   I have a nice image over here now here and I  see the variation so I can have a light blue   PlayStation with a digital version and when I have  the digital version it's 29 but when I have the   disk Edition it's thirty four dollars but if I go  to the purple one this does not change and I want   this to change the purple one so when I click over  here on an addition you see the result immediately   in order to do that I go to the variations  I open them all by clicking here and I see   the green digital version so I click over here I  see the green digital version the digital version   has no CD no disk area and this version has one  so I select this one I scroll down Green disk light blue digital so light blue digital light  blue disk this one and you have to set it up   once and I know it's it seems to be a lot of work  I like the work because I'm building a website I'm   building my own webshop that can make me money  so I like the process it can be that you think   man it's a lot of work I hope you can keep in  mind that you're working on something amazing   you're gonna sell things on the Internet or maybe  you're making this website for a clients you're   making money with that so either way I hope you're  making money I think that's something we all like   to do and we can provide for the people we love  for ourselves so I hope you can enjoy this process   I always I always like it just like I make like  making these tutorials I don't know I just like it   now ladies and gentlemen look at this I refresh  the page if I select a green addition with the   digital version look at this it becomes green if  I make it blue becomes blue if I select a disk   Edition I see the disk edition if I want to have  the purple disc Edition so look at this people see   immediately what they are buying so that's what I  really like about these options I can clear them   and by default people can select the orange one  and then you see nothing and they like hey the   website broken but you also always need to select  uh both variations so in order to fix that because   not everybody knows that we can go over here  to the variations and say by default we want to   select the library version of the digital version  so now it becomes even better I refresh the page by default the blue digital version is selected  so now when I click on purple I see the purple   one the orange one the green one but I want  to have the green one for the disk Edition   and now you see everything works fine and  that's a great power of variable product   when I learn products when I learned  this I think it was in 2013 I was like   wow this is so cool now I can make websites  for clients and I did I just love it   and if I scroll down I see this everything  seems to be so clean I really like it I know   it's woocommerce and woocommerce can it's already  10 years old and they did not approve improve a   lot of things but with this thing now with  the pro plugin I think it looks really nice so that's what you can do let me show you  another example if I go to new product   and I create a product called PlayStation  PlayStation five console case with print   okay so now again a variable product and go  to attributes I select um the PS5 Edition and   it's only for the disk version because I only  have prints for the the disk Edition I use it   save it and the second one this time I choose  a prints remember those are images I add them   I select them all the mountain and the palm  tree and I use it for variations attributes   then I go to variations I create variations  from all attributes they're a total of two two variations added by default the  first version mountain is selected   and then I can do the same thing I can also  do this expand the disk Edition mountain   is this one and the disc Edition palm tree is  this one so what's the price is 39 dollars also   here 39 dollars I want to manage the stock  life 15 of those and I only have 10 of those you see all this stuff over here I can adjust  it I can have a personal SKU for this one so now it looks like this  then I want to have an image achieves one of these and the  other one I put it at the gallery   it is an accessory it's a  PlayStation 5 cover and case PS5 case with print okay so now it looks  like this by default this one is selected   the disk Edition is the only addition we can  choose and then I can select this one or this one   they both are 39 dollars here we have  15 in stock and here we have 10 in stock if I want to make sure that  people can only buy one   right now they can buy a lot but if I want  people to only buy one I can edit the product and I can go to inventory and say sold  individually so you can only buy one per order I view the products they can add it to the cart  but they cannot buy then so if I add it to the   cart and I view the card I cannot say okay make it  10 now I can only buy one so this is what you can   do with variable products oh this is also what I  like look at this over here we see in the overview   already the color so I can select Orange and this  version also here so in the overview on the shop   page we can see those options and I think that's  really nice and we're going to talk a lot about   this layout later because we can make this  look so much better but right now I'm happy   with these options so that's how we can create  a variable product you can also create digital   products within woocommerce like a coaching call  or a ticket to a event to an event so let's Dive   Right In okay next product new product I'm not  gonna go through all the options again because   I covered those already so the product name  can be a coaching call 90 minutes I scroll   down it's a simple product and it's a virtual  product normally I charge 4.99 but today 3.99 then I can go to Advanced and at the purchase  note I say send an email to one on one at 30. Corpus hook.com and we will book a  meeting and I can have an image of course   an image of myself so I go to the desktop images  tutorial woocommerce Skype call or one-on-one   okay set the product image and if I publish it and I view the product I have a coaching  call I want people to buy this only once   I don't want two people to go with me  for five hours so I go to General and   then inventory and I say limit purchases to one  item per order update refresh so there you go people can add it to the card view the  cards and they can buy them when they   buy it they get a notification like  hey send an email to one-on-one at   Freddy corpse and then we'll make a booking  next product product name and this time I'm   gonna sell a downloadable product so I  say how to become an online mantra book it's a simple product it's a virtual and it  is downloadable the price is 14 .95 dollars   14 by the way if I would say this is  a nine 95 I can also schedule it so it   will be for a certain amount a certain amount  of days so until the latest day of this month   and then I can add a fill let me choose a file  upload files and here on my desktop I have this   ebook it's only 255 kilobytes and you can sell  this you can sell digital stuff and this can open   a complete new world to you if you go to theme  forest and go to Wordpress themes this thing is   69 and It's All Digital and if you take a look at  last week this theme is sold more than a thousand   times so a thousand times sixty nine dollars  let's say almost two thousand times in a week   for digital products so that's that's a crazy  world selling digital stuff so this is an ebook   I copied a link I insert value URL oh  there's already I can say how to come   and online entrepreneur how many times can  people download it after they bought it well   you can say three times I rather say unlimited  and should it expire I can say it it will expire   after 30 days but I see no reason I should  do that when people buy it so I say never   and I can have the categories the product  there because I can have the product image   so uh I select the files and then  I go to images tutorial woocommerce how to become an online entrepreneur ebook   and I always like these mock-ups these are bought  by the way at theme forest and then graphics   mock-up ebook and even when I type it  wrong I still see some nice examples something like that so what you can create and  it looks uh looks better than something flat so that's how you create a digital  downloadable product so I update it   and it will look like this I took an  online entrepreneur also here I would   say people should buy it only once since it's  a digital product and automatically we start   to see related product because this one is also  uncategorized so if I would go to the website   to a product and scroll down I'll see related  products because this is also in accessories   so our website is getting better and better  there are more products you can create so   let's hover over new product and this time  it is an affiliate link what is an affiliate   link well affiliate marketing is promoting other  people's products in exchange for a commission   so if I would go to YouTube and I search  for affiliate marketing 30 and hit enter   I have tutorials about how to start with affiliate  marketing look at this six hours six hours three   hours two hours and I show you how you can get  started with affiliate marketing it is amazing   I love affiliate marketing that's how I live  I love affiliate marketing so what I can do   I can promote all those people's products  for instance I can promote Elementor Pro   and over here it is a external affiliate product  the product URL is my unique affiliate link when people buy this learn more and people buy  this through my link I get a commission so it   starts from 49 dollars and I can have product in  product image and over here I have an Elementor publish so you can build a complete website only  with affiliate products so if I go to theme forest   all those products of here are all affiliate  products so when people buy this through you   you get a commission so you can use all  those themes place them on your website   uh linked people to your  affiliate links on thinkforest   now when people buy it by clicking here this  is my affiliate link when people buy this   I get a commission so that is affiliate  marketing if I go to 30 Corp 30 corp.com I don't use this anymore  but then I go to resources look at this the Divi theme so I click over here   more details how many people buy this I get a  commission so that's how it works with affiliate   marketing so there is the sixth product we can  create it's a grouped product you create three   separate products they include one product and  you place them all in one product well I hope it's   weird what I'm saying too and it is because in  all my life 36 years really yes thank you I never   had to create a product like this for a clients  I had a lot of clients so what I did I decided   to do not put this part in this tutorial because  then the video will become really long and I will   scrap people away with the length of the video  they're like okay I will take the shorter video   so I will have a tutorial about how to create  a group product and you can find it let me see   here or you can go to the  description and there I'll put a link   and um so I'll skip this part what I want to  do now I forgot so I'll take a look at my notes oh yeah I will show you we created a lot of  different products now I want to show you how   to import products and I have products for you so  if you want to follow along with all the steps I   take in the tutorial you don't have some console  related products in your website I'll show you   how to import them and then we have a website  that's filled with beautiful products and we   can follow along in this tutorial so let's Dive  Right In so I want to show you all the products   you can create so I have Elementor coaching  call ebook but it's a console shop it's not   a one-on-one coaching shop or ebook shop or  affiliate product shop so what I will do I   will remove those products I will add more console  related products and then I will be back with you   to show you what you can do with your website in  order to make everything look better and make it   work so I refresh the page or you see I've added  some products if you want to add these products   to your website go to the backend of your website  go to products all products import choose a file   then go to images tutorial console shop and  select console products.csv click on open   and then continue and import all that stuff and  you should be good to go since we have quite   some products in our website I want to talk about  upsells and cross sales what are they and where   do they appear in your website right now I have  this product over here and that's the category   consoles and Playstation 5. so here below LC  related products why it also has something to   do with PlayStation 5. so I can have four relay  the products over here so that's the first thing   the second thing is I can edit product I can  scroll down go to linked products and I can   have an upsell so if I sell this PlayStation I can  say hey maybe you want to have an extra controller so PlayStation 5 dual sense wireless controller  I can add it as an upsell or Playstation   let's say headphone wireless headset so  I have two upsells so now if I update   this product and I view the product look at this   scroll down you may also like the headset and  the Dual sense wireless controller and then   below that we have related products so that is an  upsell let's do a cross cell I added the product and scroll down to link products and also  over here the same products dual sense and the bills 3D update View  now if I add this to the card   and I view the card since I have  added this product to the cart   you may also be interested in so  this is a cross-sell this will appear   on the card if I remove this it is also removed  over here because all those plugs over here do   not have cross cells so let's go to the Nintendo  switch edit the products I go for a cross-sell shooting game gun controller update view the  product I already have it in my card so if I   well let's add another one I view the card and now  I see the shooting game gun controller because I   have the Nintendo switch so that's how it works  with upsells and cross sales ladies and gentlemen   are you still having fun I hope so if this video  is helpful for you please like it and feel free   to subscribe for more upcoming WordPress related  tutorials now I want to take a look at the archive   page also known as the shop page let's configure  it let's make it look better and let's make it   easier for people to navigate through our shop  are you ready I am maybe I'm I'm asleep at this   moment but I record this so that's the great thing  about YouTube but I'm ready right now start with   this part of the tutorial and I want I want you to  be serious right now don't don't laugh no no no no this always happens when I make these videos and  I leave it in the video some people can appreciate   it some people think I'm crazy some people  think both you know what let's continue do it   the archive page so going back over here  we have a lot of products and I want to   sell them in order to sell them I need to make  our website look better because right now it   doesn't look that appealing how can I do that  I click on the customizer and automatically   will be redirected to the right configuration  page because we can now configure this page   because this is the product catalog so I can  change the container layout right now it looks   like this let me make it a bit smaller  command control minus if I select boxed   it looked like this and I have to say I like it  the only thing I don't like is that the background   color is a little bit too dark in my opinion  so I can go back I can go back I can go to the   global settings of Astra then I go to colors  and then over here I have the side background   I can make it orange so much better no  let's um not do that let's make it black   and then bring it up until we think yes not  too distracting but you see the difference   something like this publish then I go back  go back then I go to the woocommerce settings   product catalog and then we continue  you can also stretch the website like this if I make the website smaller this will  still still be full width well I stick with the   Box version and if you have a sidebar you can  choose the layout I don't use a site on my shop   page so I leave it like that then there's the shop  layout right now it is displayed like this I can   change it to design one I don't see any difference  I can change it to design three and definitely see   a difference over here and this is the version  I prefer I'm just kidding I like design too   when I hover over it I see this I can add  it to the cards when I go to design one   I don't see that so I just choose design two   how many columns do I want to have well I can  have six I can have one and I choose three   and there it is how many products do I want to  have per page so right now I have 12 and after 12   I can go to second page or what I can do I can say  for instance 9 . so now now I have nine products   and I can go to the next page  or I go for an infinite scroll   in order to fix that we need to scroll down a bit all the way and then there's a shop pagination  right now we can go to a different number I like   infinite scroll and well I'm scrolling  more products up here so I scroll down   and when there are more products they will  appear over here right now they don't because   I'm in the editing mode let me publish it let  me scroll up again to the settings where we were   nine products and when I scroll down let me show you more products  will appear so I scroll down there they are automatically how great is that  customize and then automatically we go back to the   product catalog configuration settings  I scroll down the shop archive content   with I can make it smaller if I want  to so I can bring it down like that but I prefer to have the default width this  one what do I want to display over here well   of course products I can say categories  but I don't want that so I say products   and also on the category display so if I  would go to a category page with all the   products that contain that category  I also want to show the products   and the default products sorting is  custom ordering plus name it is this one   so which one should be shown by default so  I can also say by default the most expensive   product should appear this one then this one  this one Etc I prefer the default sorting and then people can choose to change that   what else over here I see the category  first then I see the title if I uncheck this   the title will be gone well I want to show the  title I do want to show the ratings and I want   to show the price I do not want to show  the add to cart button so I turn that off   because people just need to click over here in  order to go to that product page and if people   want to add it to the card they can click over  here when you hover over it they will see it   great then there's a toolbar structure that's this  area over here do I want to have the results count   well if I have a small website I prefer not to do  that just anything only 70 products so no thank   you I don't see the value of that what needs to  be refreshed uh do I want to show a filter yes   so there will be a filter you need to configure  it do another sorting if I turn this off   it's gone I want to turn it on and what I also  like is the easy list view if I turn it on it means that people can watch this  in a list view like that then I can   decide how many columns there  should be so if I would say one and I go to the list View it  will be displayed like that I like that so let's make it two and then to the other settings do I want to  show that this is a shop no I don't want to show   the title so I remove that so I also display the  breadcrumb then you would uh if I go to okay so if   I would go to this page and then to the category  Nintendo or a deck then it will say Where We Are   if I turn it off it's gone well I want  to show it and people know where they are   and if I would have a sidebar do I want  my sidebar at the right or at the left to   be sticky well I don't have a sidebar  but hey if you have one you can shoot   it over here enable the filter accordion  right now if I click it appears over here   that means if I click on the filter it will  open over here instead of here at the left I'll   show you in a minute how to configure this and  display the active filters and I'll keep that on   we'll talk about the filter in a minute there's  also a quick view that means if you click over   here you see a pop-up with the information when  should it appear when you click on the image when you click on the image for instance then  you can have an add to cart button so let me   publish it and close it now if I click on the  image HCA pop-up and I can add it to the card   I can view the card let's go back to the home page so that's an option I prefer not to do that so I scroll down all the way and I turn it off  or I disable it oh we talked about the infinite   scroll even to trigger infinite loading you  can click over here and load more products or   when I scroll automatically all the other  products will appear That's What I prefer   the shop filter button right now it's a link I  can make it a button and it gets more attention or I can create something  custom but I like the link   I want people to focus on this area not on the  filter the text I can also say filter by price and   then I can only have the option to filter by price  it's the fly out or should it be top collapsible   oh I prefer that so it will appear over here well  there's no filter yet in order to fix that let's   go back let's go back and then go to widgets and  I go to the shop filter widget I click on the   plus and I click on browse all and I search for  filter and in my case I want to filter by price let me publish it now if I click over here I  can say I want to spend a maximum of 500 dollars so I don't see any product that is more expensive  than 500 so if I would go to short I price high to   low the highest one will be lower than 496 dollars  as you see over here so this is how we work with   filters I go to woocommerce product catalog  scroll down all the way and there's a new option   the filter column I want to have one column maybe  that's too wide okay let's change that to two and now it is easier for people  to uh create a nice filter okay then we go to design   we can change the product title so if you  make it orange you see what will change I can make blue or I prefer to leave it  as this at the other hand everything is   a little bit the same so what I prefer  to do the price I want it to be blue and the color of the ratings I want it to be  another color let me show you in a minute how   to do that how to bring everything to the  center okay but what I see those swatches   are not in the center so in order to do that I  publish it I close this then I go to the back end   to woocommerce variation swatches there are  some settings look at this it's my video I'm   I feel humbled that they use my videos I  go to the settings and to the shop page   styling and I bring the Swatch alignment to the  Center guys and ladies it's getting better and   better don't you think I'm excited because  right now if I scroll it looks like this   so I'm happy with that let's go back to the  customizer and then to the design tab over here   so I scroll down do I want to have a product image  hover style what what I can do I can swap images   so or swap so if I hover over it you see another  image what I prefer is to have a small Zoom like that there's the button padding well  we don't have the button anymore the add to   cards there's a Content padding so we can  create more space in this area over here there's the Box Shadow so right  now there's no line there's nothing   but I can make that so I can increase  this to two I can increase the blur like that and then or I can make a  zero zero you know what let's make it   two two and four and then I want to decrease  the opacity so make it a bit lighter   so you see small shadow maybe play  around with the blur a little bit more okay you can also have the hover when I hover so  somewhere I can have the hover when I hover okay   so let me let me increase this make this a  little bit more visible then this will happen okay let's decrease the color because it's a lot okay you know what I don't need then the product title font I think  it can be a bit bigger not that big and what I like with the Astra Pro theme or  the SR Pro plugin plugin everything will stay   in the same card so even if you have two rows in  here only one row the height of all the products   is still the same I like that design wise the  price found well um I think it can be bigger and then the content font no if there's a text   you can have make it bigger or  smaller so we'll do some CSS he found this okay let's go to one of the products  over here I have five stars right Mouse click   inspect I use Google Google Chrome  and I scroll down until I see a color   that's the same color see over here so if  I click here and make this a bit yellowish yes I can copy this I customize the  website then it's black again then I   go back and back to the additional CSS  I paste this and now it is this color   so right now it looks really nice and I want  to talk about one more thing that's the image   I go to the customizer go back and go to the  product images right now the quality is okay I can   change this to there's 600 is okay the thumbnail I  wanted to be 600 as well so the quality is better   I think that's really important for your website  look at this this looks so much better then we   can change the crop right now it's a square  the image is one by one I can make it custom   like four by three I can make it three by four  like that I can also make it uncropped so the   image will be displayed as a full but that makes  the text go shift everywhere I don't want that   so what you can do when you upload your  images make sure they are all the same size   and then it will look really nice  I prefer one-on-one or one by one then when people click on the image they can see  the complete image they can click here navigate   wow I'm really happy with how  everything looks and right now   we see also the related products  and the more products you you offer the more related products you will see  so if I scroll down related products   and the bigger your website the more  will be shown there so I click on publish close it and this is our website we can filter things we can change how it  is displayed and we can sort by popularity   and by prices high to low and I'm happy with how everything looks using  extra Pro you can make the woocommerce pages   look so much better we already talked about to  the product page the the archive page now let's   take a look at the car page and after that  also the checkout page and the account my   account page so let's take a look at that what  I want to do now I want to show you the website   using the free version of SRAM with woocommerce  and the pro version with Astra so this is the   free version website and if I add this to the  card so I click over here and I add it to the   cards I can view the card and this is how the card  looks in a free version of woocommerce and Astra   and there are a few things I don't like keep in  mind we want to make sales and we want to make   the process of buying things on your website  easy but there are a few things I don't like   if I want to change the amount so I want to  buy an extra controller I click on the plus   nothing happens I need to  scroll down click on update   I think that's weird I want to click and then  it will change what I also don't like I don't   see an overview of how much I bought I need to  scroll down and then I see the overview what I   also don't like is that there's a really big area  with a button apply coupon so what people can do   they think hey I want to buy a lot of stuff but  maybe there's a coupon code so they're going to   Google like hey is there a coupon code for console  delivery and I don't find a coupon code and then   they can get distracted and they can leave the  website if I take a look at the pro version and   I buy this one I add it to the card and I view  the card look at this at once I see an overview   of what I spent total if I want to have an extra  controller I just click on the plus you see the   skeleton loader and it will appear over here so  it's updated the price has changed if I scroll   down I still see the car totals so everywhere  on the space where I am I can see how much I've   spent and if there's free shipping or not and by  the way if we want to promote free shipping like   hey if you spend 10 more dollars or 20 more  dollars you get free shipping there's a two   I'll talk about in a minute that will help you to  increase the sales on your website but right now   I think it looks amazing already so I still can  remove things just as over here here's at the left   here it is at the right so I found to get rid of  this one it's gone over here I need to click here and then it's gone and if I  take a look at the coupon code   small text have a coupon if you click on  it then you can apply the coupon I think   that's better than a really big button  over here like apply the coupon code   and then over here we can proceed to the checkout  well there are a few things we can do we can go   to the customized and actually we can remove  all the great benefits there are on this page   so I can enable or disable the modern card layout  so if I turn this off it will look like the free   version I turn it on go out of sticky card totals  if I turn it off this area will not stick with us do I want to have the real-time quantity updater  if I turn it off I click on the plus nothing   happens until I click on update cards I turn it  on again and we can change the text over here   proceed to the checkout I think that's better than  check out because it talks about an action click   here to proceed to the checkout it can also change  this text so I close it because I did not change   anything now let's take a look at the checkout  page and the my account page using abstract Pro   and then in the free version if I would go to  the checkout it looks like this do you have a   coupon click here to enter your code again I  don't want this coupon area we can fill in our   details over here ship it to a different address  this is all standard woocommerce information   we can have notes optional and now here we  see an overview of our order I don't like it   it looks weird and I have no payment  method but if I have one it looks amazing   we'll talk about payment delivery  later then we can place the order   over here at the new version I click on  proceed to check out the pro version I mean there's no question have a coupon code just  my information if I'm already logged in   it'll show my information over here if I'm not  logged in I can click here to log in and the first   name and last name look at how beautiful it looks  here's the first name and the last name and I can   fill it in over here over here it's in the area  already so if I fill this in first name then it   will appear over here last name then there's the  company name maybe I don't want to have a company   name then I can get rid of it but it all looks a  little bit better so later on this tutorial we'll   talk about payment methods and then it will look  like this you can have your credit card details   hey with clarna be with people and we have people  there are more options you can have over here and   I think looks great and healthier at the right an  image of the product you see the amount and at the   right you see the price I think that looks better  than this this looks ugly this does not look   professional so Esther Pro is doing an amazing job  in making this all look better and then later I   will show you how to add payment options and I'll  show you how that is displayed with extra Pro so   let's go to the customizer over here because at  the checkout we can also adjust a lot of things I could change the form width  so I can make it smaller   let's bring it back to default the checkout  layout of course there's modern I can bring   it back to default and then there's  the ugly version let's bring it back   to Modern I can have a one column layout  so first people need to fill in the details   and then there's a reason why you can  make this smaller makes a lot of sense so if you want to have it like this  you could do it or bring it back   and have two columns you can change  the text over here place order   and then you can say uh do you want to  have this check your payout eigen no   then it's gone enable the button price  you can turn it off I turn them both on   and I leave the text as it is over here at  the right do I want to have the product image   if not it will look like that I want to enable  the modern order received layout and enable   sticky Order review so if there are less products  over here then the length of this area then this   will stick with us and I like that we can also  have multiple step layouts so if I turn it on   the first step is shipping and  then the second area is payment   and you can give them all a different name  well you can do that I don't do it you can   also have a distraction free checkout well this is  already at the card so I don't need it over here   do I would have a destruction  free check out if I do that there's no header I think that's better because  I want people to focus on one goal and that   is to buy the stuff and not to go to different  pages in the website so I like it I turn it on   persistent checkout form data what that  means if you fill in the information   and you're halfway through and you accidentally  refresh the page this will not be gone   but if you turn this on it will stay there  that's so much better because sometimes you you   accidentally hit F5 or command R somehow and then  you need to fill in everything again I don't want   that so turn this on and then this okay if you're  only selling to individuals or how do you say that   people people without a company they can say  hide it if you only want to sell people that   have a business you can make it required  there it is with the Asterix I hide it   I also do not need the second line  for the address so I say hide it   so there's only one line over here the phone  Fields no I hide it but it's up to you but right   now I like it that it's just a short area over  here highlight required Fields with asterisks and then here's the privacy  policy page you need to select one   in the terms and conditions  page if you don't have one yet   let's publish it go back go back then we can go  to the menu I create a menu already main menu I do not select this yet I will talk  about it later I want to add an item   and create a new page and call this  one terms and conditions I added I close it publish okay now I go back go  back to woocommerce check out and scroll down   and here I say the terms and conditions page  okay I need to refresh the page so command r now scroll down and I select the terms and  conditions page so people need to agree with   the terms and conditions they have to check this  otherwise they cannot buy this and in those terms   and conditions you can talk about the refunds and  all the other terms and conditions so that's it   about the checkout page so we can have it like  this the default woocommerce one or like this and if you buy something then  first we need to go to the back   end to woocommerce settings then we go to  payments let's turn on cash on delivery   save the changes so now I go to my website to  the home page I go to the checkout page check out   with the old version I fill in my  details over here I click on place order and it looks like this all the information the order number  the date email the total the payment   method what I've bought and where it will  be built to and where it will be shipped to   over here with this one let me fill in my details I agree and I place the order and now  it looks like this order number the date   email total and the payment method  and in my opinion it looks better   and then the billing address and shipping address  so what I can do now I can go to the home page   and then to my accounts and it looks like this  if I would go to my account on the free version   it's like this the standard woocommerce  layouts with our orders our downloads if we   downloaded digital products or addresses  our Account Details and we can log out   over here with extra Pro looks like this  it's a bit personalized hello for the corpse   the orders it looks better with an image you see  the status you can view it what you've bought   and there are the downloads yeah the Restless  Account Details and you can log out if you want   to adjust that so let's uh log in again I go to  the customizer I can turn off the modern layout   turn down and see the difference I can use the  gravitar or not and I can enable the grid View   or disable it well that's for the orders so if I  turn this off it looks like that if you turn it on   it all looks better it all looks more professional  which gives the customer the ID that they're on a   really professional website from a professional  company which should also be the case of course   publish it let me get rid of this so that's the  process of buying things but of course we want   people to be able to pay so how can we enable  a payment method of course we want people to be   able to pay our website so we can make use of  payment methods like credit cards clarna ideal   PayPal so let me show you how to configure that  and optimize it now not optimizes implemented in   your website so people can pay with real money  that goes to your bank account and then you can   send the products to the right people so in order  to create payment methods on our website we go too   30. let's come forward slash stripe hit enter  you will be redirected to stripe the film to   sign in and know step by step how to do that  you can go to YouTube and search for stripe 30. you can watch this video and it's two years old  so um it can be that the layout looks a little   bit different but the process is still the same  I already have an account so I click on sign in okay my best seal date was this amount I'm really  happy with that I sold my course for 300 my latest   payment it was in October I don't sell anything  currently but um I'm happy with stripe and it can   help you to sell a lot of things on the internet  okay now we're logged in that's all we needed to   do now I go to the website to the back end then I  go to plugins and new and then I search for check   out plugins and then we go for stripe payments for  woocommerce by checkout plugins install now a lot   of stars which is more than the one from stripe  woocommerce activated we can also just connect   it with stripe so I connect it with stripe instead  of placing all those codes I click on connect with   stripe so I need to authorize a stripe like my  account already over here so I click on connect and I want to add stripe recommended and  clarna enable gateways almost done I want   to enable Express payouts that means that on a  Mac you can pay really easily and on my PC also   with Google pay here with Apple pay here with  Google pay I want to enable Express payouts   and this is important I want to  enable the web hook so I copy this   then I go to the stripe dashboard I paste this  code select events charge select more edit   at the endpoint I copy this code and by the way  we're not in test mode we're in the live mode   so I select the live mode I  paste the web hook secrets   save and continue great your store is  set to accept payments we provide lots   of customization options to match your needs  don't forget to explore them let's customize them so these settings credit card I remove stripe  and this is all create a statement descriptor   I will say console delivery charge type is  charge enable payment via safeguards that   means that when people come back to your  website the credit card settings are saved and I can select certain cars that  are allowed I want to allow them all   and by the default order status is processing  so it's by default also processing so I   turn that on and an order button is pay now save the changes and now when we go to the website   we click over here we can pay now so let's add  it to the cards view cards also here we can pay   now and the sales better it looks better so let's  take a look over here perfect we can pay now or   be like this oh look at this look at this it looks  amazing and if we don't want to pay with credit   cards we use clarna then we agree with everything  we're filled in our details and then we can pay   with clarina or pay now and if I want to I  can change it back to stripe so I go back   to woocommerce settings payments stripe card  processing manage and I say pay with stripe save it and now if I go to the checkout and say it says pay with stripe or I just  say pay so that's the way the cookie crumbles   I also want that PayPal as a payment method  so I go to the back end to plugins at new   let's search for woocommerce PayPal notice whoop  commercials people payments I install it now   tomorrow not yesterday but now activate it and  it says it's almost ready to get started connect   your account I click on it now go directly to the  settings of woocommerce payments and then PayPal   so what I will do I want to enable PayPal  payments and I can also accept all major   credits and debit cards but I already have that  with stripe if you want to you can turn it on   I don't I activate PayPal now I need to  log in and I need to accept everything   so my email address which is my PayPal  email address and the country of region next   I need to login with my password okay I  get a confirmation text I agree and connect now I can go back to woocommerce and that's it I  have to wait a second I see it loading over here   okay it's connected now I go  back to the settings to payments and then over here I set it up  but now I need to turn it on   save the changes and now if I go  to the website to the checkout   I can pay with credit card with clarna and with  PayPal in since I'm with a paper I can also pay   with ideal and so forth so you see there are a  lot of ways to pay and when I click over here you   see the button changes here I play with stripe  here I play with clarna and here I've been with   people ideal or so forth so a lot of ways to let  people pay on your website let's talk about coupon   codes with coupon codes you can get more sales  how you can send coupon codes to people that   have already bought things on your website and  sent a coupon code to your list saying hey the   first 100 people to buy for at least fifty  dollars get five or ten dollars discounts   or you can say to people subscribe to our  newsletter and you'll get five dollars discount   or five percent discount on your first uh Buy on  your on the website so coupon codes are amazing   way to get more sales and I'll show you how to  create coupon codes in this part coming up in   the tutorial in order to add coupon codes to our  woocommerce website we go to the back end and here   at the left we go to marketing coupons and here  we can add our first coupon code first we need   to create a code I can also generate a code and  I can give the description get ten dollars off   so I can copy the code and when I would publish  this code and I go to the website to the cards   I can click over here I can add the coupon  code apply it what you'll see I get zero   dollars discount why over here I need to  fill in the amount so if I would say 10   update and I refresh the page you see I get ten  dollars of discount so not 29 but ninety dollars   if we take a look at the discount types we see  a fixed car discount we can also say percentage   so I can also give 10 of discount so I can  say get 10 off and now if I refresh the page   you get 2.90 discount which is ten percent off  twenty nine dollars let me bring it back too   fixed cart discount ten dollars get ten dollars  off and what I can say when people fill in this   code they automatically get free shipping and I  can say it will only available until the latest   day of October 2022. then we can go to the  restrictions what I can say you get 10 off   when spending a minimum of 50 so if I would say  people need to spend at least fifty dollars update   refresh they'll say sorry it seems that the  coupon blah blah blah is invalid it has now   been removed from your order now if I want to  add it it will say the minimum spent for this   coupon is 50 dollars I can also have a maximum  and that can be nice when you work with percentage   if you give 25 discounts you can say Well  only until a maximum of two thousand dollars   when people spend more than that  then that 25 will not work anymore you can turn this off if you say this coupon code  can only be used on itself not in conjunction   with another coupon code so you can have a ten  dollar discount coupon code besides that you   can have a 10 discount coupon code and then if  you check this you cannot combine them so you   have double discount you can also say that this  only applies to normal items without discounts   so if you turn this on remove this update  and then you go to your website remove this   and go to a discounted product this controller  and I added to the cart I view the card   I go for the coupon it'll say sorry  this coupon is not valid for sale items I can also say it's only available for certain  products so only for the controllers for   instance or I can exclude a product like it's for  everything except for the all the switch products   you can also include a category or exclude  a category I don't know why but you cannot   say only people with a Gmail account  can make use of this discount you can   also make use of usage limits so first I can  say there are only one hundred places coupon   codes available with this one so after it is  used 100 times it is not available anymore   I can also say every user can use  it twice so people can buy this of course you need to update it refresh I paste  the code that's working 55 dollars I can buy this   then I can come back go to a different product  buy again with the same coupon code and it works   but after two times I cannot use it anymore and it  will say that you can also make it easier you can   say 10 dollars so copy this update refresh and  now I click on have a coupon I say ten dollars   apply so it doesn't matter if it's capitals or  not but it's easier so you can have a Facebook   or Instagram message saying hey if you fill in ten  dollars right now only until the end of this day for the first 100 people you get discounts  so that's a great way to boost your sales in   a short amount of time so there's only one  coupon code I can create a second one and   the third one and apply all these principles  which I just showed you ladies and gentlemen   I think I really think that personally honestly I  really think that is time to talk about shipping   how to create the shipping cost based  on the place where people buy from   the weight or on the total amount people  spend on your website so let's talk about   that so in order to set up shipping methods we  go to the back end of our website to plugins   at new and we search for table or rate and  it's probably the first one from octolyze   a lot of installations a lot of stars and lots  updated just 90 hours ago I click on install now   and I click on activate I close this it's a free  version there is a pro version but we're going to   use the free version and it's amazing so what I  want to do I want to go to woocommerce settings   General and then over here I want to select  to which countries I want to sell maybe you   want to sell to all countries that's fine so let  me say specific countries for instance I want to   send products to the Netherlands and to the United  States if you send to the whole world you can also   um leave this to all countries you cannot  sell to all countries except for an essay   to which country you're not selling are  you specific countries I save the changes   and then I go to shipping the third tab  here in the woocommerce settings shipping   by default the Netherlands is here let me  delete it and start from scratch for you   so I click on ADD shipping genre and I start with  the Netherlands so maybe you sell to the United   States and you say United States so I start  with the Netherlands later on I will do United   States and then I will link it to the region the  Netherlands then I want to add a shipping method   and I select flexible shipping and this option  is available because of the plug-in table rates   I added the shipping method and then I click on it  now I can configure this well in the Netherlands   we make use of a company it's called postnl like  UPS for the Netherlands but over here the method   title I choose my carrier over here the company  that's shipping my products so I say Bust NL   the method description will be displayed on your  website and I don't want it to have the same title   twice so I leave this empty and then about the  shipping cost do I want to add taxes over the   shipping cost you can say yes and if you do you  can say it will be displayed inclusive of text   or exclusive of text you can also say none and we  want to have free shipping from a certain amount   on from 200 and on and more I want to have  free shipping then I scroll down all the way   close this and I want to create some conditions  and it can be done on always so the price will   always be twenty dollars no matter what you buy  how much you buy how heavy it is what you buy   always 20 shipping costs but I prefer to work  with conditions so if the price the total price   of my cards is between zero and nineteen dollar 99  then I want to charge eight dollars shipping cost   I added the rule you know let's  make it five and I go to the price   and from everything that is within twenty  dollars and 49.99 I charge eight dollars   then another one I can also do it based on the the  weight if you're selling really heavy products you   can do that I prefer the price that's what I  see all the big shops doing here from fifty   dollars until 99.99 at charts twelve dollars  and then another one from 100 until 199.99   I charge fifteen dollars and then one more from  two hundred dollars on till the maximum people pay   nothing it's free shipping so I say the changes  and these are only uh applicable for the   Netherlands so I'm logged in I live in Netherlands  so my address is from the Netherlands so if I   would go to the cart it'll say based on my price  65 I pay twelve dollars so let me see if that's   correct it is but let me show you why if I go  to woocommerce settings shipping the Netherlands post an l and I scroll down this product is 65  so it's between 50 and 99.99 so that's twelve   dollars that's exactly what I see over here so if  I would add a second one a second controller I pay   130 dollars and now it says automatically I have  to pay 15 why because between 100 and 199 dollars   I pay fifteen dollars if I add another one I will  have a total of 195 I still pay 15 but now if I   select the fourth one it's free why because I'm  over two hundred dollars so let's take it to the   next level now if I go to shipping is on us and I  choose or choose a new one and I say United States   and I select the United States   I can add a shipping method flexible shipping and  in the United States I prefer to use UPS and from   no taxes but from 100 on shipping will be  free because UPS has different rules and stuff   so I say the pricing from one until 14.99 will  be four dollars then from fifteen dollars until 29.99 it is six dollars then from 30 until 49.99 it  is eight dollars and then from 50 until 100 or 99.99 it is nine dollars in  the latest one from 100 on everything is free save the changes so let me go back to the cart  and I will reduce it back to 65. over here it says if I send it to the  United States or if you buy it from the   United States everything between 50 and  99 you pay nine dollars in shipping cost   so right now it's 12 if I send it to Netherlands  but now if I change my address let me remove   this and remove this and I select the United  States and I update it now I pay nine dollars   So based on the country or even the region you  can select how much people should pay when they   spend a certain amount of money I think that is  amazing so if I bring this back to the Netherlands I'll pay 12 shipping costs instead of  nine because it's sent to the Netherlands   they found to have free shipping I need  to buy four and then says post an L free   so that's how you can work with table rates and  shipping the makers of the Ezra theme are working   on a new plugin called Mono guards and it does  what it says it makes your cards modern right   now we have a card in the corner of a website  we can click on it we see small overview then   we can go to the cards we can adjust things but  there's also a modern guard and a modern guard   is a fly-in it flies in from the right on your  website and you can adjust it and it seems to   boost the sales on your website because it's so  easy to navigate through things adjust things   so let me show you how to work with the modern  cards so in order to get the modern cards we go to   30 corp.com forward slash MC from Modern cards hit  enter and I will make sure you will be redirected   to the right page at this moment the plugin is not  live yet but I will make sure you'll get there and   then we have downloaded the plugin you can go to  the backend you can go to plugins at new upload   plugin choose the file and then over here I have  mine I open it install now and then I activate   the plugin then I go to woocommerce modern cart  over here and now I open the website in a new tab   holding command or control on the PC so right now  I have this one but if I go to the display card   options and I set it on entire website it will  be saved automatically and I refresh the page   this area will appear so by default it looks  like this review your card we see the amount   of PlayStation controllers we have I can  add more or add less or subtract I see the   percentage of discount I have for this product  because I get a few dollars of discount I can   remove it I can add a discount code I see the  subtotal without the shipping cost and I can   proceed to the checkout and over here I see  powered by card flows and we can configure   this so let me walk you through the options the  general settings I can choose a different style   so right now I see this area over here  at the right if I refresh the page and I click over here it is displayed like this   I prefer that so I choose Style 2. we can enable  free shipping that means that if I would have only   65 dollars it would say over here spend 135 more  dollars and you get free shipping depending on   when people get free shipping you can turn it on  and product recommendation you can say from the   upsells how to display that like that I can add to  the cards and then new ones will appear over here I can also say from the cross cells refresh and then you can add those   I will disable it for now otherwise I think  it's a little bit crowded over here display   coupon field well right now you see you have a  discount code you can click over here and then   it will be displayed you can also say show it in a  traditional way or disable it I want to disable it   show the subtotal over here you can also show  the total but I just want to show this update   total I do not display the shipping cost yet  the main title review your cards I prefer to say   art these are some nice options you can change the  text if you want to also when you have a website   in a different language you can change all the  text and the latest one the free shipping bar   text we need to fill in the amount and with that  amount if you fill in 200 it means that from 200   there's free shipping and that will help modern  card to show how much money people should spend   more in order to get free shipping so it's all  automatically saved floating card icon at the   bottom right you can also say at the bottom  left shelter will be displayed at the left and hide the card if it's empty so  if there are no products over here   you can hide it well I turn it on then I  want to go to The Styling the primary color   I go to the customizer to get those colors  let me go back and back to Global colors   copy this color and basis here  and the second color and copy it and I paste it and I can have the  primary text in the secondary font   color and I like them as they are then I  can change the slide out with so right now   it is this width I can change it over  here and on a mobile it's 80 I'm fine   with that the card sections styling  accordion or distributed it's up to you then click like this I'm okay with accordion the animation speed how  fast should it appear and I'm also okay with   that and I want to turn off the powered by cars  flows text freemium plugins so I think it's okay   if we do not display the credits so you can make  minimize like this and then if I add something it will be added over here automatically  and if I proceed to the checkout now I can edit the card so if I see something of  you like okay you know let's change something I   can edit the card make this one and then proceed  back to the checkout there's a skeleton loader   and then the price is changed so that's what you  can do with the modern cards here is my favorite   subject finally we're gonna talk about Texas  another state taxes now we're gonna talk about   paying taxes to the government with money we work  so hard for it to earn that is wow I love Texas   no but uh it's good that we pay taxes  in Netherlands we pay a lot of taxes   and that's why the roads are great and stuff and  the health secure things so um I always think the   more taxes you pay the more money you probably  make so it's okay as long as you're happy with   who you are as a person because out of  debt flows everything else in your life   you know now okay let's talk about Texas and I'm  going to talk about uh putting all the the Texas   information manually and about automated taxes  so if you want to know how to automate your taxes   keep watching so in order to configure taxes  we go to the back end to woocommerce settings   scroll down and I see the option enable Texas I  turn this on and when I do that and I save it a   new table up here so let's save it there  it is the Texas well nothing changes yet   because we have not configured anything  yet so also if we add this to the cards and we go to the checkout no taxes so let me walk you through the  options and the first option is price is   entered with text so what I can do I can make  sure that this is shown inclusive of text or   exclusive of texts and when do you need to do  what well if you're only selling to companies   you can say this is 179 dollars but then at the  checkout Texas will be added if you want that   then keep this option no Iowa Enterprises  exclusive of tax in order to see how this   looks we need to talk about the taxes rates  right now we have three rates standard rates   reduced rates and zero rates well let me scroll  down a bit we have by default the standard rates   and over here we can have additional text class  as well in the Netherlands we only have two   so we only have the default rates for a lot  of products and then we have the reduced rates   for books for instance so I only have reduced  rates and the standard rates and if I save it   look at this I have standard rates  and reduce rates well I will show   you how to automate this but right now I  want to show you how to do this manually   so I can insert a new standard tax rate for  a certain area so for the Netherlands it's NL   throw Netherlands and then the  rate is 21 and then I can say that   and the question is do I want  to calculate tax on shipping no   so I save it and I go to the reduced rates I  can also search for a country Netherlands I can   select it and then reduce rate is nine percent  that not for shipping save it so I'm selling   to the Netherlands and I'm from the  Netherlands so if I would go to the checkout and right now it says it's  exclusive of that 179 dollars   and with the vet edit it is total of 231  dollars why uh we pay this as a company   and this money will get it back from the  government that's just the way it works   so that's a nice way to display the price on  your website when you're selling to a company   and then over here I say I show all the price  exclusive of text and over here I can decide   well I want to display this in the shop including  or excluding the textbook I choose excluding   excluding because that money is something that  people with a company get back so only here it   will be displayed in the total amount you have  to pay is this amount so the whole website shows   everything exclusive of text well what we do in  the Netherlands we show everything inclusive of   text and then depending if you have a company or  not you can get the text back but if you don't   have a company people will pay 299 for the switch  so they will not get a surprise like when they buy   this as an individual not as a company let me  closes so they say okay I'm gonna pay 299 they   go to the checkout and they have to pay more and  they're like but I don't have a company so what I   want out of that to be included in the price how  can we do that really simple yes I will enter the   prices inclusive of tax so I save it and now when  I go to the website okay so at the end of the day   when we buy this we pay 299 but right now it says  247 so it's showing the price exclusive of the tax   or the vet so it's saying over here x vet now if  I go to the checkout then I will see a total of   299. but what I want on the website I want to  show the price inclusive of the tax or the vet   sorry in the Netherlands we only have one word for  that so I don't know if I should say vet or text   or Texas or Texas the state no so how to achieve  that well over here display prices in the shop   page including the tax and also here I want to  include the text so everywhere in the website   I see all the prices including the text so  now it's 299. when I go to the checkout I   do not get a surprise because it will be 299  and then it will say 51.89 is Texas or vet   so when I have a company and I buy this and I  want to make YouTube videos uh and tutorials   about switch related videos switch related games  then I can say hey I buy this for my company   then I can get this money back but I'm not  surprised uh that the price will be more   than 299 so this is personally how I prefer  to do it because when I buy this individual   I know I paid 2.99 and I will not be surprised  at the checkout with additional taxes and then   if there's a product for instance let's say one  of the products is a book or all the cases don't   have to go for the 21 but the nine percent I  can go to the product I can edit the product I scroll down and then here the text status  is textable but text class is reduced rate   so if I'm selling a book in the Netherlands I  know I have the reduced rate of nine percent   instead of 21. so now when I update it I  view the products and I add it to the cards   I view the card and get rid of this one and proceed to the checkout what I see is that the  included tax is 3.22 dollars is only 3.22 which   is nine percent and not 21 if I would change  this now let me show you I go to the products   all products and I search for cases I click  over here and I change it back to standard   and I refresh the page look at this number it's almost double this is 21 so that's how you  can work with rates and reduce rates okay a few   more things I want to do over here it is now not  reduced so let me bring it back to reduced update   then I want to go to the settings again so I go to  woocommerce settings to text and then I want to go   to the standard rates I want to include shipping  so and this time I say not say effect but since I   have two types of rates tax rates I want to say  21 percent fat copy this save it and over here nine percent so it will be more clear   what people are paying for so over here you see  nine percent fat so if I go to the website and I   buy something with the normal rate instead  of the reduced rate I go to the checkout it will say includes 3.22 that's nine percent  fat and fifty one dollars that's 21 of that   so that's nice if I want to combine  this I go to the settings text options   and I say display text totals as a single total  save the changes refresh now it's one big pile   of vet and if you're not selling to companies  that's great if you're selling to companies   I would definitely say itemized and  then another one the rounding if you   have a lot of products look at this  um let's add them all to the cards click here click away and I view the cards I proceed to the checkout right now this is the amount of fat   let me um edit the cards remove this  one so there's only one type of fat which is 21 403.17 well if I would say round text  at subtotal level instead of rounding per line   that's better for when you're  selling to companies because   um right now if I uncheck this it will round up  every vet number per product and then it will be   added to this number but when I check this it will  round all the taxes taxes at the sub level so it   will add all the taxes of all these products  and then it will round it up I think that's   better when you're selling to companies I know  for sure that's better otherwise you get weird   missing numbers of two cents and three cents and  you're like where is it but if I refresh it now in this case it's the same but it's better  to to calculate to sum up all the taxes of   all these products and then round it up to two  decibels after that point I hope I explained   it well just turn it on it's better and  um depending if you if you sell only to   customers you can use as a single total and  then it will say it's vet butts but but wait   I'm selling to the Netherlands but what if  I'm selling to the United States where's the   vet now well in order to set it up we go to the  standard rates and I insert a row and I can say us fifth or ten percent ten percent save the changes and reduce rates also us let's say five percent five percent fat  not for the shipping okay now look at this refresh   this is the amount of text for the United  States so that's how you can set up taxes but   for every state there's another Texas so  you can search for tax jar United States there you go and then you see  California 7.25 so what you can do   here's the state code California you see 7.25 7.25 but then you need to do that for all the  states you're selling to so Washington 6.5   and if you do that by the way just a reduced rate so I need to   do it for the standard rates CA then I need to do  something else I need to go to the text options   and I need to calculate the tax base right now  it's the customer shipping address that's the best   because people that buy from California will pay  different tax amounts than people from Iowa Iowa   let me see Kansas Colorado I've been to  Kansas I've been to California Hawaii four percent wow so um yeah that's what you  can do but there's a better way we can also   automate this whole thing but what I wanted to  say let me not get carried away if you're only   selling to one country you can use the shop-based  address because then all the taxes are the same   and it will not change based on where people  live but I sex I sex did I really say that   I can't cut it out I can also leave it in I will  leave them and it was just an honest mistake   out of the heart out of the  Buns of the heart flows okay   customer shipping address I leave it as  it is and by default we we decide per item   uh what kind of rate it should be so if you  want to change something you need to go to   the products all products wait let me saved  first we go to the products all products   do a quick edit and then you can change the  text status to textable and reduce rate uh one   more thing you can go to woocommerce settings text  and then if you want to you can say everything is   including the fifth and then on your whole website  it says that but I I don't want that but hey   if you want it you can do it because it's your  store thanks remove this so now everything is   calculated perfectly for my customers and then  if they have a company they can get their taxes   back if they don't have it it's also fine in  order to automate taxes we go to the back end   we search or we go to plugins at new  and then we search or woocommerce text and say woocommerce shipping and tax install now activate and then it will  prompt us to install Jetpack   and connect that's what I will do by clicking here okay now I need to log in you also I already  am logging in because they know who I am   and otherwise you need to  create an account I dismiss this   and now that's it now I go to woocommerce settings to text and here automated texts I want to  enable it and it will say enable this   option will overwrite any text rate you  have manually added that's it I save it   and Now Jetpack and woocommerce will do  all the hard work all the hard calculations   for us Mary did you know that there are so  much woocommerce settings Mary Did You Know   I don't mean to be disrespectful to any  religion I think it's a beautiful song I   Like it sometimes I like to have some fun maybe  you don't like it maybe like it okay I want to   talk about the woocommerce settings there are  a lot of woocommerce settings but we covered   a lot of them already shipping payments email  no not email yet we'll talk about that so let   me walk you through the options the settings  of woocommerce there are not that much left   and then we'll talk about email so we covered  a lot of settings already let's take a look at   all the other settings I go to the back end to  Media just kidding I go to woocommerce settings this needs to be your address you can sell  to specific locations or to all the country   in the world if you do to a specific  amount of countries filament over here   shipping locations of course only to the countries  you sell to the default customer location leave it   by default they can fill it in we enable Texas  we enable coupons and this is how you can Define   how your currency should be displayed for instance  with Euros we use a Point as a thousand separator   so what I see on my bank account just kidding and  a decimal separator is a comma in in Europe so uh   filled in as it should be for your  country then we go to products   uh actually I don't need to change anything over  here you can change the measurements weight and   dimensions enable reviews and reviews can only  be left by a verified owner so only people that   bought something from a website I don't check that  and I'm okay with everything inventory we talked   about already about that I want to get an email  when there are only 20 products left of a product   downloadable products it's all self-explanatory  and at the same time I don't change anything about   all these settings we covered text shipping  payments let's go to account and privacy   and now if I would go to the  website in an incognito window and I add this to the cards  and I go to the checkout   I can fill in my email address  and my details my payment method but how cool would it be if I allow customers  to log in into an existing account during the   checkout I also want to allow customers  to create an account during the checkout   and when they create an account they  will get a link from my website like   hey you can set up a new password  because they're a new user that's all   say the changes we're gonna talk about the  privacy policy in all those pages later   then emails we're going to talk about that so  let me go to Integrations and I don't need and   I have any Integrations and I go to Advanced and  if you have a website in a different country or a   different language you can change those URLs if  you do that afterwards go to let me save first   then go to settings permalinks and then save the  structure twice so they will be saved an important   part of having eCommerce website is the emails  you send to people that buy things on your website   if that looks ugly if that looks woocommerce  like it's not that appealing there's always   uh by default there's a ugly purple color  sorry if purple is your favorite color it's   ugly and when you buy something that email looks  ugly so we're gonna make that email look better   so when people buy things on your website they get  an email that looks beautiful as the right content so are you ready for that part  I am I hope you're too let's   go so that brings me to the  following woocommerce settings and then there are the emails settings well  in order to check how the emails will look I   need to go to the payment options and turn  off stripe I turn off Clara now I turn off   PayPal and I want to turn on cash on  delivery so I can process payments   so now I can buy something so I go to  the checkout I filled in all my details   cash on delivery I agree and I place my order  okay my email account is turned on what is this I place the order my email account is turned on  so I'll get two emails one as an administrator   and one as a client this is as the administrator  I get this email because I'm the website owner   there's a new order 176. the Nintendo switch  2 and the Nintendo switch OLED model so the   total Mount should be paid through stripe  clarina or PayPal but right now I set cash   on delivery so I can buy things without  paying because I'm testing this for the   tutorial but what I see is that I don't like  the colors there's a lot I don't like over   here I don't like the colors I don't like all  the text over here but let's take a look at   this email that's the email the buyer  gets thank you for your order hey Freddie   just let you know we received your order  have a blah and it's now being processed   the payment method the date what the person has  bought the price and where it will be shipped to   thanks for using consoledelivery.com and then we  see this over here well we can adjust it we can   make it look better because um maybe I think this  title is too long maybe I want to change stuff   over here how can we do that well let's go back  to the back end by the way this is how it looks   when people buy things I think it looks beautiful  great and then they can go to their account if I take a look at my orders here it is beautiful  so let me go to the back end as an administrator I go to woocommerce settings I go to emails and there are a lot of emails there are three  emails I will get as the administrator those three   so when a new order arrives when the order  is canceled or when the order is filled so   the payment filled I get an email like hey  somebody tried to purchase but it failed   now I see the reason why it failed an order is  canceled I see it and this is what the customer   gets all those emails we can adjust them one  by one and we can adjust a few things that   will be applied to all the emails that will be  sent and that's over here below the from name   well I prefer to say console delivery we  deliver I don't just like that really easy   the from address I can change  it to info at console delivery if you use sitegrounds we can go  to YouTube site a ground tutorial over here 37 other features and here you  can see how to set up any more accounts   uh let's let me keep it with Freddie Corpus  hook.com then there's the header image okay   I open this in a new top tab and I go to my logo I think it's really big so  what I can do I can copy this   I can paste it in a new tab I can save it then I can rename it to 300 pixels  I close this I go to the fell it's   not there anymore because I renamed it okay  let me go to the desktop I drag it over here let me make it smaller for instance 300  pixels click on skill that's it close it and go to the image it's 300 in with I copy the  URL closes closes I paste it over here and now   an image of my logo will appear above  the email then there's the footer text with the title built with woocommerce I want to  change it so I say we wish you a lot of gaming   pleasure something like that then there are the  colors let me go to the website to the customizer   then I go to Global Global colors  and I grab this color I copy it okay by the text color I want to make it um save it so we changed a few things already  and now we can preview our template   so console delivery title the text  and it looks a lot more in the style   of our website wait we can do more so if  somebody orders with cash on delivery orders   being processed so what I can do I can go to  the processing order email and I can click on it and now I can say your order has been  received or thank you for your order   and paste it here but it's okay additional content  thanks for using blah blah that's what we see   over here so I can change the text thank you for doing business with us if you  have any question feel free to reach out to us questions save the changes  so how about in the order which headset I would love to have it so I  go to the checkouts I agree place the order okay I got two new emails here's the  one I got and it looks so much better   already and we changed a little bit of  the text and then here it's for the user it looks like that but we can take it a step  further right now we see it's from 30 Corps shook   from this email address and that's what we  decided to do over here let me go to the back   ends woocommerce settings emails over here  from console delivery well it's not visible   over here because I linked this email address  to 30 corpse in my email account so normally   when somebody else buys it I'll show you we'll  see console delivery so so far so good but we   can take it to the next level if I would  go to the processing order I can manage it then I can copy the file to the thing save the changes so now here at the Astra  woocommerce emails customer processing order I   can change the PHP field so it looks a little bit  technical but let me show you what we can do now   so I go to appearance theme  file editor I understand then   I scroll down and go to woocommerce emails  custom processing order and this PHP file   will overwrite the default one from woocommerce  so if I change something over here it will be   changed in the email we sent so just to let  you know we received your order what I can do it says just to let you know we received  your order it's now being processed   so if I change something over here  we want to let you know that we received your order your order number is one  we will prepare your order and let you know   when it is sent to your address okay that's something different update the fill successfully edited so now let me buy something this time with a different account  different email so what I want to do I   want to open this in an incognito window  I want to buy this go to the checkout with 30 Corpus hook gmail.com [Music]  my first name of course is George   Washington from the Netherlands shipped to the same address I want to pay  cash on delivery and I place the order I get this again nice overview and  now if I go to my Gmail account   there it is the name is console  delivery thank you for your order   it looks nice and we want to let you know  that we receive your order your order number   is blah blah we will prepare your order and  let you know when it is sent to your address   wow and then here thank you for doing business  with us if you have any questions feel free   to reach out to us so we changed a lot  even the PHP stuff and we can do the same with all the other emails well there are a  few emails I use so I go to um settings emails   so um normally it's a processing order and then  the completed order so I can click over here   and I can um I can say your products are being shipped safe so now as an administrator and what I do I go  to the storehouse or whatever maybe I do automated   drop shaking shipping stuff what I need to do when  I know that the package is being sent to the right   address I go to the orders I go to the order of  George Washington I check if he paid the money   if I see it on my account I pack the stuff send it  to the right address go to DHL or something else   FedEx and I change the status from processing to  complete it when I do that and I click on update I go to my inbox and I see console delivery  thank you for shopping hours hey George we   finished processing your order now it says  the title says your products are being shipped   and with the same principles we can change all  this this and this text over here okay if you   have any question If the product does not arrive  or I don't want to make people scared if you   have any question feel free to reach out through  this phone number or through this email or chat   so that's how you work with it and I think  it looks great if I click over here I see   it's from inside Freddy corpses because that  is what it's saying over here at settings   emails email address so I think it looks  amazing and now you know a lot already we   created a webshop created different kinds of  products styled everything with extra Pro we   talked about Texas shipping payment methods  emails so we're getting further step by step   so if I take a look at the website this is how  it looks right now and people can buy things on   our website we have covered so much already this  tutorial is getting longer and longer I'm sorry   I just want to cover everything and actually our  website is up and running people can buy things   on our web shop but we have a complete website we  have a website and in the website we have a web   shop so I want to focus more now on on the rest  of the website so let's take a look at the header   let's create a beautiful header using extra Pro  it's time to look at the header of this website   let's make it better we can go to the customizer  and make it look so much better so the first thing   I want to do I want to create a few pages that we  can place in our top header menu because right now   we have our primary header area then we have  the top header we have the bottom header so   we can have three rows and three colors so  we can have nine places in our header where   we can place things so just to show you if  I click on the plus and I go for an account you see there's a new row and then that row  can have certain colors so if I click over here   I can go to design I can change the  background color to this blue one then I can go back to General and I can increase  or decrease the height so let me make it 30 pixels   and then I can go to accounts then I go  to design and I can change the color of   the icon so I can make it white so in that  way we can create a top header a main header   and a bottom header and we can adjust it we can  place a lot of things in it so let me walk you   through these options but I all started with  saying that I want to create Pages for the menu   so I go back and then I go to the menus here  below I want to create a new menu so I create   a new menu and I call this one the top menu  I want to assign it to the secondary menu   I click on next now I can add items and if I click  over here I can create new pages by entering them   over here so we already have the shop page the  terms and conditions my account checkout and cards   I want to have an about us page so I click on  ADD and it will be added then maybe I want to   have a Blog blogging is a great way to get viewers  through your website through the search engines   and then people can buy things on  your website so I want to have a Blog   I want to have frequently  asked questions so I say FAQ maybe I want to have a newsletter so I'll have   a newsletter page so people  can opt in to our email list and I want people to be able to get  in touch with us so contact page   so there we have it our top menu but we don't see  it over here in order to do that let me publish it   then I go back back then  I go to the header Builder   I close this then I click on the plus  and I want to go for the secondary menu   but I don't see it why we need to configure the  colors and stuff so I click over here let me go   to design and then I want to say that the color of  the text should be white and now it appears when   we hover over it what color should it be well I  still wanted to be white but if I would say orange   it will be orange let me give it a white and  when it's active so when you're on the about   page how should it be colored well still  White and if I leave this empty so I only   choose here white the color if the color is empty  it will automatically grab this color but for the   backgrounds I want to have a different color when  I hover over it I want it to be orange and now   look at this so when I would go to the  newsletter page what I can do I can make   sure that this is orange so people know we're  on the newsletter page well if you want that   fill that in over here I don't want that so I keep  it empty then I want to go to the font I think I   can it can be a little bit smaller so over here  the font menu font and I can increase or decrease   the size so our start with zero I think 11.  it's great I can make it uppercase if I want to   but uh I'm okay let me bring this back to 11  because it's really small now I don't know why   so great we can play around with the spacing  so if I turn this off I can say from the left every every item has more space on the left  so if I would increase this to 50. you'll see   it over here This Is 50 pixels you can also  divide it evenly evenly how do you say that   but then to also increase the height so I don't  want that but I can say top zero bottom zero   and right 20 are left 20. and then do I have  some space in between well I don't need that   so I leave it all empty and then for  the margin what I can do I can uncheck   this bring this back to the left a bit so  it aligns better with the c off console I personally preferred it and that's only about  the whole menu so uh that is my preference   if you want to you can have a border in between  but I don't want that so I leave it with this then we can go to General and we can change the  width of the sub menu so if you have a sub menu   but I suggest you don't use a sub menu because in  the top menu I think it's not a good fit and then   if you want to you can have an item divided for  the sub menu but I just said someone who is not   a good ID top header so so I'll leave for this I  publish it so now we have our top header over here   but we can have more things in the same area so if  I would click on the plus I could have a divider does this over here and then I can go to click  on it and then go to design make it white increase the size decrease the size increase it  to 100 that's what I prefer then I go to General   I can change the style and then I can click on the Plus or click  over here and I can add something else so   maybe a button for people to sign up for  the newsletter or just a simple html text and I can click over here and I can say sign  up for the news leather I can make it a link I have the link to the sign up of the  newsletter right now I will leave it like this   then I can go to the design text color white also  the link color white when people hover over it   white font size size let's do 11 like  over here so that's what you can do   and then here at the right top area I  can click on the plus and I can go for social okay I click on it I want it to be white of  course so I go to design the icon color White when you hover over it maybe again  the the background color can be orange you see there's a lot of space for a margin so I  can increase it I can spacing decrease the size still a margin so I can  background spacing increase that but then we should probably  make the the eigen size bigger   let's decrease the spacing and that way  you can adjust everything to your wishes and this is what I like okay perfect publish and I want to have one  more thing over here and that's my account   so I click on the plus and I search for account   you see that area over here let me adjust  it so I'll do a line with this area   so how can I do that I can create an avatar so if  you have that you will see your image like that   I use an icon so it lines up with the other  Style and when you click on it you will log in   over here let me go to the design  I can choose a different icon I choose this one I can size let's do the same  one as socials which were 14 so I click here design 14 I can color is white the spacing  I uncheck it and at the left I decrease it and at the bottom I increase it and everything I increase I  want to decrease it at the top so let's see it needs to be the same  number so I think it's aligned perfectly I think we have done a great job what I  also can do I can get rid of the divider   bring this to the center sign up for the  newsletter and then I can get inspired by   other websites so I bought my PlayStation at Aslan  gaming.nl or to see things about the delivery   40-day money-back guarantee two months of  guarantees you can pay with ideal credit card so I can also have something like this over  here if I want that I can just type it over here we deliver in every country in the world something  like that or free shipping when you spend 200   something like that you can have anything anything  over here so let's publish it let's see how it   looks on the website great before we continue I  want to adjust one more thing or talk about one   more thing which I actually forgot I'm so sorry  click over here of course I can edit the URL I can also add things so add on  social media icon I can say YouTube they can have the URL and then over here I search for YouTube and there it is publish okay and then I can go to the  secondary menu and I think you know what   you deserve it to be seen if  I click here go to the font make it 13 also over here design 13 and then we can take a look at the  main menu well what we see over here   we already have a card icon because we  use modern cart if you don't you can use   this one I get rid of this one because I  already have this one so I close the card   right now the primary menu is shown at the  left right I want to drag it to the center   and then I want to create a menu in order to do  that I can do that by going over here to menus   I have a main menu and I can add items so what  I want to add over here are product categories   I'm selling consoles so I want to focus on the  PlayStation 5. the Xbox series X the Xbox series s   and then Nintendo switch and if you don't see  this over here click on publish close this go to the back end to menus and now here at  screen options turn on product categories   product tags Etc and when you do that we also  can select our main menu over here and then here   below we have product categories so talking  about categories I did not do that actually   I could talk about it more because right now  I have the Xbox series X the Xbox series so   what I can do I can go to woocommerce let me see  products and then categories let me saved first and I can say X Box series as a category   and then over here the series X I click on it and  I say it is the parent of Xbox series update it   I go back to the categories the same with  x click on it make the parent Xbox series   okay then I go to Xbox series this one  and that will be the child of consoles   what we also can do we can give all the  categories an image so accessories click on it   upload an image or grab an image so accessories  it can be anything so for instance controllers update I go back to cases well in case  an instance of a case is this one update   I go back so I can give every category an  image and then when people sometimes click   on the category they see the Right image so it  looks better so let me go back to the menus where   we're talking about let me go to the front end  customize scroll down all the way menus sorry menus name menu I want to assign a main menu to  the primary menu what will happen it will appear   over here in the center oh man I like  this so PlayStation 5 Xbox series X   Xbox series s Nintendo switch so I want to  change the menu how I remove this category   I remove this category if I click on ADD items  for other categories I want to add Xbox series and then accessories so PlayStation 5 Xbox series Nintendo switch  and accessories what I can do now look at this   I can have PlayStation 5. I can have a subcategory so I can have games below PlayStation 5 so I  can show PlayStation 5 games   I have Xbox series I can say you know  what X and S I make it a subcategory let me bring back games to the right place   sometimes it can be a little bit clunky and if you  don't like it the way over here you can go back   then go to the menus to the back end there it  is not clunky so there you can really make this   subcategory of PlayStation 5. I save it I go to  the website now you see the categories in the   subcategories so if I click on Xbox series  X I only see products for the Xbox series X how great is that I think it's really  great if I click on accessories I see all the accessories so no  PlayStations itself no console itself   only accessories and I can change look a few  I think man it's getting better and better oh   man I'm I hope you're as happy as I am with the  results so far but this is how our website looks   right now and as as I said before we want to make  the whole process as easy as possible so one other   thing I'm thinking of is the search bar I want  to have a search bar there is one but I don't   like it it comes standard with woocommerce so if  I would go to the customizer to the header Builder I click over here on the plus and I go for  search icon and publish it and I close it   I can search for a Playstation and I like the way  it is displayed over here and I click on search   but then it looks like this  and I don't like that at all   so let's make it look better first  let me get rid of this customize click over here remove it click on publish so  what I do I go to the back end of the website I go to plugins add new then I search  for search it's a free plugin Advanced   view search from elit something like that a  lot of likes I install reviews install now and activate it there's Advanced boost  search I click on it I go to settings   I close this the first thing I want  to do I want to use this shortcode   copy it and then I need to  re-index the table by clicking here so now all the products all 17 are indexed I go  to the website all in command so I go to a new   tab I customize it I go back I go back I go to  the header Builder I click here on the plus I   go for HTML so let's do html2 and click on html2  and really simple I can paste the code over here   and it will add the search bar well it doesn't  look that good yet it will make it look better so um let's talk about the display over here in  order to do that we need to go to the search form and we can show the the form styling so right  now it looks like this search maybe it's better   to have this area the search I can so people  see better that's the search area like that and now we need to make it look  better so I go to the customizer go back to the header Builder I click on html2  I go to design I uncheck this and I want to   create some space from the bottom and at the top  I do the minus so I want to bring it in the center I can do the Pixel Perfect by playing around  with the margin plus and the margin minus and   keep in mind that t should be the same in  order for is to be in the center publish close it do not look like this and if I search for  play station look at this this is how it looks   and I want to view all the results and it will  be displayed exactly as I want it to be displayed   because it's the same as when I would go to a  certain category so that's what I like and it's   free now I like it when it's free I hope you do  too so let's go back to General okay search in   if you search over here where should people what  what should be uh be displayed people can search   in the content that means also in the long and a  short description in the SKU so when people search   for an SKU the product will appear so to give  you an example if I go to one of the products   let's go to one of the first ones the PlayStation  dual sends wireless controller the SKU is this one   that means when I searched for this  it will appear when I would go back   to advance move search and I turn off the  SKU and I save it and I refresh the page   and I search for this nothing is found  so people can search for SKU I turn it on category yes deck yes ID no because the ID  is a number people don't search for that   so that's all for now and I'm okay with this then  I go to the performance   that is all fine and go to the search form  the search field text right now it says   search I can also say search for products if  I would save it which I am doing right now search for products view all results  that's the text that will be found here below view all results   I can use capitals for every first letter  afterward nothing is found this will be displayed try better so um if you want to go this route do it this way try better okay I would not do this I think it can scare people off nothing found is better   minimum number of characters so  when you already hit one letter search results would appear or you can say after three letters that people  that that the search will start so if I save this   and I refresh it I say b l nothing happens but if I had hit  the third letter now it starts why because   I said 3 over here show the loader so when I'm  searching chose loader show the clear button let's take this X fuel results yes uh mobile full screen yes  I like that for styling we talked about that   and then go to the search results and what I don't  like if I search for PlayStation look at this all   this text I don't want to show that I actually  want to show the title the image and the price   so in order to fix that let me go to the view  area show the image yes show the description no   show price yes sales best yes SKU no no no so now  if I refresh the page and I search for PlayStation this is exactly what I want to see so that's  how you can create a header okay the website   starts to look better and better but let's take  a look at how it looks on other devices like a   tablet or a smartphone I think this looks  great let's take a look at the tablet and   if it's not fixed you're gonna be scared because  look at this what is this what is this thing   doing over here well it's a small glitch in  my opinion you need to go to the logo area   I told them already can you please shut it off  because this looks much better and then if you   go to the smartphone view it looks even worse so  um also turn it up over here and since we're here   selecting the logo which you're on the mobile  just decrease the logo a bit or not that much   but I'll make sure that this area is visible  and I would make the logo as big as possible   as long as you only want to  use a logo and a toggle button   as soon it starts to push then I would decrease  it 200 perfect so that's the first thing I want   to talk about when it comes to optimization for  all devices right now it looks like this if I go   to the development we see our whole menu  is gone and it's up to what you want if I   would go to Ashland gaming.nl where I bought  my PlayStation and I make the screen smaller it looks like this the menu at the left logo  in the center and here search area in our cart   if I make it even smaller it stays the same  well there's room for improvement over here   or it's on my website so that's something  I want to do over here I still want to have   my top bar so I can how can I do that I  click on the plus I want to go for html2 no sorry html1 because there is text  we deliver worldwide so immediately   it's blue which I like I click on the plus  over here and I want to add my social icons there they are so in a short amount of time we  have our menu back almost exactly the same I can   also bring this to the Center for tablet bring  the menu to the left if I want to but I see   no reason to do that since it's already at the  right and I can even bring back my search area and I can talk all that so I  can also make it look like this and this okay so I'm happy with that I can even  decide to have a different area over here for   a tablet but I'm happy now I publish it and  then I want to go to the smartphone View and   then there will be a problem look at this so we  deliver in every country in the world that's now   in two lines so I can decide to get rid of the  social icons and I can bring this to the center depending on what you think is more important  I think this text is more important than the   social icons I get rid of html2 and then I have  this logo in this area well right now it's a   drop down if I want to fix that I click on the  total button I get three dots but I prefer the   normal one I can also make it outline or  a fill area I can also make it bigger menu   then I need to make a logo smaller again about  180 160 140 . something like that it's easier   for your thumb to to click on it um but um I  prefer to stick with 200 and then over here   no text because people by now know that it's the  area I need to click on in order to get the menu   I like the minimal design when people click on it  what should happen right now it's a drop down so   I can click over here of the off canvas settings  because there's an off canvas menu it says it's a   drop down so I can also make the fly out and  this is by the way the same for the tablet sorry let me publish it I can make it full screen like that then I can bring the text to the center like that I can go to design and  I can change the background color   something like that and then I have white text  well that's up to you but since I don't use that   those colors I prefer to stick with the normal  one I can increase the betting so it will be more   towards the center if I say percentage  everything should be 10 near to the center is what you can do uncheck and then I like to give  everything as it is you can go back to General   I'm okay with this so now I need to go to the  menu because what do I want to display over here   or I can have an item divider so you see  all those lines I can hide this on the   tablet well I don't want to hide down the  tablet but I can't do that if I want to   and I will explain in a minute why so I want to  configure the menu let me publish this and then   I click on configure the menu from here and it's  an off canvas menu that will be displayed on a   tablet and on a smartphone so we have the  off canvas menu I can select the menu or   I can create a new menu so what do I want to  display over here I call this one the off canvas   menu I scroll down click on next and  I can add items so I can go the same   do the same thing what I do on the  home page only show four categories   so PlayStation 5 Nintendo  switch Xbox series N accessories publish now I see this but I can also and all the other pages for  instance the shop page this newsletter page   contact page FAQ blog about us and then I need  to make the right order well keep in mind what   is the goal of your website it's to sell stuff  so I would focus Less on the about us page focus more on everything you sell so I  can make it look like this   but that's that's not all this is only the  off canvas menu what I also can do I can go to the header Builder and then here below I  can click on the plus I can add the search   area so if I click here I see the search  area so then from the menu people can search or I can add a divider doing the  search and the off canvas menu   well I need to configure it make it horizontal  like that and then hide it on tablet or not   so here you can add stuff and then here you  can configure how everything should look I think the off-cam is menu should be displayed like this shop PlayStation  switch yeah like that and then below if you want   to have something there you can edit so let me see  if I can make this bigger go to design menu font   I can definitely make this bigger even bolder because it's on a tablet or a smartphone so it's   better when when it's easy for people  to navigate maybe a little bit smaller then I go to the smartphone I'm happy with how it looks great what I see over  here looks a bit crowded so let me go back since   we're talking about optimizing websites for all  devices I go to woocommerce to the product catalog and then let's go back to the tablet  view because there are a few settings   for instance how many columns should  it be on a tablet and I say two   much better then for the smartphone how many  tablets or how many columns should there be one better and then I click on the product how should this be displayed on a smartphone well  I think it looks great we see the image first   then add to the card all this information related products if I scroll  down I can edit to the card proceed to the checkout we can  fill in our details place the order   and that all looks great in my opinion so I  click on publish bring this back close this   and then I'm at the home page and now the header  and the website looks great for all devices already configured the header of our website now  let's take a look at the footer of our website   so let's take a look at the footer right  now this is our footer and we can make it   look better and as always it's not a problem  it's not bad when you take a look at other   websites that do around the same thing as you do  because then you can learn especially when you   go to Facebook and you see advertisements  then you know those people that advertise   probably optimize their website so when you see  an advertisement go to the website see how they   put everything together and get inspired  by it so I bought my PlayStation on a Dutch   website Ashland gaming.nl so I take a look  over here about us we're available seven   days per week between 12 and 8 number you can  chat with someone information about the office   how to get in touch more information about us  frequently asked questions and dispute page and   then there are all the legal Pages we need and I'm  gonna talk about it in a minute so um information   about the company and then this beautiful button  that brings us over here and then I see hey   I can buy a switch but I already have one but I  can buy second one and then I can play together   with my son but he's only three years old  isn't he too young maybe so I'm inspired   I go to the customizer and then I click I go back  first and I click on footer Builder there it is   right now I have my copyright area over here and I  can click over here and then I go to the settings   of this row I have three rows or columns now rows  up row middle row and the bottom row so here at   the bottom row I see this information that I can  click over here and I can say I want to have two   columns for instance one at the left I want it to  write but I want to have one column in the center   and then the height is 60. then I click on the  copyright area then I open a widget and in that   widget there's text and I can change the text so  I want to get rid of copyright because I already   have this sign with the current year so it will  change automatically then I want to create a pipe   and I can have the site title but I can  also say we deliver you know what I'll   stick with the site title and I don't  need to have the power by theme other so that's it I can click over here go to  design and change the background color to Blue   then I can go to the copyright area go to the  design Tab and change the text color to white I'm   happy and then above there's another area and if  I click over here I can decide how many columns I   want to have right now I have three I want to have  four so I can change the column amounts over here   and I can also change the way it looks so I  can make this a little bit bigger than the rest   then we can bring it back really easily how to  stick with the content with if I do full width   it will go completely from the left of the page  to the right even if you would zoom out or have   a really big computer screen so I stick with  the content width and I do not want to hide it   on a desktop so what I want now I click on the  plus I want to have a widget area one over here   widget area 2 over here widget area 3 over there a  widget area four over there I click on publish and   not a lot is happening right now as you see I only  can add widgets so I have four widget areas and in   those widgets areas I want to add widgets so how  can I do that well I click on this I can over here   the general icon now I can click on the plus  and I want to add my logo so I go for an image and I choose one from the media library  which is my logo I select it and we have   a dark background over here or you want  to have one then you can make sure that   you use a lighter logo as long as the logo is  visible so what I see this area is really big   because this whole area is bigger than all  the rest of them so I can go back over here   and bring it back to 25 so that looks better  I click back on the widget area on the image   then there are three dots and I click on show  more settings so I can change the size it's   also what I can do just uh stick with the other  width and then change the size but I'm okay with   this I go back I click over here on the caption  and I want to say something about my company great publish then I want to click outside of  this widget area because beside a widget I can   add other stuff so I click over here and  I want to add socials so I click on social   and there it is I click over here and  I can add Facebook Twitter Instagram with the right URL of course   I can add other stuff as I've shown before  over here at the top so let's add YouTube and I can select the YouTube icon great then I can show the labels if I want to bring them to the left I can hide them  on the desktop I can go to design and I   want to use the the colors of my website  so I start with a blue color and when I   hover over it I want them to be white  so you don't see them anymore but then   also take a look at the background color and  I want to make it orange when I hover over it   okay then I want to increase the spacing so I  scroll down a bit I can size it's okay for now   I can background spacing I want to  increase it and that looks like that make it bigger I can also make them round but I'm okay with the square okay that's how we  can create an area next I want to have useful   links links like uh actually legal links so uh I  go back I go back I want to create a new menu so   I go to menus create a new menu and I call this  one legal and I assign it to menu three next   add items I already have two of them as  far as I know that is terms and conditions   okay then I need to add a second one shipping and returns return [Music] policy  returns plural so what happens when people   buy something it will be delivered to Africa and  they want to send it back because it's broken   or something what are the terms and conditions  in the policies so in the third one disclaimer   the fourth one privacy policy and depending  on the country where you come from there there   are different things you need to have on your  website different legal pages so Google it or   hire a lawyer or just Google it until you  know what is applicable for your country   I think we're good to go with those four  so it's called Legal I go back I go back   and I go to the footer Builder widget  area two I want to start wood heading heading nice call this one legal then  I click on the plus and go for a menu navigation menu I have no title but I select legal  and then disappears okay great then I want to add   another widget area or it's already over here  so I click here click on the plus heading useful   links click on the plus and I search for menu  and then I want to add the same links as I have   on top of the menu there they are and then the  fourth area click over here click on the plus   I want to go for a paragraph and here I  say something about my company address I make this a link also make this a link foreign the heading contact us then bring it to the top I  want to bring it from H4 2 to H five just like here H5 and here H5 okay publish what we can do I can select  this whole area take a look at the design I   can change the Border color to Orange for  instance and increase the amount of pixels I can increase the spacing I can change the  background color to something else yeah that's   perfect I can make it dark if I want to and then I  need to of course make all the text lighter but um I'm happy with white so publish okay let me go  to the smartphone view let's see what happens   and what I see it's totally against the side of  the phone and I don't like it so on the phone   I want to create some spacing quite a  bit I don't like it when things stick   to the site I think it looks great so make  sure it looks great on on all devices let   me see how it looks on the screen so  let me close this so this is our footer but I don't like is this space over here  so how can we fix that well we can do it   through a few ways let me show you right Mouse  click I click on inspect I use Google Chrome   what I see when I hover over here over here is that there is a big space below  this I don't like it so what I can do what I   see over here widget margin bottom is 3.5 em if  I would decrease this to zero it is gone if I   would say 0.8 It lines up with this area almost  I can also get rid of this and say 10 pixels and   then it seems to be lining be aligning perfectly  with this text so what I do now I copy this area   command C closes refresh the page so it's now  like this again then I go to the customizer to the Cs sorry go back go back to the  additional CSS and I paste it over here   if you want to write it dot widget opening  parentheses margin dash button then BX like that publish close and now it looks like this so there it  is how it looks right now I'm really   happy with it they found I have a button  to go back up I can go to the back end   to appearance extra options and since we use extra  Pro we can activate a lot of extra functionalities   and one of them is to scroll to top area if I  activate it I can go to the website customize it go to Global scroll to top   change the eigen size okay there was a delay so  let me bring this back I want it to be at the left   because here at the right we already have  the card icon if I click on it I will go   upstairs or up again close it scroll down  I can click over here and I go up again   great I want to congratulate you on reaching  this part in the tutorial because that means that   you're persevering unless you just clicked here to  go to this part of the tutorial if that's the case   I may need to disappoint you why well I like free  page Builders and my favorite one is Elementor   element there's an amazing free page build that  will enable you to create amazing websites but   that page builder is in transition what do I mean  right now you create websites in Elementor using   sections columns and in those columns you can  have elements but they're changing the way you   make websites with Elementor they're gonna work  with um not sections anymore but with containers   and the whole way of making websites with  Elementor will change so if I make a website   or a tutorial right now with the current way then  this tutorial will be outdated in a few months   so I decided to give you a template for free with  the container Builder but the container Builder   is not yet released maybe if you've never used  Elementary like what are you talking about well   they will change the way how you make  websites so I will give you a template and   when the page builder the new page builder  Elementor container Builder is ready I will   make in-depth tutorials on how to make Pages  using Elementor the new way so I do not put   it in this tutorial because it's already it's a  tutorial on its own and this tutorial is getting   too long already so I will show you right now  how to make use of Elementor how to upgrade it   already so you have the container Builder and  then how to import my pre-made template for you   so let's do that right now so it's time to create  a homepage but as I said uh Elementor is not ready   for the container Builder yet and when it is  finished when it's live the new container build   I will create in-depth tutorials on how to create  Pages like the page you're gonna import right now   so what you can do you can go to the back  end then we go to a new tab go to 30 corp.com   forward slash and Mentor hit enter and that's the  page builder I want to use I go to the home page   and if you want to download the free  version we're going to use the free version   somehow they seem to hide it every  time so I need to go to pricing   let me see the page builder plugin then  somewhere here I should be able to find it   so there's a better way I close this and I go to  plugins at new and then I search for a Le mentor then I will install Elementor Elementor  website builder a lot of installations   and you know what also essential add-ons  for Elementor install now then I want   to activate Elementor and I want to activate  essential add-ons now over here I click on next   scroll down click on view all and I want  to add all the woocommerce related elements next next next no thanks congratulations so now we can use a few  beautiful elements that are made for Elementor   now I want to create a new  page so I hover over new page   and I want to create the home page  home and click on publish twice   now I want to go to the website by clicking here  go to the front end then I go to the customizer I go back and here below at the home page  settings I want to select the static page which is   the home page which we just created and then  at the post page I want to select the blog page   then I go back I go to the sidebar I  turn it off by clicking on no sidebar publish close so now the home page   is the page we see when you go to your domain name  so this page over here now I want to edit the page with Elementor by clicking on this button now  Elementor is loaded when you see an intersection   over here that means that the new version of  Elementor is still not released so what I will do   first click over here on the three  lines I go to the user preferences   I change the user interface theme to dark I  turn on editing handles then I click on update then I click here I go to the page layout  and I change it to Elementor full width   update I want to make use of the container  Builder because I created the template for   you in the container Builder I click over  here I exit Elementor and then I select   WP dashboard so when we click on XLV we go to  the dashboard apply yes leave the side and go   to the screen options Elementor overview I want to  get rid of that and the recent reviews I want to   show that and bookmark status how much we have  sold now I go to Elementor settings over here then I go to experiments and I scroll down and  then there's the flex box container I want to use   that by making it active scroll down and click  on Save the changes then I click here to go to   the home page I edit the homepage with Elementor  and now what we see over here at the left is the   container Builder it's in beta it's almost ready  so I assume you can use it on your website I use   it on my website and it's having a it's creating  no problems for me and now if you want to import   the page I have made for you because right now  I don't want to create a tutorial about this   because standard tutorial about woocraft becomes  so long and people get scared because it's six   hours so I have a separate tutorial about it  and I'll create it when a container is ready   so if you want to find it you can go to YouTube  search for container tutorial 30 I already have   one but that's old the one eight months so go to  the one which is uh the newest one so uh update it   or uploaded a short time ago because I will create  a lot when it is released now I go to 30 corp.com container template hit enter  there goes a zip file I open it   and this page appears then  I click on this folder icon   click on this Arrow up icon I select the file I  go to my downloads here's the Json file I open it   and I enable and import this page it's built with  a container Builder now it appears over here and I   can insert it and I click on apply the settings of  this page too and there you go so what I know see   is this page and you'll see it also so what  you can do now you can click over here go to   Stell enter the background overlay change the  image and then I grab something else the switch and I can bring it down a  bit let me see uh position it's okay like that a little bit  down I can even make it bigger and over here I can say order  there the Nintendo let me see switch ER dream Cube for cash so another way you can change the information  and get 200 off from this amount for this amount   you can change the text so just  change the content change the colors   and you will be good to go in this uh inspired  by one of the best stores in the Netherlands   and as I said I will make in-depth tutorials  about the container Builder right now   it's not uh finished with the development so I  don't want to dive too deep into it and also don't   want to create something in the old or the current  version of Elementor which will be outdated in   one or two months so right now I do it like this  and that makes the tutorial not too long because   already I think around four hours so uh that's it  of course there are also other pages and then the   same story applies especially about us page if  you want to create one follow my tutorials about   make a website Elementor 30 yes I'm watching  Charlie puth videos and I really like it   so four years old already but I show you how to  create a lot of different kind of pages so go   to the newer ones and there you can learn here  look at this three hours now I talk about how   to create beautifully designed pages optimized  for all devices but um right now I have to wait   for the container Builder and then I'll create a  new tutorial and this was more how to create an   informers website not everybody wants to have an  about page not everybody wants to have a blog or   FAQ page if you want to have that watch my other  tutorials and I I dive deep into that subject   if you want to have a Blog I have a beautiful  tutorial about it how to write blog posts 30. three months ago and then this for affiliate  marketing but you can write for anything   draw people to your website and they  can buy things from your website so uh FAQ have tutorials about that newsletter  you can work with a MailChimp or convert get 30   and then over here I have a two and a  half hour tutorial on how to create an   email list and man the money is in the list  so feel free to play around with that and   then this is it we create a beautiful website  with a shop so if I go to forward slash shop   we've configured it using extra we can  filter things you can change the display we talked about creating different kinds of  products that a designing page like this so   it looks beautiful it's easy to buy things  add onto the cart we have the modern cards   we can go to the checkouts we talked about  shipping coupon codes taxes payment methods   and now we have the website up and running and the  only thing you have to do is make sure that when   people buy things on your website you send the  right products to the right people our website is   getting better and better I said it already a few  times but it's true it's getting better and then   it's getting even better there are more things  you can do with extra Pro right now I focus on all   the features in woocommerce with S5 Pro but there  are more things you can do with extra Pro to make   your website look better as a whole so let me talk  about a few of those so if we go to the customizer   we see all those options over here but what we  can do we can close this go to the backend since   we have extra Pro we can unlock so much more  options so we go to appearance extra options and over here available extra Pro modules  colors and background typography spacing   block Pro navigation menu sticky header so I can  activate them all right now they are deactivated   and right now I just activated them now when we go  to the website and we go to the customizer and I   go to the header builder for instance there are  more options right now it says header type and   now I can have a transparent header I can have  a sticky header so if I click on sticky header   there are three levels so what do I want  to stick if I say that the primary header   really simple and scroll down and it  sticks with us if I say the above header   both headers will stick with us I cannot say  only the above header should stick with us then download it like that I only want to  primary have it to stick with us so I turn   this off I can enable a shrink effect just when  I scroll down it shrinks a bit not too much   and I can also hide it when scrolling down so  what happens I scroll down nothing happens as   soon as I scroll up it appears I scroll down it  disappears I scroll up and it appears I can have   a different logo for the sticky header so when  you turn on all those premium options you go to   the global area to container and there are more  options because you use a pro version the colors   more options so you can play around with those and  I don't want the store to be too long it's already   too long I think it's around it's more than four  hours I will make an in-depth tutorial about extra   if you want to watch that about S5 Pro by the  way if you want to watch that click over here   or take a look at my YouTube channel yes   for now I'm happy with the result when I scroll  down nothing happens when I show up it appears   magnificent wow you reached this part of the  tutorial you've earned my respect I already   respect you but I'm happy for you that you  persevered and I hope by now you have your own   domain name with web hosting your own website with  products you're selling things you have a shipping   method shift taxes included you have payment  methods and beautiful emails that will go to your   clients when they buy things on your website I  hope you have coupon codes and I hope the website   around your webshop is beautiful congratulations  with that I make more tutorials on how to create   pages with Elementor on how to optimize your  websites for all devices on how to optimize   your options for the search results I talk about  creating an email list and building your email   list so I have a few tutorials for you that  you can watch and um they can appear over here   thank you for watching this tutorial feel free  to like this video that would help me out a   lot feel free to subscribe for more upcoming  videos only if you're interested and then feel   free to leave a comment if you want to leave your  comments saying thank you or asking any question   good luck with your website good luck with your  business good luck with your life and bye bye

Channel: Ferdy Korpershoek

Views: 148,184

Keywords: Make an eCommerce Website, Ecommerce Website Tutorial, how to make an ecommerce website, ecommerce website, wordpress ecommerce website tutorial with woocommerce, wordpress ecommerce website tutorial, how to create an ecommerce website, woocommerce, ecommerce, how to create an online store, how to make an ecommerce website using wordpress, woocommerce tutorial, build ecommerce website, create ecommerce website, wordpress ecommerce, ecommerce tutorial, how to start an online store

Id: 2a--cSeMjfE

Length: 239min 51sec (14391 seconds)

Published: Thu Nov 03 2022