So right now is probably one of the most important times to start an online store so you can start selling directly to your customers Hi, my name is Hogan and in this video I'm gonna be showing you step by step how to create an ecommerce website using WordPress Now what's special about this video is that we'll also be making it multilingual So you can reach new audiences and you'll also be able to get Auto notifications on your phone as well So you can fulfill your order. You can also manage your store from your phone now This video is also perfect for freelancers If you want to learn how to create an online store and sell it as a service like a lot of people who are following My videos have done already then this is the perfect video for you guys to get started So let's jump into the computer and I'll show you exactly how to do it So what's really special about this video is that I'll be showing you how to make it multilingual so your customers can come onto your website and they can click a switch and then it's gonna turn into a Multilingual website and you can also translate it into any language that you want. Right? So if the Translations aren't correct. So it's automatic translations now, if it's not correct, you can also edit with the visual builder So essentially what happens is that it will automatically translate your whole entire website But you can also come here and manually review each of the different sections on the website so this is a really really special video because now you can actually reach Even a wider audience and not only you can actually get higher conversions because sometimes customers might not be you know 100 percent good at English. They might be you know, they might know Chinese Spanish, you know Different languages around the world. So this is really really special and you can also charge more for your clients for this. Okay? So what I'm going to do is translate it back into English now, this is also dropshipping compatible So if you don't have any products to sell yet, then this website and tutorial you'll also be able to create a dropshipping website So I'll be talking about it briefly in the video, but I'll be making a separate video to cover that right? So this is an actual real website where someone can come here and order directly on your website Okay so I've got the demo, the link to the demo website down below so you can actually do a test order and Here we you can also do a track of your orders. So your customers can come in here and track the orders instantly so once you've shipped the order out you will set them up with a tracking ID and Let's say for example, we put in my email here okay, like this gmail.com and We can click on track. All right, and here you'll set up the tracking, right? so you'll be choosing your provider whichever one that you have sent it with then you'll enter in the tracking number and Then people can click on track and then they can track the orders from whichever provider that you set in Okay, so this one is just a test. So obviously you can't really see what it is but here your customers can log in they don't even have to log in there isn't even put in their order ID and Their email and they can track their order right so you can literally sell anything with this website as well So everything is going to be drag-and-drop and it's super super customizable So I do want to say that this video might not be for you though Because sometimes it's like so customizable and it's so amazing But then, you know sometimes some people might be looking for something. That's a lot more simpler And in that case you might go with Shopify, right? so With WordPress it's one of the most popular platforms in the world Now it's my personal preference and a lot of people do like it, it powers over 30% the Internet because it's so customizable Sometimes it can get a little bit overwhelming So if you're not really sure if this is for you or not for you Then just continue watching the intro and I'll show you everything that I'll cover in this tutorial All right, so you're literally creating like $1,000 $3,000 website. You can come here and you know edit the text However, you like so that basically means that you have total control over anything So if you can sell anything as well, you can go to styling you can go to background here You can change it to a gradient background. You can change it to a video background So if you have like a product video, you can create a product video and display it here as well And you can really customize anything that you want right so you can change the link To anything that you want, right? So scrolling down. I generally like to zoom out when I create my websites So here you can click the text and you can drag it around effortlessly Let's drag it over here Right, if you want to move your products around you can drag it around as well and move it around right? So as you can see everything is sort of like in modules and you can also click into the Module right and you can also change the layout if you want to as well So you've got so many different settings here as well. You can hide the price you can show the Add to Cart It's so customizable and so amazing and the theme if you are building a website with WordPress already This is an amazing theme as well So if you want to change like the products so you might want to sell a different product Yeah, you can change the image really easily something like that insert and click on the background here Let's change the color to something like this. Right? So it's so easy to update as well And you know if you're creating websites for your clients, they can come in here and edit it themselves So then basically you can move on and maybe get some more clients and then maybe you know help out your client a little bit On the side, but then that can really allow you to expand your business as well as a freelancer, right? now if we're scrolling down over here, I'll also show you how to Create an opt-in form. So with this builder, it's really easy to create an opt-in form Right because we have an opt-in module, right? So here's the opt-in module and you can drag it anywhere on your website So here you can select, you know different styles for the opt-in You can really configure it. And then for this tutorial, I'll show you how to link it with MailChimp So MailChimp is one of the biggest sort of email marketing platforms where you can collect emails and basically it's so important for a online business to have a two connector to email then you can collect the emails and whenever you have a sale you can do like an email blast and That's gonna really gonna make it a lot of money as well So here I'm just going to delete this module Right, but you can add it anywhere on your website and here we've got social links You've got important links down here and you can also customize the footer as well as the header section So you got over a dozen different header? Layouts as well and here we've got our payment icons they can also subscribe here as well to an email list and Let's click on save and I want to show you sort of a live Transaction with this website because it's really really cool. Then I also show you how to how the transaction works on mobile as well So scrolling down here So this is a product this is actually my product that I had it in I took a photo of it and I upload it as well my website here and Here you can click on Add to Cart and here is your card section So your customers can view cart they can also add it to the wishlist if they don't want to purchase it now Which happens a lot of times so here they can, you know at the quantity and things like that You can select and I'll show you how to set up the shipping so you could do like express shipping flat rate shipping free shipping with conditions and Here is a coupon code for myself. So I made one for myself like 99off ok, because I don't want to pay that much apply and That's gonna apply the coupon. So let's proceed to checkout So over here if you do want to come here and do a test transaction you can just put in the code over here I mean the number and Here I will just pop pre-populated the stuff over here Okay, put in the number like that Let's do an expiry date. Let's do 23 and maybe 133. Okay, so don't use paypal for the tests Okay, cuz I haven't set that up to to be a test mode But we can place the order Okay, so the order is complete And it says thank you Mary for your order. Your order is now processing. Okay, so they can go back to the home page or If you allow then they can also create an account page where they can come in here and track the orders And check their downloads and update like the information things like that But you'll also be getting a the customer also get a notification, right? Thank you for your order your orders now being processed right, and this is everything that they've got and they'll also get a invoice as well because invoices are really important because sometimes you might have like business customers or someone might ask you for an invoice and They can download the invoice as well and claim it for like tax or whatever they want to do with it Here you also get your own notification So this is your notification that you get and then you can ship the order out to them and it's just really really amazing so you've also got a dashboard area where you can track your sales and revenue and You can manage the orders on the back as well. So this is the backend of the website. So It also has a very advanced back-end for your website. We can manage your products adding products so over here we can go to add new products and Here is the actual product that we've actually bought Okay, so you can add different types of products as well so for example if you wanted to add like a Oops, did we accidentally duplicate that hopefully not here you can add a simple products a grouped product You could also add an external or affiliate product for example, like an Amazon affiliate link okay that you can put in here and then once people click it then you'll be redirected to Amazon, okay, so you can get like a commission for that For the variable product here. You can set in like different variations for example on our store We do have a t-shirt variation, which I'll show you how to add in as well So here you've also got a product filter which is really cool because you can press it and you'll just select the the products with that specific color and We can click into that Right. So once we click into that the customer can view the product and things like that They can also zoom in you can also add additional product images. I haven't added that in for this demo But here they can add it to cart. Oops. They can also select a different color and that will change color let's add that one to cut as well and Let's go check out on our mobile phone so. Here is my mobile Okay. Sorry you guys I think I forgot to record the screen. So I'm doing it again now This is the product on mobile Right and your customers can just add that to cart right? And hopefully that's added in click on the cart here Let's click on checkout So I'm just showing you because this is a real website That your customers can order from after you finish this tutorial So let's put in an email. So I'm gonna set in my email here like that's click on next scroll down Okay, so fill in all the details, then we're gonna put in the test dummy credit card number Okay, and we can just put in a random expiry one as well Okay, then we can click on place order. All right, so that's gonna take a few seconds for that to process Okay, so that's your order notification So you can manage your orders from your phone so you can click into that order and we can begin fulfillment, right? So here we can just click on begin fulfillment we can add in our tracking So you can set in your courier, right? If you don't have the specific courier here You can also do a manual one as well so once we set that in we can just put the number so like 1 2 3 4 5 6 7 8 9 and then what we need to do is click on add and Then we can mark order complete. So once that order is complete Your customer will get a email confirmation with the tracking ID and everything like that. So Here you can also issue a refund so sometimes that does happen so you can also issue a refund from your mobile phone as well and Here, what we could do is click on back and back over here. We can also track our sales so your clients or your customers You know, they don't have to Login to their website all the time They can track their sales and manage everything from their phone and that way it's just a lot easier for everyone involved If we click on the products iam You can also edit the stock levels and you know set in the descriptions and also set in the prices from the phone as well So it's just super super amazing You can also click over here settings And if you want like notifications of like new orders, then you can switch it on and stuff like that But that is pretty much it. So let's get back into the computer, right? So this is a really really advanced ecommerce website. You've got everything that that you need and It's just really really amazing because it's so customizable and you can also customize like your your secondary header as well just in case you want to You know do like free shipping for $50 or anything like that I just put in dropshipping compatible and you know you could do like Free shipping for let's do $50 or Well, something like that. Okay, so I'm not gonna do that. I'm just gonna close it and save it Okay, then I think that is pretty much. It's you can also add a blog You also have a mega menu Yeah, you've also got the search function. So your products can be found using the search and Yeah, I think that is pretty much it. So if you guys are ready then I'm ready I'm gonna show you exactly how to build a really really amazing ecommerce website online store And this is literally going to cost like three thousand dollars if you were to hire someone to build the entire website for you but today You know, I'll be showing you for free Obviously there are some costs involved and you know things that you might need and I'll discuss that next Okay, so hopefully you guys are really excited to get started But I do want to go through exactly what we need to create our online store So the first thing that you'll need is a domain name So your domain name is essentially just your website's address. For example your business name yourbrandname.com The second thing you'll need is a hosting account so hosting is essentially just like a virtual server that's on the internet that stores your website's files like the content the text the images and things like That so that people all around the world can access your website and they can buy things from your website Okay, so the third thing we need is going to be WordPress So WordPress is a content management system and basically in short that's sort of like an online software that allows you to Create a blog create a website create an e-commerce website without needing to learn how to code and Actually WordPress powers over 30% of the Internet and it's what I personally use for my website and what I recommend So the fourth thing that we're gonna be needing is WooCommerce now WooCommerce is a plug-in the most popular e-commerce plugin for WordPress that adds the sort of online Payment gateway the e-commerce functionality and things like that for our website Then the fifth thing that we need is a theme and a builder So this is going to be included in the description below which I'll show you how to install Everything later on so you don't need to pay for a theme to get started We do have you know Optional support and updates if you do want to buy that right so you don't have to pay that upfront at all And obviously the sixth thing is I'm gonna be showing you step-by-step how to create your online store for free So to get started to create your own online store ecommerce website It's gonna be less than $100 which I really think it's gonna be really really amazing because you're gonna be saving thousands and thousands of dollars if you were to like hire an Agency to do it for you, especially if you want them to you know Add in all your products for you and build out your website how you want it? It's gonna cost a lot of money so I do want to also mention that the Translation plug-in if you want to translate your website into different languages, for example Chinese Spanish German Any language that you want then there is a free trial for I think two weeks but for the full version I think it's like ninety nine dollars every year. All right, so I do want to make it clear exactly You know how much everything cost to get started so, you know exactly what you're getting yourself into So to get started we're gonna get our domain and hosting first so there's a discount link down below and you can click that link or you can just open up your browser Google and we're gonna go to Siteground to get our Hosting as well as our domain so you can go to siteground.com/go/hogan70 siteground.com/go/hogan70 so that's a discount affiliate link and basically what that means is that if you do purchase through that link, I may get a commission for that. And essentially that just helps me to create free tutorials for you guys but the main reason that I'm recommending Siteground is Because that we're creating an e-commerce website and you need a sort of a really good host basically for your e-commerce website Since you have a lot of images and a lot of different plugins that you'll need So you need your website to load really quickly, right and SiteGround provides, you know Excellent performance and excellent customer support, which is really really necessary when you're creating your own online store Okay, and you can also select sort of like the server location So let's say if you're based in Australia, they have a server in Sydney as well So that means your website's gonna load a lot quicker for your customers, right? So if you're in Asia, then they have like a data center in Singapore and things like that So I'm on the Australian website right now But select your region down here and the price might be a little bit different in your region I think in the United States it should be like 3.95 and 5.95 I think okay. So the main difference between the three different plans is The website that you can create under the plan, right? So with the startup hosting plan You can only create one website Right with a grow big and they go geek you can create unlimited websites And essentially what that means is that you can create a website for yourself your parents You know for your friend your family and maybe like a few clients as well all under one hosting account Basically what that means is that you can save a lot of money by splitting the cost up and things like that Okay, so you can create like any type of website like a blog just a normal business website ecommerce store it doesn't really matter which plan but that's the main difference and You also do get some additional features If you go for the grow big for example on demand back up so we can check out speed boosting and staging as well So you can read all these different features But personally what I recommend if you're in a budget Then you can just easily go for the startup plan And if you do want to upgrade later on you can upgrade within the dashboard. Okay? So for this tutorial, I'm just gonna select grow big because I do want to show you some of the features as well So we're gonna click on get plan Okay, so you can click over here to register a new domain If you already have a domain let's say if you have one that is on GoDaddy or Namecheap or some other domain registrar then you can enter in your Domain that you've purchased and continue on with the hosting Okay So here I might do like e-commerce demo and then you can select Your sort of country specific domain name extension, right? So this is another benefit that I forgot to mention so you can also choose like .com .au .co.uk' or anything like that as well But I'm just gonna go for .com and that's what I recommend if you don't Know which one to go for because normally that's more trustworthy in terms of when your customer, you know Views your website and things like that. So here we can click on proceed and Okay, sometimes that might not be available so you might need to choose another one I might just put in like 91 Okay, so we're gonna click on proceed Okay. So what you'll need to do is basically just fill in your email and set up a new password as well as putting in Your personal information for example your name address and things like that as well As your credit card information to pay for your hosting and domain name and I'm gonna quickly do that So we're gonna come back and show you the next step so over here. You can adjust your plan again And here for the data center. So what I recommend is selecting the data center, which is closest to your audience So for example if I'm based in Australia, I'm gonna select Sydney. If you're in the United States, then you go with us, etc Okay so here we're gonna scroll down again and for the period so Basically, what I personally recommend is going for 12 months or longer that way you're gonna lock in the discount So basically if we select 24 months then that is gonna bill you for this amount at this rate Okay. So after this period is over then it will renew at its regular rate Okay, which is shown over here Okay, so personally, what I recommend is going for 12 months or longer. That's just going to give you a bigger discount, right? So because I already have like three different accounts, I'm just gonna select a trial accounts because I don't need this account anymore here We're gonna scroll down and for your domain privacy. This is basically going to help protect like your personal information, which you filled in before Because by default people can actually search up Your website's address and get your information, right? So if you want to hide that this is gonna prevent people from my expanding you and things like that. So You can select that. Right so the site scanner you can get it as well. But obviously it's not necessary Here we can scroll down. So here you can view your total and Select I confirm. Okay, and if you want to receive some news and special offers, you can select this as well Okay, so I'm not gonna select that and I'm just gonna click on Pay Now Okay. So once you've purchased you can click on proceed to custom area and sometimes you may need to log in again so just log in with email and just click on next and then put in the password that you set in before and click on login So this over here is a site ground dashboard This is where you can control your website your domain name and your different services as well as your billing and things like that So if we click on websites over here, then you'll see your website added over here collaborations is Essentially if you want to give access to someone else right if you have the grow big plan or above you can set up people To sort of help manage your website and things like that like a web developer or designer They can log in right so services over here You can manage your services here. And sometimes if you do want to select a different data center you can Update that over here domains. You can purchase like a new domain if you need one as well All right, and a billing you can control your billing over here for example your renewals right so you can still get the discounts as well if you want to renew for a Longer term right and you'll just be charged like the difference. Okay, so that is pretty much it for your dashboard area. Okay So what I want to do is click on setup site so over here I'm gonna click on skip and create an empty site and then I'm not gonna select the SG site scanner click on finish Right, so that's gonna take a few minutes to create your website Okay. So right now we're all set and ready to go so if you did purchase your domain name form somewhere else and you want to connect it with your site ground hosting then I'll leave the Link in the description below that shows you how to connect like GoDaddy and also Namecheap to your siteground accounts This is your name service, right? So this is important. So what I also want to do is go back to my email and Also you want to verify Your domain name? Okay. So click on the link over here and just verify that To say that you own it and things like that scroll down and just verify that information Okay, that's all good I'm gonna come back to my inbox as well as setting in the data preferences as well Okay, and I'm not gonna consent. I'm just going to save it Okay, so that's done. I'm just gonna close that and close that and I think everything is good to go. Right so we're gonna go over here and We can click on manage site or we can click on websites over here And then we can click on site tools And I want to show you how to install WordPress okay, so we can click on WordPress over here install and manage and Then we're gonna select WordPress Okay, so here leave the installation path empty. This one should be automatically selected I want to deselect the WordPress starter. Okay, we don't need that and I want to set up my username Okay, and then set in your password for your website, okay, and then put in your email address? Like that and then scroll down and then when click on install okay, so we can click on close for that one over there so we can click over here to login to our panel area so we can click into that and that should pop out and We're going to log in to our website Okay. So this is logged into your WordPress website and this is the backend of your website So before we do anything I do want to show you quickly how to set up an email on your domain name so you can click on email over here and Click on accounts. Alright, so I'm going to set up an email for your domain name. So for example, it might be like Hello or support or help or whatever it is and you can set up multiple ones. It doesn't really matter I'm gonna put in my password Okay, so we need this later on when we set up our WooCommerce settings area Okay, so just click on create and that your email is created Okay So you can click over here and you can log-in to your webmail And this is where you can manage your emails and things like that So I do also have another video which I show you how to connect it to Gmail so you can actually send Email via your Gmail accounts as well as receive emails directly in your Gmail account So I'll leave the link for that in the description below Okay, so whenever you do want to log back into your WordPress dashboard area, so let's say we log out of the WordPress area Okay to log back in we need to type and just log in like that and then click on enter Okay, so that's going to take you to the wordpress sort of login panel area and then here we're just entering the username that we set it before or your email address and Then virtually that's gonna log you back in to your wordpress dashboard So here we click on visit website. Now. This is what your website will look like to your visitors Okay, so it doesn't look anything like what you want it to be at the moment So we're gonna click back into the dashboard area and I'm gonna show you how to fully you know Set up all the basic settings first to get you guys all on the same page so generally the first thing that I want to do is I like to just clean up the dashboard a little bit because There's a lot of things popping up here and we can just click on dismiss and close these things We don't really need it. You can actually go to screen options as well to just hide it all together if you do want to That's what I'm going to do So I'm gonna hide this and hide activity hide this one over here hide it and maybe just keep this one up there Okay, so now everything is tidy and it's just a lot easier to you know, get building your website So what I want to do first is make sure that your website is secure So as you see when you hover over here, it says not secure What we want to do is we want to have a secure lock icon. Okay? So this is necessary for all websites these days especially e-commerce websites You need the secure icon to accept credit card. So what we need to do is click on plugins ok, so here we can click on add new and We're gonna install a plug-in called really Simple SSL again then click on enter Now you can actually enforce the SSL on your siteground account, but I think a lot of people are following My tutorial who are using different hosts alright, so we're gonna click on install now for this one over here really simple SSL and Then we're going to do is activated. Once that is installed All right, so almost ready okay then we click on go ahead and activate SSL and What that is going to do. It's going to enforce the SSL on your website, right? So we're gonna log back in to our dashboard again Just like that and let's just close that and close that and close that over there So now you have a secure icon as well as having a secure icon on your homepage as well Okay, so if we go back to our dashboard area We want to do a few things The first thing you want to do is hover over settings and click on permalinks, right? So you want to make sure that your permalinks structure is the correct one, so it should always be post name so what that basically means is that Let's say if you create a new page that page is called about us or maybe a shop page Then that means the title will be included in the URL Right, so you don't want it to be like, you know question mark P equals and numbers. Okay, so that's not good for Search engine purposes, right? So if you want to rank on Google, then you want to make sure you set post name Okay, so we can also go to plugins right? So you generally sometimes if you have other hosts, you might get some Plugins which are already installed so you might want to deactivate all the ones There okay, and then you might want to delete it as well Okay, because that's just gonna add extra sort of functionality for your website But a lot of those aren't needed at the moment and sometimes it's just sort of can conflict with When you're building out your website, right? So with the s3 optimizer we can keep keep that activated doesn't really matter if you do run into any issues With like the Builder later on you might want to try and deactivate it and then reactivate it once you are Finished building your website, right? So another common question that I always get is that you know, this this website is live right now right So if you share this website with your friends your family your customers They'll be able to see your website and it looks like this right So the most common thing I always get is how do I hide my website when I'm actually just building out our website, right? so you can click on plugins over here add new and We can search for coming soon So, I believe it's the minimal coming soon plug-in over here minimal coming soon install Ok this one by web Factory and Once that is done. We can activate it alright, and this is going to Hide your website in maintenance mode, right? So here we can turn it on and If we visit our website like if we are logged in now, we can see it right but if we are our customer let's just log out of our site again and We go to over here Then it just says coming soon. All right, so this is awesome. Really really simple to do so, I'm just gonna log back in Ok, so that doesn't work we might need to do WP admin ok So what you want to do is make sure you bookmark that page as well to your bookmarks So we're gonna log back in over here And go like that and close it ok, so here we can go to our pages, right? We're gonna delete all our pages move it to trash and apply click on trash again and I'm just going to select all and delete them all permanently Click on post as well. And I'm gonna delete the sample hello world post click on trash and delete permanently Okay. So SiteGround is really really awesome because like as you can see like all the things that I'm doing it's reacting really fast Mainly because of the performance right? So if you are using some other host, you might want to consider Siteground But that's up to you so what we're gonna do first is we're going to add some pages to our website so we can click on pages and click on add new and We can close this So as you can see can't see your WordPress dashboard at the moment I personally don't like that so we can click on the sort of three dots up here. Ok, click on that and We can deselect the full screen mode Ok, so that way you can actually see You know your dashboard area again, so that's up to you anyways For the title, we're gonna set in home okay, so for our home page and click on publish and publish that okay, so that's live now and If we click on View page, then this is going to be our home page. Alright, so I'll show you how to set that in Later on, so we're gonna close the other websites. We don't need that anymore So to create a new page we can go back to our dashboard area or you can also hover over here Add new and click on page ok, so the next page we're gonna add is like about page click on publish just like that and Let's add in a few more pages. So for example contacts Publish publisher. So I'm gonna go a little bit quicker right now We're gonna add maybe like a shipping and returns page so you should always have like a shipping or like a FAQ page because a lot of people will ask you the same questions, you know over and over again so you may as well have a FAQ which answers their concerns rights gonna save you a ton of time and publish that in We're going to click on page. Now if you do want to have a wish list We're gonna set and wish list page later on So I'm going to set that in so you can create as many pages as you want I'm just creating all the necessary ones that you need ok pages again This one's gonna be a privacy policy. Oops Like that and click on publish Publish again, and then we're going to add in the terms Terms of Service terms and conditions up to you. This is basically just the terms For your customers when they're buying from you Okay, click on publish and done okay, so to view all your pages you can click on all pages and Here all your pages alright So what I want to do is I want to install a theme So the theme is going to change the appearance of our website over here, right? So by default it is the default WordPress theme we want to download the theme in the description below Okay. So once you download that theme it should look something like this right themify - shoppe zip sometimes it might be Automatically unzipped into a folder Right if you're using like Safari or something like that What you want to do is right click and just compress it back into the zip file Okay, so we want to make sure you upload the dot zip. So we go over here go to appearance and click on themes and then we can click on add new and then we're gonna click on upload theme choose file and Then find the theme and then click on this one over here, okay click on open and install now so basically I partnered up with themify and They have allowed me to share this theme with you guys So it's actually a premium theme but it's actually really really awesome and it's personally what I use and it includes the drag-and-drop builder So we want to make sure you activate as well. Okay, and Here you can actually import some like demos and things like that, but I don't think that's good so we're gonna click on the close up here and We can go back to visit our website over here and you can see our website has changed completely Right, so it looks a lot more like what I showed you in the demo, but it's still not there yet. Okay So here we want to make sure that we set in the menu and things like that All right. So what I want to do is I want to click on customize here and Then we're gonna click on back and Then click on the home page settings Click on a static page and click on the home page and you want to set this to home So essentially what I'm gonna show you is let's say we go over here The page is not displaying up here. But let's just say we go to that sort of a home page So our home page is it has the extension home, right? We want that to be just the domain name.com Right. So this is exactly what we're doing here to set in the home page to be our home page So I don't know if that's confusing or not, but hopefully you guys get it. I just click on publish and Let's say we closed it if we go to You know our home page, right? It's going to redirect to just our domain com. Okay, so that's what you want now I'm going to show you how to set in the navigation menu because as you can see we can't see the pages that we've created So what we need to do is we can click on customize and click on back over here and then click on menus and We want to create a new menu So we want to click on the create new menu and the new menu is going to be top notes Right, so this can be any name that you want it to be This is just for your own reference Alright, so as you can see, you've see like three lines. This is called like the hamburger menu or the mobile menu Sometimes if your browser is like you're on a laptop sometimes it's like very small you might want to zoom out of your screen of your Browser to like 90% and that's gonna display your desktop Sort of a header section. Okay. So here you want to select main navigation and We're going to click on next So we want to add the pages right? So click on add items Okay, so the pages that we want to add to our menu is maybe we want to do abouts We can do like contacts for the homepage, you don't really need to do that because most of the time when people click on your Title or your logo? It will automatically redirect So generally I don't use the homepage You won't see the shop page yet, because we need to add in the WooCommerce plug-in in a second. Right which I will show you So that's all pretty much And then what we could do is let's click on the menu options Automatically add the new top-level pages to this menu All right. So any page that we create later, you'll automatically set it into the top navigation So click on publish and that's done for your top menu there So for your footer menu, I'm gonna show you how to create that right now, so We can click on back over here and then create a new menu, right? So this is going to be Footer so the top is called your header here is called your footer ok, and here we're gonna select food and navigation select next and We can add in the items. So I'm gonna add in maybe like terms privacy and let's go with maybe Shipping your returns and contact and then if you do want to rearrange it Then we can just click it and sort of just drag it and rearrange everything like that Okay, if that's what you want to do click on publish and Close it Ok, so we've got a header navigation set in as well as our footer navigation What I want to show you now is to set in the layouts of your pages So as you can see You've got a title here and got a sidebar here if we turn the builder now and start building our website You know It's gonna have our title there and things like that which isn't good so we can click on save and let's just close it so we're gonna go back to our dashboard area and Go to themify shoppe > themify settings Ok, and generally what I like to do is just open my site in a new tab Ok, I'm gonna close that Let's go to the default layouts and click on default page layout Ok for the sidebar option. We do want to remove it. Ok, and remove the title as well So let's remove the sidebar remove title, and I also want to disable page comments click on save and then We can refresh the page. So that's looking really really nice already. I might want to remove the logo as well as The powered by WordPress over here. Okay, so I'm gonna show you how to do that better easily Let's go back over here. Click on 'theme settings and Then we can click on the theme appearance so over here you can actually edit the header design to anything that you want Alright, so personally What I do recommend is probably just the header logo Center or the the header logo on the left These ones you can use as well but you know for your customers these would probably the best ones to Navigate and that's why you know, a lot of the top websites just have a really simple easy to navigate header But if you're designing something, that's more niche, you might want to go for some different options as well, which is cool Okay, so here we're gonna scroll down to the footer. Okay? So this edits the footer design. Okay the footer design over here So what I want to do is exclude the site logo and I do want to also scroll down to for the text and I want to hide the footer text too, which is essentially this thing over here Okay, so let's click on hide and click on save and If we refresh the page Then it'll be gone right so nice and clean footer Which is really really cool you can obviously edits, you know, like the appearance of your footer over here you can exclude certain things and Let's say if you want to use like a floating back to top button. We can select that right and save it Let's go over here and refresh Now the back to top button will actually appear on the right hand side Okay, right now we've got nothing to scroll on our pages So it's not appearing right but it will appear if you do want to set that in as well I'm gonna deselect that one and you can also play around with the different settings here as well. But that's pretty much it. Okay? Alright, so congratulation guys. We are almost halfway there to completing our website so now is the exciting part and This is the part where I'm gonna show you how to build out your your layout of your homepage So what you can do is we can turn on the Builder and obviously we can you know Create the layout individually and do it manually, but I've actually created sort of the page template for you guys so you can download it and then You can edit it and then you can move the things around and learn how to build it that way So you can open up another tab on your Chrome or Safari. Just hoping like eventual forward slash Templates I get with the s and then click on enter So I've created all the templates for all your pages. So obviously you can create you know You know your layout by itself, but it's gonna take a little while So I think this Way's gonna be a lot faster and get you guys up and running a lot quicker so all you need to do is you need to just click it and download it and that's going to download to your Folder ok, so download it onto your desktop So download all of these ones whoops. So download all of them Ok, ok, and here we go Ok, so now let's go back over here So to import the layout what we could do is we can click over here import import from file click on OK and Select the home page. So this one's going to be home and it should be the zip file Ok, make sure you upload the zip file if it's not you need to right-click it and compress it back into the zip file click on open and That's going to take a few seconds to load up because we got the images and the text and things like that alright Ok, so that's looking really really awesome already so generally you'll notice that the products aren't showing yet because we haven't added in our products and Here it might be empty as well because we need to add in the mailchimp API, which is the sort of the email newsletter Service so we can click on the zoom so this is a really great way to sort of look at your website from a bird's eye view to ensure that the layout is all nice and even Like and in short like all the spacing and everything looks real really good This is just a great way to also move things around as well So when you hover over here the purple that's gonna be the row right and inside each row You can also hover over I'm gonna zoom back in again You can also hover over the gear icon and you can select the number of columns inside that row Alright, so let's just say for example This photo over here. This one is just one column. Okay, if you hover over here, then you can select like two columns so let's say if you want like a text on the left and Maybe you want to drop like an image on the right hand side Then you could do that. Okay, so Essentially you can also do a undo as well. Oops Undo like that, and you can also adjust the spacing between here and here by hovering over here and just sort of dragging it and just pulling it like that and you also want to make sure that the spacing is always even right because I see a lot of websites and Sometimes there's just not enough space in between each of the different elements like it might be like too tight and then here is gonna be like a little bit different as well and Then your website just looks you know, uneven right So let's if we zoom out and it just doesn't look good and it happens all the time So you want to make sure that when you are Let's click back this again when you're designing and try to keep things nice and even alright So this one is 100 pixels on the top. It should be pretty much the same on the bottom. Okay? Same thing for here. You can also adjust the Column widths as well by dragging like that So that's really really awesome. So it's really easy to use. I'm gonna undo that and if you want to change the background image over here then all you need to do is to hover over the row and You can click on the row styling Okay so click back here and then click on the background and Then here obviously you can change it to like an image just like a single image. You can change it to like a gradient So gradient is really cool actually, um like that you can set the color and you can also go to a website called UIgradients.com and here you can click on the next and select a really nice and fun Gradients for your brand maybe something like this one over here. Okay, for example, we can click over here and If you want to add the gradient just put the color code into here paste it in like that Alright, click on the next one as well and then we can go back over here. Click on that and paste it into here oops Sometimes that's a little bit hard. Okay. There you go. All right, so that's looking so awesome and so nice Before I go anywhere, I do also want to mention the wrote overlay So this is one of the most most important things that you can use for your website Especially for background images where you have text over in the middle So sometimes if you're using a white text it might not be visible. Right so you can add easily add a black overlay All right, and then drop the opacity down to like 10% or maybe even 15 or 20% You can adjust it here All right. So 20. Okay and it that way it's gonna boost the the text. All right, so you can actually see the text and It's gonna make the visibility a lot better. Okay. So what I've done is actually added in for the column Background over here so you can remove that if you want to that looks okay as well I'm gonna keep that there and I'm gonna click back on the background and Then I'm gonna click on the road overlay and I'm going to delete it but I think that's a really important feature that you're going To be using a lot of the time you can also add a gradient sort of White overlay as well. So like this and then you can drop maybe let's say we drop the opacity down like that and That looks really good. Right so maybe drop it even further Something like that, right so it's not perfect, but I hopefully you get the idea this is a really important feature that I just wanted to touch on as well as clicking on the text and over here the font and also you can add a text shadow like one one with the blur tube and then set it to like black drop the opacity down to 10% and that boosts your text a little bit, okay So let's continue back with the tutorial nice and modern and what you can do You can also click on add as well. So that basically the gradient will save As your color pallet, right? So let's just say for example, you want to reuse the gradient for this section over here Click on the row styling Background instead of image select gradient select the color like that So that keeps your whole entire website really consistent by using the same color scheme, right? So this is really important make sure you save your Gradients and things like that. Okay, so I'm going to change it back to the image and Over here, we're gonna click back onto this row. All right then click on the background again and Here you can also add in a video. So a video background is really nice as well Only if you have like a really nice video. Okay. So if you don't have a nice video then probably don't use it It's probably easy to get like a nice image for your products. So here you can just grab your YouTube URL Make sure you upload your videos to YouTube That way it's going to load The video on their servers right and it's just gonna be a lot faster and not take up resources on your website So essentially if you do upload a video you also want to upload a backup image For your background because video doesn't really play well on on mobile devices over here It does show from mobile here. But yeah when you actually view it on your own mobile, then it might not be good. Right so I'm going to change it back to maybe the image right and I'll show you the rest of the builder Okay, so it's really really awesome. You also want to make sure that the image that you do upload is really really awesome, right? So there are some really nice free image websites for example, unsplash Which is good pixels is also really good But if you want to find a little bit more Relevant images like if you don't have a photographer, you don't have nice images yourself You can find them on like Adobe stock as well So this is a paid service But I think it's really really good because you could probably find a little bit more relevant images to your brand and things like that so if you can't find images here again, then you can go to a website called Fiverr and you can get like let's say a lifestyle you know photography and search that up on Fiverr. Alright, so they have a lot of different freelancers which can do amazing sort of lifestyle photography with your products and then you can use that as your Hero image right or for example this example of you here $23, not too bad. Let's click into that Right so we can look at some examples that they do provide. So let's just say, okay. You've got a Drink bottle right here selling a drink bottle then send the drink bottle to them. Let them take the image tell them that it's like for a hero image and then you can just put it here and It's gonna look amazing right now. It's gonna be looking a lot more amazing If you know, it's your own sort of product that you're using rather than you know finding it you know a free image from these websites and things like that, right so you can also get product renderings done so This is something that I have gotten asked or product renderings. So Product renderings aren't like real images. They're just like 3d images that are generated on the computer and that way you can use it as your product image you can also use it as You can put it onto a background right and if you don't know how to do that, you know this Photoshop tutorials But again, you know, you've got everything here. You can just type in like Photoshop editing or graphic designer they can design a really nice hero image for Your website, right? Because on a website it's you know, if we look at if we save it Right we save this over here You can see all these different types of modules now 80% of the time you're not going to be using Like 80% of the modules right to be honest if we look at our website You don't really need too many things. It's just image text and buttons really and some spacing, right? You don't need a lot of these different modules It's just gonna make your website confusing because if we go to Apple right you can look at their website Okay, you can scroll down look at the website. It's just text They don't even have like a button. They just have a link and really really nice images Alright. So another thing is you can go to Daniel Wellington and you can see the same thing. Really really nice hero image nice text over here a nice modern button, but I don't have too many animations too many things flying around and It's just all about like the imagery and things like that So another really great tool that you can download for your computer is the full page screen capture. It's a chrome tool so search that up on Google like full screen capture and you can download a data chrome and Essentially what that does is it screen captures the whole entire website right of you know whichever website that you want and you can look at it from like a really nice bird's eye view and You can look at the layout and then you can see you know How they've designed it like for their website, right? It can print it off and then you can try and replicate it on your own website over here All right. So that's one way to make sure that your design is really good Okay to look at you know inspiration because sometimes when you are building it out yourself, it's gonna be you know Quite hard, so enough of that hum because I think that's really really important. Let's click on the text, right? So if you want to change the text, it's so so easy. You just change it like so you the sale Okay, I'm gonna zoom in a little bit and you can also adjust the columns like that make it a little bit larger all right now for the buttons so we can click into the button like that and here we can change the text of The button that's showing over here here you can link it. So the forward slash shop is gonna link to our shop page I know we haven't create a shop page yet But let's just say if you want to link it to any link Then we can let's say you want to link it to maybe contact page right right. Click it and copy a link Paste it in and that's gonna link the button to that page. You can also open it in the same window you can also go to the styling the button link background and change the background color So I've set it in to be a gradient So you can change it to like that if you want to I might undo that if I can. All right, and Here, let's go back over here to bottom link background. This is the hover color So whenever you hover over it, this will be the color that it turns into So let's just change it to like for example green then it's gonna hover as green Right, so that's really really cool Then I'm going to undo that and carefully that's good now here for the bottom the same thing okay, so if you want to remove the button we can just click on delete like that and you can actually drag in your rows into a A section as well. So for example, this one is a column within a Column, okay So hopefully that didn't confuse you but we can hover over here and instead of having two columns in here We can select one right then We can click into that and we want to make sure we align it into the center. We can click on styling Fonts and let's align it into the center. So That's looking really really awesome now right now as you can see you've see these waves Alright, so if you want to remove that we can go to the row again. So row styling and that's called the frame So you can change the frame to anything that you want. For example, maybe this one. Yeah, oops, that's the top Sorry, my bad click on none and then click on the bottom. So this is the bottom of the frame and If you want to change it like that, that looks pretty good This one's not too bad. But like make sure to not use something like this unless you are building like some kind of Specific niche website or maybe like this maybe if you're building like a gardening thing. Okay, but generally not really. Oh, Yeah, okay. I get it. Let's just delete it Here I'm just gonna remove it click on none and that's all good. Okay, so then we're gonna click on done So here you can adjust the padding. This is the padding and you can also adjust it manually as well Styling padding change it over here as well. So for the bottom and left and right as well Then we're gonna scroll down and what else I want to show you maybe the image so you can replace the image Just by uploading an image here. And I also do you want to point out the hero image that we upload? The sizing right? So let's click on here and Generally the size that I recommend is somewhere like this size. So 1920 or anywhere around there and 1280 okay so pixels and it should be below 500 kilobytes. If it's too big then your website's gonna load really slowly Alright, so as you can see, this one's probably a little bit too big. Okay, I'm not sure why I uploaded that one But okay. This one's pretty good. Alright, so good size and good quality. Make sure it's not too blurry Otherwise, you know, that's not going to be good as well. So you can also change the hover image as well So for example, let's change it to maybe this one over here and if we preview that right, let's just actually save it and we close it and We hover over then it changes images. So that's a really really nice effect as well And since we're here, what you'll notice is when you save the Builder, you'll notice the spacing over here. So With the spacing hard to remove it. You can click on edit page and Then we can scroll down to the custom panel area over here change the content width to full width and click on update Okay. So for every page you have to do that to remove the spacing, okay, so let's click back onto the home page I'm gonna remove that and then that's remove the spacing. Okay, so we can turn on the Builder again I'll show you some additional features. I'm gonna go over here and just remove that because a little bit annoying Okay like that click on done Then we can scroll down here change the image change the background just click into it background color and you can adjust it like that Right. So whichever color palette that you're using if I let's say you you're using this one over here Make sure to add it in over here. So then you can reuse it on your website and things like that to ensure everything's consistent Right. So another thing to make sure that your website is consistent is that you can duplicate different modules like that So that way you don't have to keep on setting in the size for each one alright, so let's just say for example, we could drag it and just You know drag it over here and we can remove this one if you want to Right, so that way it's all consistent rather than using another text module from here You can also do the same thing with the buttons as well. So do you placate the buttons as well as duplicating? Let's say the entire row like that Okay, and you can also do this you can also zoom in Hover over here and you can right to left and that's gonna adjust it like that So that's really really awesome like this builder is amazing in my opinion so the other things that I want to show you is I'll talk about the colors and the fonts later on because It's important. So you just get the basic layout right and show you some of the basic functions and things like that We want to do is maybe let's move up the featured products so if you want to move up the entire row just hover over here and Once you see the arrows just scroll up and let's just drag it onto here, right? Make sure the spacing is even 50. Okay, that's okay for now and we can adjust that a little bit later on Now the next thing I want to show you is make sure it's responsive right on all devices So the layout that I've provided you guys I have actually set it to ensure that it's responsive already so sometimes you do need to edit it and Whichever setting that your edits in the mobile responsive setting it's going to it's going to save as that for that specific device So let's just say for example we make the click into this text and We click styling font And let's just change the font size to a little bit smaller for mobiles, maybe 16 or something like that and then we click back onto that one, right? The size is going to resize back to 20 So whichever setting that you change it's going to be saved for that device only right so sometimes you might want to Remove certain parts of your website. So let's just say for example Maybe you don't want to show Let's say this section over here, right? So this entire row we can click on the styling and here you can set the visibility so we can hide it for mobile if we want to and You can also hide it for devices other devices if you want to as well So this is a really cool feature that you can use Then we can go back over here. Okay, that's the preview button. Let's just click back and change it back to the desktop Okay, so that's pretty much it for now and I'll walk you through the other things later So let's just import like another page and I'll show you some other amazing features as well so let's just say if you want to import your let's say FAQ page or something like that. So shipping returns Okay, so here turn on your builder Import import from file. Okay and Choose the FAQ one. Okay open and that's going to import Okay, and then you can click into the modules and I've set everything up for you guys so you can just change the title and You know that your answers and things like that and edit everything like that We can click on save And then we can close it and then we're going to ensure that the the spacing is removed So click on edit page now If you do have any sort of issues with importing the template then you can also email me at support@hoganchua.com all right, and then we can scroll down here to full width and click on update and Then we can click here and click into that page again and that should be removed right So I'll go through changing the fonts and things like that later on, but that's just the basics of it And this is really cool because people can open it up like that. And yeah So now the next step is to show you how to add in all your products. So let's go back to our dashboard area Okay, so there's two more plugins that I want you guys to download from description below that we need so hover over plugins click on add new and The plug-in is going to be called so over here it's gonna be called builder WooCommerce and build a contact This is going to help us display your contact form on your contact page as well as builder WooCommerce It's gonna allow us to add inner products anywhere that we want So we're gonna go back over here click on upload choose file and Build the contacts. We're gonna upload that one first and has to be dot zip so install now and then after when you when you've done that then we need to activate it as Well as adding in the other one So add new again and Then upload plug-in choose file. This one's gonna be built with Commerce zip Install now and Once that is done, then the other plugin that we need is the WooCommerce plugin. So the WooCommerce plug-in is in here already So click on add new and instead of downloading it just search for it So search for WooCommerce and this is going to help us add the e-commerce functionality To our website. So this one over here with five million installs by automatic and let's click on install now Let's click on activate and that's gonna go through like a setup wizard which I'll show you how to set up as well. So Here we can. Just click on yes, please and Here we're gonna put in our dress So generally if you are operating a online business, what I recommend is getting a pure box in your local country You don't really have to put in a real one right now, though There's mainly for your customers. So, you know when you are starting out then just put in any dress Maybe your home address if you want to or just random one and then you can update it later as well So I'm just gonna set in API box here and set in the country. So I'm gonna find it actually Australia Victoria, let's just say Melbourne and postcode let's just do three thousand and then we're gonna click on continue and I'm going to continue for that So this doesn't really matter which one you choose. I'm just gonna choose this one continue and I'm gonna be selling physical Downloadable as well. So these ones are Additional sort of services they offer and this is basically how they make money. There are probably some other cheaper plugins that you can get So you probably don't want these now you can't I get them later if you do want them So I'm gonna click on continue how many products that we plan to display. Let's just say 11 to 100 currently selling elsewhere We're just gonna say no. Alright, so they're also going to add in some plugins as well For example to Facebook MailChimp, which is the sort of email opt-in service Google Ads and we're just gonna click on continue for that alright, so click on continue Alright. So once that is done then here we've already got our theme installed. So we're going to continue with my active theme And Here they're going to install the jetpack and for the jetpack It will allow you to connect it to your phone app as well and also calculate the taxes, which is really really important So we're click on yes, please All right. So once that is done, then we probably have to activate that by setting up our email so we're just going to click on setup jetpack and I think you can continue with WordPress comm or I'm just gonna try and log in with my Google account Hopefully it's gonna work. So let's click into that Sometimes they do change the layouts of the setup process a little bit, but generally it should be pretty easy Let's just wait for that Okay, so that should be good to go. I'm just gonna click on OK for this one this one. I don't think we need to Do anything about that? Let's just close that and for this one over here, we're just gonna close this for now as well and Here what we're going to do is add in our products So what we can do is hover over WooCommerce here and if we click on the dashboard So I'm gonna show you how to set up everything. So we're gonna skip the store set up alright, now what we're gonna do is add in our products so we can click on products over here and Then we can create our first product Ok, so here is your product name I'm gonna click on dismiss for that. I'll show you everything that you need to know So let's just say for example, you want to add in a yoga mat so your game mats and I'm gonna get some dummy text or maybe like lorem ipsum So generally for your description you want to be as descriptive as possible like outlining all your benefits features of your products Which is really really important and you can go to amazon.com To view like similar products to your product and get some inspiration there about what to write So I'm just gonna paste it in for our description area as well as scrolling down to the short description as well Alright then Over here. We want to scroll down to the product data here. We're creating a simple product so just one product, I'll show you how to create a variable product later as well and Our product is gonna be physical. So we're not gonna select this and let's just say we set in a price of $59 you can also set in a sale. So basically you can also schedule it as well So let's say if you have a Christmas sale or end of financial year sale, then you can schedule that for a specific time For the infantry now generally for the SKU is the sort of unique identifier for each of your products Now this is an if you have like hundreds of products if you have just a few products And I probably wouldn't bother having SKU yet then for the managed stock. You can also manage the stock by setting in Sort of the the quantity that you have, right? So let's just say for example we have you know twenty of our yoga mats we can set that in and then allow back orders is Basically, if you run out of the products, are you gonna allow people to buy it? I'm just gonna select do not and for the low stock threshold what you do want to do is you want to know how much is selling every day so that way You can notify you when you have low stock so that you can reorder the stock Alright, so generally it really depends on you know How many you're selling? if you're selling like ten a day then you and It takes like 30 days for you to order that product and get it into your warehouse or anything like that Then you might want to set the Lowe's low stock threshold at like let's say 300 or something like that, right? That's just saying if you're selling at 10 a day right for 30 days, so that's 300 I'm just gonna set it as you know to for now Then basically this one over here is sold individually. So essentially let's say if you have a virtual product for example you have a coaching call and Obviously, you know, you're not going to allow people to buy like, you know, five or ten coaching calls It might just be one for one order. Okay, so here for shipping you can set in the weight of your products So let's just say that the yoga mat is maybe two kilos including the packaging you might enter in the dimensions here I'm not going to worry about that for the shipping class This is I'll show you how to do this later because let's say if you're selling a majority you might be selling yoga mats But then for some reason you might be selling our sofas or something heavy So you can set in a heavy shipping class and that way you can set in a different price for that. Alright? So for the linked products, we don't really have any products yet. So we can't set in but generally for the cross-sells whatever product that you set in here, it's going to appear on your cart page, right so what I'm gonna do is I'm gonna open up the store in a new tab and On your cart page over here, right? You will show the the product here So let's just say for example, you are selling a yoga mat alright so a cross sell a good cross sell might be like Maybe like a bag for your yoga mat or some kind of accessory for it Okay upsells is gonna appear below the product and I'll show you that later on. Don't worry about now attributes is When we set in a variable products when we have different variations, we need a certain attribute. So let's not worry about that Advanced so you can add a purchase note if you want to as well for the menu order. I'll talk about that later and Then that's pretty much it for this section over here, right not so hard Then on the right hand side here you need to set in the product categories. So you want to make sure that You want to set in like good product categories? So let's just say maybe Fitness Fitness equipment and then click on add new and then That's added in as a category, right? So this is gonna be for your product filters So make sure you set that in correctly before your product tags. This might be like Yoga mat and Boop's yoga mat and then it might be the brand of mats. Maybe the color of the mats are like green Yoga mat and click on add that's just gonna help the sort of search function on your website if people are searching for it Scroll down and for the product image so click on set product image We're going to upload the file. Alright, so this is the place holder if you don't have an image at the moment We're gonna click on upload file select files Product images and I'm gonna add in my yoga mat. Alright So the size that I've set it in is going to be 800 by 800 pixels and the size should be probably around Maybe 100 kilobytes or maybe a little bit more. This one's less. Okay, so we can click on the set product image and you can also add in additional product gallery images if you have Different angles of your product or maybe your product in use as well and you want to try and keep it the same size you want to make sure that the product image sizes are all consistent that way it's not like cropped and Yeah, okay, click on publish and I'll show you what it basically looks like at the moment Alright, once that is published. We can click on View product and That is our yoga mat over here, right so it doesn't look too bad looks pretty good I'll show you how to change the colors and sort of the button colors and things like that later on But this is our product here people can click it and zoom in and view the products Your additional products will be listed under below here alright, then if we go to our home page right click on your logo here and Your products won't show yet so we can turn on our builder So with the plug-in that we added in before the Builder WooCommerce it's going to add in a Module, so this means that we can add in our product anywhere on our page. So this is really really amazing so we just drop it into here and Here we can select like the specific categories product on sales and things like that if you want to filter by that Now what we can do is we can set the layouts who maybe like three or four All right So it's not going to change it until we save sometimes it does that Let's just click on done and let's save it first and close it Scroll down and that is your yoga mat over here so we can change the display settings to the one on my demo so click onto it and then here we can change the Content layout to I believe is overlay Something like that, which looks really really nice so another really really really important tip that I do want to give you because I think that this is like crucial in terms of like success or off your online store is Your product images so you can upload a product image but you want to make sure that it's like cropped properly and also it is Consistent right. So what I mean by that is If we go to Dan in Wellington now if we look at the product images They have a light gray background on the product image, right and it's very very consistent throughout the entire website okay, so that light background we have the same feature on our image over here and I'm going to show you how I personally Do it. So basically let's say for example We have my product image that I took. I just wanted to show you an example because it makes a big difference. So This is a product image of something that I took just to show you guys an example of you know, what you should do So I've just taken this image of this hair wax like near the window with a white piece of paper underneath right? And obviously Right now it looks very very amateur Right, really really amateur and doesn't look good if you upload it on to your website and it's just gonna ruin your entire website what I've done is I've edited and Now it looks like this now. All right. So when we upload our image, it's like nice and clean. It's got a nice light gray background So how I did it was I used a sort of a online software. So let's go over here and It's called remove BG. All right, so I've bought some credits now we can upload the image over here So select this over here click on open Now it's going to upload and it's gonna crop it out for you, right? it's going to crop it out for you so that you have a Sort of a transparent background like that, which is really really good. And then what you could do is you can click on edit I believe and sit in like a background. Um We can go to color and then you can set in the light gray if you like So generally the light gray I use is f6 f6 f6 so you might want to write that down Click on OK and that's a light gray background Okay, so I've also cropped it as well, but I'm not going to show you how to do that I think I dropped it in Photoshop or you can also use some other cropping tools like further Com to crop your images as well but this is really important so you can do this for all your product images and and Before you upload it onto your website Okay, because if you don't do that Then your website's not gonna look good And you know people aren't going to buy from you if you have like really bad product images So I see a lot of people upload really bad product images. You can also go to fiber so you could do like Product sort of products photography or editing or something like product editing so you can also ask people to help you crop it out Obviously you can you know use Photoshop and watch your tutorial in it But personally it just takes so long and this one over here is really good. So what they've done is All right taking this image and they've cropped it out You know added a shadow to it and now you can upload onto your onto your website, right? So this is definitely worth paying something some money for so let's go add in a variable product now let's go back over here to our dashboard and Let's go back to products again and you can view all products by clicking every here click on add new and then this one's gonna be a maybe T-shirt right or whatever it is. So let's paste in some Epsom copy and paste that in Paste it into the short description as well Then what we want to do is instead of setting simple products. You want to set variable products? Okay, then you can add in the SKU if you need to For the shipping you can set in the weights and also dimensions here What we're gonna do is we're gonna go to the attributes over here So for your attribute, you can add it over here as well. But generally I don't recommend adding it over here mainly because if you want to add in a product filter It's not gonna display on the product filter properly. Okay sometimes so what can I do is click on publish for now Now to add in the attributes what we want to do is we want to go over on the left here two attributes here Okay, so click into that So the first attribute is it's gonna be maybe color right and then for the slug it's just going to be the same color and This one here. We're not going to enable that and let's just add attribute Okay, so here we can configure the terms Right so we can add in the color. So let's just say we got yellow slug is gonna be yellow as well without capitals and Then add new color then the next one's gonna be like blue slug is blue again and maybe It's gonna be black Okay, click on add new color and Then once we've done that we can go back over here and click on attributes again So you can see that the colors have been added. Okay. So the next attribute is going to be let's say size and I'm gonna put in size over here and Then click on add attribute All right, and then we can configure the terms So for the size it might be like small or s maybe and this one. I do like a small add new and This one let's say medium Add size and then we're gonna do large So you can do any sort of attribute that you need depending on what product that you want to sell Okay, now once you have done that and added in our attributes we can go back to our products To the t-shirt and Scroll down to here the variations Oops, let's go to attribute. Sorry and we need to add in the attribute so color just add that in and Then we're gonna just select All right So select all that we've added before and you can also add in any manual one that you need as well if you need to we're gonna click on Use for variations save it Then the next one is going to be a size. So add that in and then we're going to select all Variations and safe Right. So once that is done, you can also add in additional ones as well if you need to manually But I'm just going to close that. All right, and let's just remove that one Then click on variations. So now we need to generate the variations for our borough t-shirts So what we can do is over here create variations from attributes and click on go Ok, ok And That has generated all the different variations of the size and the colors of your products. So Wait for that to load So as you can see, you've got black and second large black medium black and small blue and large so each of the different variations you can also drag it and drop it to Rearrange the order but not really necessary. Let's click on this down So you can set in each of the variations Information over here, but the main thing that I do want to set in is just the image. So upload image and We can click on the upload files select files and I'm gonna select the Images blue black and yellow so I've got to add red, but don't worry about it. Let's click on open then This one's gonna be black. Ok, and also the same Set variation image and we can set in a specific price for this one so let's just say this one's like $79 for a large one and This one over here upload the black one again The price might be 69 or it might be the same So just want to show you an example black one again set this to 59 and Then I'm gonna quickly add in the rest. So just put in blue 79 Okay, so that is done So obviously you can fill out more details if you need to then once that is done, then the next thing that we need to do is We need to go over on the right set in a new category so this one's going to be Under maybe men's click on add and We're also going to create a child category. So it's going to be under men's And this one we're gonna call it t-shirt. So I like to try and organize everything properly. So everything works properly later on And it's gonna be under men's add New category like that. Alright, so this is the parent category and this is under men's category, right? so if you stuff it up or you know make a mistake here, you can go to the categories over here and You can rearrange it properly as well. So I'm pretty sure over here okay, and you can set it so it's like under it so click on edit and You can have and set the parent category correctly here. You can also add in a thumbnail click on update All right, so, that's all correct. Anyway, so for the product tags, let's just do brand of t-shirt Click on add and that's good enough Set in product image and this is going to be the main product image and we're gonna select maybe Maybe a navy blue dark blue one set that in and that's looking great. You can add additional images as well Then what we could do is click on update and let's see our product Recapture, let's click on View products I'm gonna clean clear some of these ones as well. So you can see Nike they have the same sort of light gray background I think you just adds a little nice touch to it as well and I'll also include like all the you know resources that I've used in the description below and if I can get any discounts for you I'll leave it in the description as well. All right, then. Let's go back over here and you can see, you know, nice and good Let's just zoom out a little bit like that and People can choose the color. So black choose the size and it should d Alright, so that's looking really really nice then the other thing that I do want to show you so if we people arrive on that page It's not going to choose the option by default so if you want to choose like a default option then scroll down to the variations and Set a default color for example black and maybe you know medium might be the most popular size right and then click on update and if we go back up here and Refresh it then by default. It's going to set that in right so people don't have to choose and make a decision there It's set in for them Then let's go back to our home page. All right, so let's visit our website again and That's looking really really great So I do want to show you how to add in like a virtual product and a downloadable product in case you want to sell Like an e-book for ten dollars or you want to sell like a coaching call or anything like that? So let's hover back over here. Let's click on dashboard All right. So let's hover over products again. Click on add new ok, so let's just say this is the e-book or something like that ebook PDF and Here we can add in our description again. So I'm gonna grab this again and paste that in The same over here and let's just say it's like 1995 Here for your product. You have to select a virtual product because it's not going to be shipped It's going to be downloaded. We're gonna select downloadable as well So for the file, you can add the file here and you can choose the PDF Ebook or whatever it is that you want to download. It could be like music as well and choose file and you can upload the file like for example, let's just say let's just pretend maybe This one over here is a PDF open that so people will be able to download that after they've purchased it, right Ok, something like that and you can sit in the file name as well, so like eBook PDF Okay. Now if you do want to add like a product image For your PDF another great resource is canva where you can easily design a sort of ebook cover or something like that so for example Let's say I don't know. Maybe let's just say pick this one over here and You can easily create a ebook cover For whatever you want to sell. Okay. So let's just say this one you can click into it change the text and edit it then we can download it as a maybe a PNG JPEG sorry, and then we're going to click on let's just try and reduce. Okay, we have reduce the size Download it. I just wanted to show you guys an example This is also a really great resource to design anything that you need for your website so over here set product image upload files like files and Let's find out image that a book cover click on ok Then we have our ebook cover So that size a little bit big we can edit the image size over here as well. Let's try and scale it down let's try something like Maybe 600 or maybe 800 is fine actually Click on scale and then click on I think that's pretty much it click on back See if that's edited. Okay, not too bad set that in then what we're gonna do is let's say we click on publish and That is your virtual product, alright, so this is pretty much the same if you want to add in a coaching call or something like that, except you wouldn't choose downloadable right then we can click into here and That is your product. Ok, so I do also want to show you another thing because you know I wish someone told me this Because this is something called drop shipping and if you don't have any products yet to sell then you could do something like this Right, so why don't you show you guys a quick example? Right. So what drop shipping is? it's essentially just importing some products from a website called Aliexpress directly onto your store and you can sell the product and promote it and once your customer, what is the product then you can Ask the supplier to ship it directly to the customer So essentially you don't have to invest thousands and thousands of dollars and spend a lot of time developing the product It's a great way to get started in e-commerce Traditionally people use Shopify for it, but you can use WordPress for it as well. So this is the website and Basically, I'm going to show you how it works. Right? So let's go to maybe over here and maybe let's look up maybe phone cases, right and You can also choose you know where it's shipping from as well But let's just show you a quick example. Let's click into the first one over here So this products cost, you know a dollar maybe a little bit more than a dollar so let's say we want to import that onto our website so we would go and click on edits and Essentially what it's going to do. It's going to download all that product information. So here you want to try and Delete, what's unnecessary? ultra, seeing and clear maybe iPhone case something like that, or maybe not - case because I think It's for other products as well here. We can change the permalink. So you want something that's clean permalink I'm just gonna show you a quick example I'm gonna select it to be Electronics for now scroll down. Okay. So this is the product images and things like that from Aliexpress So as you can see, it looks really really nice obviously they paid like a graphic designer to do it for them We're gonna scroll down over here. Okay. So this is the products and sometimes they do Have a logo up here so you can you know Clean it up clear it up like that and click on save but in this case, they don't have one We're gonna scroll down as well Here. Okay, so you can set in the price To whatever you want. Okay. So let's just say it's like nine dollars the original price is a dollar thirty and Let's say if you spend like five dollars to market it and things like that. Then you still make a little bit of money Okay So here are the different variations that's gonna import as well We're gonna remove some of these settings over here Maybe remove that one as well Okay Then once we've done that we can click on add to the import list or we can publish it directly onto our WordPress website So this is a different website as well, and I'll probably be making a drop shipping tutorial So if you're interested in like that kind of things Then make sure you subscribe right? So I Have imported it and this is the plugin that we need. So the early dropship and it's $89 Basically it's going to help you import from the Aliexpress website and also semi automate the ordering process. I do have a coupon code if you do want to get it I think it's like Hogan or Hogan 10 For ten percent off. So if you do want to purchase it Then the product that you need is the WooCommerce drop shipping plug-in and you can select the alley drops you plug in I do have a tutorial on my channel. You can check that out. There's a little bit old but it still works so hopefully that's added into our Website, so let's visit our store. So let's just try and click on electronics and see if that has been added in Okay, so that's been added in already? So that's pretty much instant, right? It takes a few seconds or a few minutes and people can buy that from your website Okay so that's just a quick example that I do you want to show you so now what I'm going to do is I want to add in the rest of my products so you can pause the video and add in the rest of your products then I'll show you how to add in your product filter and how you can Display your products and things like that as well. So I just finished adding all my products in so what I'm going to show you now is how to change the display settings of the products on the shop page as well as the individual products and As well as on your home page. So if we go back to our home page by clicking the lower here Then we can turn on the Builder right and your products show here. I'll just show you the basic display settings So let's click into that. Now we can set the limit of the product to you know, four products or let's say eight products That's up to you and you can definitely play around with the different settings here and set in whichever categories that you want to so if we scroll down over here and then you can change the layout of how you want to display it like a default one and you can also remove let's say the pricing or maybe add to cart right and maybe you want to hide the Let's say the product title or even the price that's really up to you and I'll show you how to hide these ones as well Which might look a little bit better? Then what I want to show you is how to set in like featured products only. Alright So here what I'm going to do is just select all products and I'm gonna quickly show you how to set in just the featured Products change it back to overlay. I Think that's not too bad maybe I always leave a light like that done save it and I want to quickly show you how to set in just your featured products. So click on your dashboard section and then go to products So here you can select the featured product by just clicking the star icon So if we click that one, right, it's gonna take a second to start. Maybe that one is the featured product and maybe Let's say these purple yoga mats and mini gardening set Okay, so wait until that is selected those are your featured products we can go back and visit the site now if we turn on the Builder again if we set This one to just the featured products, then it should just show the page featured products, right? So that's really really nice I'm going to keep it all and I'm gonna click on done save it and close it then I'm gonna go to the shop page and what we're gonna do is open up the dashboard area and We're going to navigate to the themify shop themify settings So if we go to the shop settings this is where we can change the layout of the product archive, which is your shop page Alright, so here for the shop page sidebar. I'm gonna set that in on the left side You may be you don't want a sidebar then you can just select. No. I'm also going to enable sticky sidebar This is basically gonna allow the sidebar to stick on the side and also on mobile devices it will be on the top So here you can change. You know, how many do you want in a row? Maybe you want three? Maybe you want four? It's really up to you. So you can definitely play around with these settings I might hide the Add to Cart and let's say you want to hide Maybe the share button and things like that so you can definitely play around with the settings here for the single product page this is essentially let's click on save first and Refresh and we'll check the changes. Right? So I'll show you how to set in the product sidebar later Here is what you've said in I guess that's looking not too bad Now if we click into the products like that then this is your single product and you can change the settings over here So you can change it to a different layouts and you can play around with the different settings For example, you might want to hide as here you hide the tags and Yeah, so we can click on save Refresh it and maybe it's gonna hide some things as well Okay, so the category if you want to hide that let's say the share button. I want to hide that as well and Then we're going to click on the wishlist settings So if you want to disable the wishlist You can disable it if you want a wishlist page then set it to your wishlist page which we created earlier right the Ajax card This is you can play around with the settings here. Let's just say for example, we save it and we Refresh the page and let's add it to the cards. Click it. Alright, so it sort of pops up from the side That's really up to you I prefer this one like that and I'm gonna click on the Save the Spark animation is when we click on it that animates I'm actually gonna just disable that one don't really like that one shop sidebar you can disable that as well okay, so that's the basic display settings of your Shop page and also your product pages now, we're going to show you how to add in your product sidebar For your shop page so people can filter your products. This is only if you have like probably more than a dozen products You know, if you don't have that many products, then probably don't need it But I'm gonna show you for those of you who want to know and maybe you want to add some in later. So Let's go to plugins. And what we need is a new plugin. So add new this one is gonna be the themify Themify product a filter I believe Okay, so a themify product filter this one over here by themify store now Let's click on activate So once that is activated, then you should see it on the left here product filters click on product filter and we need to create a new filter so select add new and We're just gonna name it like shop Filter. It doesn't really matter. It's just for your reference. I want the layout to be like this and you can play around with the settings here, but the basics is Let's say for example, you want to add the product title, which is the search function generally, I hide the field title and Also, I might put in a category. I might also put in a product filter as well. Okay, and Before we've set in the color as an attribute So that's why it's gonna appear now if you didn't set it in then it won't appear so color Here I might do let's say Display color as color icons here. You can select the color So I might do black maybe something like that blue Let's do blue Like that and then maybe yellow Something like that alright Then what we could do is you can play around the different settings like how you want to display it and things like that I'm not going to worry too much about it. You can also exclude the categories This is the category ID number which I'll show you just in a minute So to find the category ID number so sometimes you might need to exclude certain categories For your product filter or whatever you need. You can hover over products click on categories And for the category number, let's say we want to select electronics. So click into it Now you put a category number will be here. So cat and then and tag ID equals 31 So that is your category number, right? So 31 if we go back, let's go back to our other categories I'll show you another example. So let's say for example watches Then the category ID number is gonna be 37, right? So if you want to exclude it, then you can put like 37 or sometimes you might need to put minus 37 and that's gonna exclude it Over here, you might also want to have a reset button at the bottom. So people can reset All right, and you can play around with the different settings here. Maybe you want to put size as well or maybe? Maybe on sale so I might put it under C. We drag it under here and Then what we're gonna do is just click on save on the bottom on the bottom left so once that is done, then we can close it and That's going to give us a short code. So copy that short code to clipboard Then we need to go to the appearance and we want to go to widgets So what we need to do is add that filter through our shop sidebar So what we need to do is to delete all of these ones first Deletes and also delete this one over here then we need to look for a text Okay, a text widget click it and drag it scroll up and drop it paste in the shortcode click on save and Then we can click on done So here if we visit our store Then you should see something like this, right so it's a sticky And that is your categories and that usually display settings for the color All right doesn't look that great because I didn't really configure it properly. So I might want to go and do that really quickly Let's go back to our dashboard section close that then let's go to products filter and click on edits So probably I want to change the text color because now it's like a grey I want it to be more visible so I might set it to a white color like this Set it to white and maybe I might try it and set it to the let's see the radio. I think that might look a little bit better. Click on save Let's refresh it Okay doesn't look as good but hopefully you can play around with the different Display settings, but that does look a little bit better with the white text So that is a shop sidebar and if people want to use the price filter Then they can which is really really quick and really good as well then click on that then it's going to show you the products with the different colors in it as well if they scroll down they Can clear it like that? Alright, so that is pretty much it for your shop setting now what I want to show you is how to add in your logo Favicon configure the top menu and also go through like the colors fonts for your website to make it really really modern I'm going to show you like all the secrets that I know so that you can apply out to your website so The first thing that we need to do is we need to change and update the menu So we don't need the my account over here and the check out and the cart because we have it over here already So we can click on the customize section And we need to set in the menu Let's click on back over here and then click on menus select the top navigation Now here, we don't need the my account page. So we're gonna click it and remove it check out page We don't need that anymore car page. We don't need that as well. All right, then we can click on publish Now if you don't see your menu then you can zoom out a little bit and that will show your desktop menu Sometimes it's just showing the sort of their mobile menu with the three Hamburger menu like that. So we need to go over here and Then what I'm gonna show you is how to add in your icon sort of my account here. So click on publish first now what you'll need to do is we need to click on the X here and We need to set in our menu from the dashboard area so you can hover over here and click on the menus then that's gonna take you to appearance and menus on the back and here we need to create a new menu and This one's gonna be the icon nav Ok, so you can name it anything that you want and create menu So here we're gonna select the my account page and add that to our menu Then what we need to do is we need to click on the down arrow and then we need to insert icon then we need to look for a sort of a user icon like this one over here and then what you could do is just save it here in first and One thing for what to do is to select the display location to be the icon navigation area. So save it again Then we can go and visit site and then you should see it on the right-hand side here. Okay? And so the next thing I want to show you is how to customize the fonts and the colors for your website So to do that you can click on customize now with the theme this theme if I theme you can customize any Section of your website from the header section to the body section to your buttons to your shop page anything that you want, right? And You can get quite overwhelming so I do want to sort of explain a little bit about your Fonts because if you change your font then it's going to completely change The style of your website so by default the font that we're currently using is Libre Franklin now if we change the font to let's say, you know because there's so many fonts I you can definitely get a get overwhelmed and you don't know which one to pick now Let's say if we pick this one now, that's gonna change the style already, right? So it's gonna feel different So if we choose maybe this one over here, you know, it's gonna feel different again So it's really important that you choose the right style For your brand and your business because it's gonna reflect and it's going to give off a different Feeling for like each and every font that you choose. So this one is going to be different again I mean this one's not too bad actually so What is the difference between the fonts so generally there are two different typefaces, right? So there is the serif typeface and a sans serif there's also display handwriting and mono space as well But these are the two main ones, right? So the main difference between the two is that with the serif typeface you'll see That they have the curves on the edges of the text, right? So Okay, so if we go over here the sans-serif one you'll see that there is no curves It's just the strokes are the same, right? So it's all even but this one with the serif typeface it's thick and thin with the strokes and You'll see that it looks more elegant. It looks more traditional It looks probably a little bit more serious as well. So if we go to like Tiffany and curve They use this typeface on their website So maybe it reflects elegance and also maybe handcrafted look to it Also a little bit more serious, if we go to dining Wellington, they just use the sans-serif one So very very modern and sleek So depending on what you want for your business Then you want to choose the right font So you can filter the fonts by trending most popular ones and you can select you know Maybe one of the top ten ones though ones are pretty good To get started with right? So if we select let's say the sound serif one right if you want like a modern website Maybe open sans might be a good one to go with montserrat You know these ones are all good like the top ten so you can write them down and you can test it on your website because With this theme, you have all the google fonts to to use right? So I'm just gonna do like a modern theme I guess so open sans is just a very very nice and modern look very very simple Doesn't to have too much style to it. I'm gonna select a normal font weight. Okay, so it's gonna adjust for the entire website now, let's just say You want to change the headings? So we're gonna click on publish and Let's close that for now Now if we turn on the Builder then you can actually change the fonts for each individual module so this is the Text module and we've set it to the heading 1 and if we go styling here General tab click on heading heading 1 you can also set a specific Font for each module as well If you want to right so generally I don't Set anything so that's why I recommend so just disable that and don't select anything and then click on done and Then save it as well so That way you can just click on the customize section over here and you can set the heading fonts Universally that way you don't have to keep on setting it in over and over again All right. So let's just say maybe you want a Maybe a more Look like TV anchor and then let's go over google fonts, and let's click on serif Again, maybe something like play fair display. It's pretty good for that purpose or let's just say Play fair display. Okay, so it's gonna change the style of your website again Let's just say for heading 2, so these ones are heading to right so you can check that by Selecting that and inspecting it Okay, so that is the heading two style. Okay, then we can set this to let's say the same one So I play fair display. Okay like that. That's not too bad. So it's going to change the look of your website Now you can also set the font size as well for the default font size if you want to And then you can also change the font weight as well. So let's click on publish and You can also change the header color over here, right? That's the header section the sticky header is basically when you scroll down that's the sticky header and The site logo and tagline. So if you want to upload a logo click on site logo and if you don't have a logo yet, um Generally, just just put in your site title your brand name or something like that and just pick a font from here okay, and just use that for the time being now, if you do have a logo you can click on logo image and We can select this and upload files select files Then we can let's go to upload a logo maybe something like this okay, so it should be a PNG file which means it's transparent and This is the size that I upload. It doesn't really matter too much because we can resize it in the theme insert Right, so that's definitely too big. So you do want to resize it now generally what I do is I try to resize it on the Height area so I think it was like 24, which I did before. So 24 is good now Let's just say if you have a logo which is like maybe something like this, right? It's a little bit tall Okay. So what I do recommend is probably just maybe Taking the logo the picture part of it away and just use the text logo Or maybe you can adjust the this round thing to be on the left hand side of the logo Adjust that around because if you have sort of like a big logo like that, it's gonna make the padding area for your header Really large it really depends on you either Yeah, if you really do want it, then you can't put it in there But generally I just like a simple one like this. Okay now We need to make sure that the spacing is correct. So we need to go to the site logo margin deselect margin and We need to set maybe I think it was like 18 pixels Which is good and maybe 14 for the bottom like that Okay, then what you want to do is we didn't click on publish and check that out as well Okay, something like that and you can definitely play around and adjust the margins because sometimes it's gonna be a little bit different So you might need to adjust the pixels a little bit. Let's click on site logo and tagline if we hover over that That's the site tagline and you might want to change it to you know, whatever you're selling. All right Sometimes you might just click none. Okay, which is good as well Then what else do I want to show you guys? I do want to show you how to also edit here. So, this is your Main navigation links. So here we can go to the main navigation The menu link and you can change the sizing over here. So I'm gonna change it to like maybe 14 a little bit smaller or maybe 15, okay So I think that's a good size because if we go to like some of these websites that it's like a tiny Sort of link size as well. And I think it just keeps it nice and modern Alright, so if it's like too big, I mean if you do like 18 it then doesn't really look that great to be honest So let's just try 14, and I think that's good enough Let's click on publish Okay. Now you can definitely go ahead and you know edit one by one especially with the colors and things like that But generally for an e-commerce website, I like to keep it very very neutral in terms of the color scheme and then maybe I might have, you know, one sort of color for like the buttons and Certain areas for the website, you know for a ecommerce website you just want to keep it nice and simple and I just think it's easier for you guys to design as well because Probably unless you're a designer then then you can go ahead and you edit each of the different sections so what we going to do is when and click on accent styling and then click on the drop down here and For the accent heading and link color. I'm gonna set it to a neutral color, which is like a dark grey Tu-tu-tu-tu-tu like that. Okay for the background color the accent background color I'm going to set it to another grey 333 so it's going to change for certain areas of your website All right, so you can see the - and the background there that's changed. The font color is here So I'm gonna change it maybe to like a white color. So FFF like that Okay, then For when you hover over here, I think this one is the border color but I might change the background hover to dark gray as well and Also, you probably need to change this to two to two as well Okay, so that's the color scheme for my website. Just a neutral color look and I think that is looking pretty good Okay, so you can definitely change, you know H The individual ones like the mobile menu and anything that you want and the footer color, you know You can go ahead and edit all of those colors for example to put a trap. Maybe we can change the background Color of that. So let's say like but change it to maybe like a dark grey then probably for your foot of font, we can change it to a White color so that's visible and some of those are links. So we need to change that as well. All right, something like that It's not too bad. I think let's click on publish And let's close it Okay, so I think that's not too bad I think we do need to change that color as well Let's just keep the footer I might just keep the foot of white actually Because yeah, every time you change a color, you know, you need to make sure that each of the other sections are also Edited as well. So I'm just going to keep it simple actually, so it's gonna delete that one And let's just delete the font color as well as well as the footer link let's click on publish and Close that Okay, so that's looking really really nice now If you do want to get like logos, and you don't have a logo you can check out fibre again for logo design services Right as well as if you want to get a fab icon which is the little icon up here right that you see on all your websites and Here, I'll show you how to change that. So let's go to the dashboard area then let's go to theme if I shop themify settings and Then fab icon and click on upload Okay, so we're gonna upload the fab icon. So it should also be a PNG file and Click on open so when you do request like a, you know logo ask them for a fab icon as well So generally, let's say this one over here this Mac Greyjoy that logo on top over here. That probably will be your fab icon, right and Then once that is uploaded that's all good. We can click on save Now for some reason some people have issues with clicking upload just doesn't open what you want to do is upload it to your media So let's just open that in a new tab Right upload your logo to media Grab your URL here copy and then just paste it in here and save right? that's the same thing then we can just click on visit site and Then your fav icon should have changed Okay, so I think that's pretty much it I don't want to go too much into the customization so you can definitely edit that yourself I do want to show you guys how to set up the WooCommerce settings and set up your payment gateway. So you can Start accepting payments and start selling things online. Ok. So because I know you guys have been waiting for that for quite a while but hopefully your website is looking quite good by now and Yeah, so we're gonna go back to our dashboard and set in the settings so what we need to do is hover over WooCommerce and then we need to click on the Settings over here and Here you can change the store address So this is kind of important because it's use this address to determine the tax rates with the automated taxes So make sure to set in the right zip code at least right? And if you don't want to display your address then get a pure box So here for the general options you can set in you're selling locations So generally what I do recommend for most beginners is probably selling locally So a lot of people want to sell like overseas and stuff like that, you know but to be honest if you've actually started a ecommerce business before You know sending your products out to influences You know getting it to like for example if I want to send to the United States It's gonna take a lot of time shipping is gonna be expensive You have to fill out custom forms and you have to deal with quite a lot of issues So what I do recommend is probably selling to your local country first And then once you have, you know a solid foundation, then you can start expanding right? But that's really up to you and depending on your budget your expertise and stuff like that so we're gonna click on enable tax rate and Calculations then scrolling down. You can change the currency as well and We can leave everything as default. We're gonna click it save Then we can click on products So here everything I'm gonna leave it as defaults. You can also disable reviews. If you do want to you can change the weight units here inventory So here you can send the notification so you can set the email to your email which you do want to receive notifications You can also set the default low stock threshold here as well So I might change it to like let's say depending on you know, how many you sell a day then I will set that amount Then here you can also hide the stocks from your catalogue If it's out of stock, okay, and also for the stock display Format, let's say for example if the stock is running on low Then it's going to show the quantity, right? So if you don't want to show that then you can select never show right or you could do like only show quantity remaining stock when it's actually low so let's say for example, you might have like a hundred pieces of a Item, so you might not want to show that because you know That's a lot pieces and then people know that okay and come back and get it and stuff like that So you might only want to select something like this. Okay, I'm gonna click on save Let's say for the downloadable products can keep it as default for the taxes now generally what I do recommend is probably just automating the taxes so set in enable automated taxes because Especially if you're living in the United States taxes can be quite Challenging because you've got different states and different zones and also different zip codes which each have a different tax rate and sometimes you need to Calculate both of the tax rates and just becomes a lot like very very complicated It's a lot simpler in Australia where you just have a flat rate Like a nationwide where it's like 10 percent then it's quite easy to maybe disable the taxes and set in the the static tax rates But I think the enable tax rates are is gonna save you a ton of time Now you want to make sure that you have the I think the jetpack plug-in Installed and also connected to enable the automated taxes and pretty sure so over here, right? So you got to make sure that you have jetpack by wordpress.com Save and that's going to sort of close these settings that you have here now the thing that you probably do want to do is maybe the check out the reduce rates and zero rates because Sometimes you might have like a a book or some kind of product. I'm not quite sure because every country is different Let's just say for example an e-book which you know, your tax rate might be like just a little different. I don't know so let's for example, you can set in a zero tax rate for that book or Maybe a reduced rate. Let's just say for example you set in the country and Here we can set in the rate and instead of the general rate might be ten percent this one might be zero percent or it might be a reduced rate of let's say like two percent and then we could use do like maybe like GST Reduced something like that, and then we can click Save Changes Alright, so once that has been added then for the specific zero rates here We can go to our products. Let's say for example open that in a new tab and Let's say for example this ebook over here add that in Scroll down over here. We can change the tax class to zero rate or reduce rate so for this specific item you can set it to whichever rate that you want and Then you can click on publish, right? So that is pretty much it for taxes. We're gonna click on the shipping So with the shipping zones, we're gonna click on add shipping zone So we're gonna set in the first zone and I'm gonna set in maybe like domestic So this is for your own country. So just doesn't really matter what you set in you can select the actual zones over here So let's say for example Australia and You can also set in the specific States as well maybe for certain states Like let's say the states which are closest to you It might be a different rate because you need to ask your post office and check the rates and then calculate it accordingly So let's just say like New South Wales Right, maybe for those two zones I'm gonna call it like local right? So these are the closest to me then I would ship and set in a right here okay, so flat rate click on edits and I'm gonna call it. Let's say 995 and Save Changes Right. So that is the first shipping zone for the local then you can also add in free shipping as well so free shipping over here add shipping method and click on edits and you can also set in a minimum order amount or A coupon so sometimes if you want to send your product out to your influencer You might want to give them a coupon which has free shipping as well because then Incentivizes the the influencer to promote your product because that's giving their audience a lot of value So let's say we set that in so generally that's what I set in let's say your minimum order 75 And then we can click on Save Changes and then that is pretty much good to go You can drag it and move it up like that. Okay Then we going to click on the Save Changes and if you want to add in another zone then we can click back on shipping zones over here and Add another zone So this one might be just like domestic and this one might be I don't know what I'm gonna call It's gonna call it domestic actually. So for the zone names this is gonna be like other states in the country let's just say like South Australia and Queensland and things like that. I'm not gonna set that in right now So I'm gonna add shipping method flat rate and here it's gonna be a little bit more expensive. So maybe like 1295 Save changes and obviously can add free shipping as well as well as local pickup So add the shipping method and that's probably gonna be free. All right Then let's say if we're gonna click back over here now The locations not covered by your other zones, so I'm just gonna select no methods Shipping methods offered for the zones. You can also set in international ones as well so added in let's say if you shipping internationally and you might be like North America and This one might be covering just like the United States and maybe Canada Whoops Like that and let's say we're gonna add a shipping method flat rate and What we're gonna do is set in let's say 14.95 and the thing you can also add in is another flat rate and you can set that to Express so we can change the method to Express UPS Express maybe like two day shipping And this one's gonna be like more expensive, right? So 995 and Save Changes Okay, so this is the basics of shipping zones You can also calculate the shipping cost by weight and things like that Which you'll essentially need a plug in so I'm just going to quickly show you Just the possibilities because I think a lot of people need to know so click on plugins over here and click on add new So over here we're gonna search out for table, I think it was table rate shipping Oops, maybe something like that Okay, so this one over here, so you've also got some different ones as well each one with a different functionality, so this one's pretty good because you're going to be able to calculate the total based on the weight the total weight of your Items and also the quantity and everything like that. So you might need to install the plug-in, right? So I'm not gonna go through that in this video But I might cover in another video. So make sure you subscribe now Let's go and click on the shipping options over here so you can calculate The shipping options differently like hide the shipping costs until the address is entered It really depends on how you want to do it. I'm just gonna leave it as default shipping classes is important so shipping classes is let's say if you want to sell like a TV so far a little bit heavier than your general items on your store and the price is gonna be different right so We're gonna click on add shipping class and this one's gonna be like heavy Items and the slug is just gonna be like heavy oops Items the same and this one might be like Maybe five to ten kilos something like that and you can save that shipping class So what that is going to do is if we go to our products over here then we're gonna click on let's say Yeah, let's say this yoga mat. It's like really heavy click on edits and scroll down and if we go to the Shipping over here. We can set in the shipping class to heavy items right and then we can change the cost of The heavy items so let's just update that. So I want to show an example. Let's go back over here and let's go to shipping zones So for example click on edit over here and For the flat rate. Let's edit that now if you have like a different shipping class We're going to delete that and we're gonna set in the shipping class cost So this one's gonna be heavy. So it's going to be like 1995 and if it's no shipping class cost If there's no shipping class, it's going to be just the normal 995 If you do put the price over here It does add on so I generally take that one away and just put it over here as well then for the calculation type What you could do is charge for the shipping Individually, or you can charge for the most expensive item thing that you want. Okay, so you can set that in right? so we're gonna click on the Save Changes and Let's go and show you an example so visit the store, let's go and Delete this item over here. Let's add this one. I wrote to the cart. Okay, and Add that in Let's go to the checkout scroll down and I think if we set in the address, okay So we haven't sent in the address yet - so you can't view these shipping options. So let's just put in my shipping address example Kames Australia and as you can see once you set that in then the Shipping is gonna be 19.95 because this is a heavy item. Okay So let's go back to our dashboard area and finish off the settings over here Okay, so we're up to payments alright so I'm gonna show you payments after we finished configuring all the tabs here accounts and privacy so over here you can also select for your customer to Log in into their account during the checkout. You can also allow customers to create an account during checkout as well as Allow the customers to create an account on your account page, right? So depending on how you want to you know, operate your business you might want to enable that because it's gonna Make it more efficient in the checkouts and we're gonna scroll down over here for the privacy policy You want to set in your privacy policy page and that's gonna link it over here Alright, and you can also check out these ones over here as well if you want to retain You know certain amount of data for a certain amount of time and if you want to delete it Then you can you know set that how long you want to keep it right? Let's just save the changes of here emails Now with the emails, I think it's really important to have for the from email to be set to a domain specific email So if you don't have an email already, then I want to recommend you guys to set that one up because it's really important Otherwise sometimes I think the order confirmations will be sent to the spam folder for your customer. That's not good So earlier in the video, I've showed you how to create an email inside ground If you're using like another hosting provider then you might need to set that up at your hosting provider and I'll include the links down below for like Hostgator as well as Bluehost and SiteGround and I'll show you how to connect it up with Gmail so you can receive and send emails through there as well alright, so here you can also change the email template so For example, you can upload your logo over here. We're gonna save changes first So to upload your logo What you need to do is we need to go over to media So I'm going to open that in a new tab Add new Okay, so to upload your logos you can select files, but I've already got it over here We're gonna click on here and copy that to our clipboard control a grab that and copy that Come back over here paste in your logo the URL and you might also want to delete built with WordPress e-commerce and for the color you can also change the color scheme over here and Let's just change it to a maybe like a dark gray or your color scheme that you have for your website alright, and then we can click on the Save Changes and Then you can also preview that so click on preview your email and then it'll be something like that, right? so I'll also show you a different plug-in that's gonna help you customize your Email templates to something that's a lot more attractive than this. So don't worry about this at the moment Okay, so just leave that you might need a you know, if you do want to do this Then you might need to change the logo size that you upload now Here, you can also click into each of the different things and sort of change how you want your email template to be Sent so the only thing that I do want to send is for the completed order Click on manage for that one. So this one over here What I'm going to do is I'm going to change it to your site title order is now Has been shipped right because sometimes it can be a little bit confusing when it says completed so let's say for example, you do like your site Title Order has been Shipped right? So that's going to be the subject line when that email is sent to your customers Okay, so it doesn't really confuse them when it says completed now You can also change the template a little bit later as well with the plug-in Let's click on integrations. And I think everything is all good for here advanced here you want to make sure that you set the terms and conditions page to the one that you set in before and scroll down and I think that's pretty much it click on save and We're gonna set up the payments. So click on your payments tab and If you want to accept like bank transfer check payments and things like that, you can enable that and same with cash on delivery. So the customer can pay, you know, once you deliver the goods by cash or maybe by F posts, like if they have a If you have an F horse machine at your shop or anything like that, then they can do that as well So generally what most people set up is probably PayPal. It's probably the easiest way to get paid online so you can enable that Now if you don't have a PayPal account yet, then you'll need to go to PayPal.com and you need to set up an account so generally when I first started online and started making money online, I just started out with a personal account and Once I started to get a few sales then I upgraded to a business account because with the business account you do have to put in like your sort of business name and you know, the business number like the ID number in Australia It's like the ABN so in America You probably have to put in like your tax file number saving in Australia and all countries probably have to do that With personal I'm pretty sure you don't have to do that but I'm not quite sure because I haven't signed up for an account for a while now because I have an account but You'll need to connect your account with your bank and that's pretty much an easy process And I'll walk you through how to do that in PayPal itself So once you have that then you'll need to put in your paypal email over here So we can click on setup Alright, and all you need to do is put in your paypal email. So just put in for example, my one's gonna be Creative we're calm and With PayPal you're able to accept credit cards, but it's not gonna be on your website directly to do that We're going to need a stripe which I'll show you how to connect in a second Ok. So what else you want to do is also put in your paypal email in the receiver email field as well And then you can proceed over here. That's pretty much all you really need to do for this Okay, then we can click on save right so let's just say for example Let's go through our site let's go and check out and We can scroll down over here Then as you can see people can pay by Visa or Master American Express and they can check out and proceed to PayPal So they'll need to log into their PayPal account if they have one if they don't that's also good as well Because they can also pay with their credit card or debit card and things like that, right? So that's the basics of Payment now I want to show you how to set up the online processing Directly on your website itself. It is gonna be a lot more professional if you do have that and most websites Do you have that something to show how to set it up using stripe? So I just want to quickly show you what stripe is Now stripe is going to allow you take septa credit cards directly on your website Whereas PayPal you have to click into it and you have to click on proceed to PayPal then they can choose Their credit card payment, right? I think it's just gonna be a lot more professional If you have a credit card processing on directly on your website, and it's gonna help with your sales and conversions as well So what you need to do is you can go to stripe comm now. It might not be available for your country Now if you it's not available There's also other plugins that you can search for and integrate it with your website to add that credit card functionality I think like to check out also does that as well or you might need to just stick with PayPal for now, right? So generally with these companies they're adding new countries like all the time So make sure you check them out another time and they may have implemented for your country as well. So with stripe Basically, what will happen is you'll need to sign up and you need to fill in your details and you'll probably get into a dashboard Section and it looks something like this and you'll need to verify your email okay, so they'll send you a verification email and what you need to do is activate your stripe accounts and you also need to I believe you need to put in your information for example like your personal information your business information as well as Verification like your your passport or you know, you driver's license and things like that. And what will happen is that once they verify and accepted then your account will be activated and you can receive payments into your Skype account and then you can set that to be automatically Sent to your bank account of choice So generally you can set it to send that payment directly to your bank every day or every week or something like that Okay, so I'm gonna select my trial account and show you exactly what you need to do So over here, this is the activated account. And once you have done it click on developers, right so we need to connect your Stripe account with your WooCommerce so we can click on API keys now if you want to do a test transaction Then you can click on view the test data and copy over the test key and secret key over Okay but I'm just going to do a real transaction because You just want to do a real one and also share to create a coupon code. So that's it's really cheap, right? so let's just set that in and we're gonna copy over the publisher key and copy that to clipboard and Then we're gonna open my other website over here So here what we need to do is we need to go to plugins now sometimes stripe might be installed already So with this one is not installed yet. So we need to click on add new So we need to find the plug-in over here so stripe and just click on enter So I'm just gonna use the 1 by root Commerce right and then click on install now So once that is done click on activate, alright, so once that is activated we can go to WooCommerce click on settings click on payments Scroll down and then we're going to enable this one stripe credit card stripe. Ok, so you can also so you've also got other Payment gateways as well, which you can integrate. So this is the one that we're gonna integrate and we can click on setup Ok, we're going to enable that and for the title we're gonna disable it, okay Just going to call it credit card and maybe debit card So people can also use their credit debit cards as well and pay with your credit card Debit card like that Ok, and I'm gonna disable the test mode paste that in ok, I'm gonna delete the spacing over there and then I'm gonna put in the oops Ok, so put that in like that. So these are the live Keys Secret key. Let's go back over here copy that over and then I'm going to copy that's and then I'm gonna come back and paste that in so for the webhook secret what we need is to Copy the URL from here, right? And this is going to enable you to Get the charge status notifications right for your stripe account. Then we need to go over here and We need to go to web hooks and then at the end point paste in the URL All right, and then select the events, so we're gonna select the charge event over here and then we're gonna click on add endpoint and Once that is done, then we can click on the key Copy that over come back and Then just paste that in Ok, so that's looking pretty good. Now. I think everything should be okay So this thing over here? Will your customers to sort of check out on their mobile Apple pay I think with the Google pay on? Mobile so you can enable that or disable that that's really just up to you and we can click on Save Changes Okay, so that should be set in now. What we're gonna do is do a test. So I'm also going to show you how to create a coupon. So we're gonna click on create a coupon and Create your first coupon. So what I'm gonna do is probably set in like a 99% coupon. So like 99 school at 99 or 99 off Okay so you can easily create a coupon really really simple then what we could do is Set in a percentage discount and I'm just gonna do like 95 or maybe 99 percent off Okay, and you can also set expiry date as well. That's really up to you and you can also do usage restrictions and Things like that. So we're gonna click on publish All right, so we're gonna click on visit site and We can click over here and you can view the cart, so I'll also show you how to Change the look of your cart page and checkout page to something a little bit modern in a second but I do want to show you how the Transaction would work on your store. So I'm gonna select free shipping proceed to checkout Then what I'm gonna do is fill out the information, right So as you can see, you've got the credit card directly on your website already Alright, so I'm just gonna fill in the above and I'm going to do a real transaction with you guys okay, so I just filled it in now you want to scroll down and take this and then we can place an order so hopefully This is going to go through It's gonna take a few seconds okay, so the order has been received right then we can go back to our account over here click on home and You'll see that you have received money, right? So just then I think we've just received a dollar sixty that was from our website. Alright, so basically if we go to our Website as well. So let's login to our website. You'll see the order and I also show you how to Connect it to your phone as well with the WooCommerce app In a second, but I do want to show you some other things as well including the emails like customizing your emails the checkout forms and all the important stuff that you probably want to do anyway as Well as sending PDF invoices as well So if we go to WooCommerce we can click on orders over here, right? So this is the order that just processed through our stripe account. So we'll just click into that and This is your customers details the shipping details So what you could do is ship the product or whatever it is to the address over here. Ok, and Here, I'll show you how to add in the tracking which is really really important So what we're gonna do is do that right now. Ok So as you can see, that was the stripe pipe payouts and what you need to do is if you do want to refund them you can click on refund right, but generally if The order has been completed. Let's say we set it to complete right and you need to set it back onto a pending payment or processing and Then you'll be able to refund it from here, right? You can also refund it directly from your stripe account as well Okay, now we're gonna download and use a plugin. So you're able to send the tracking details to your customers So click on plugins and then click on add new and what we need to do is look for I think those like advanced tracking ok, this one over here advanced shipment tracking for WooCommerce install now and then we're going to click on activate now once that is active then what we could do is we can go back to the orders over here and we can click into the order and Then over here on the right you see shipment tracking all right so let's say your order comes in then what you need to do is you need to Ship it out and generally if you have like a tracking number we can click that in and Then for the shipping provider you can set it to whichever one that you're using. Let's say for example, I'm in Australia I'm using Australian Post or I'm pretty sure you can set in a custom one as well and then you can set in the URL for the shipping provider and Essentially here. You just put in the tracking number I was going to put in a random one for now and you can put in the date shipped and what we need to do is market is completed and Then we can click on save tracking and that's going to send a email To your customer. So this is the email once the order has been shipped Alright, so here they'll include the provider as well as the tracking number and people can click on that to track their order So that's gonna link up to the Australian post Sort of URL and then they can track it as well like that, right? So that's not a real one So we can't really track it. So sometimes your client might ask you for like a PDF as well So you need to go to plugins again? Okay, so we're gonna search for I think is like we're PDF or WooCommerce PDF or something like that? Okay So this one over here we invoice by web epic and we're gonna click on install now Okay, so there's some other ones as well, which you can definitely try out But obviously there's so many different ones and each with different functionalities I found this one to be just nice and simple, but you can definitely check out other ones as well let's click on activate for that then now if we go back to our orders over here and We can click into that So I think generally you can also Click on the packing slip as well. So for example if you've got a lot of orders and sometimes, you know within the order let's say you have you know yoga mat you might have you know fruit you might have different items, then you can print this off and That's just for your reference so you can pack the right stuff. Okay, you can print it off and things like that So here is the invoice so you can click on that and it will generate an invoice so you can put in your sort of a logo as well as your address and your business ABN number or whichever number that Is like the tax number for your business? put that there and then that will be your invoice and then you can send that to your customers because sometimes They might be like business customers and you want to send that to them. You can click over here, right? So I'm not going to walk you through too much about the customizations. You can play around with the settings over here This one. I might just deselect this one though and You can also select templates as well and configure this Alright, and I think a seller and buyer you can upload your logo here put in your company's information alright and Save Changes and Yeah, I think they've also got a pro version as well, which you can check out Personally, I just use the free one. So the next one that I want to show you is plugins this one is gonna be the email so So I'm gonna search for Cadence or condense? I'm not quite sure how to pronounce it. So it's this one over here with Commerce email designer so we're gonna install now and then I'm gonna wait for that and we're gonna activate it click on activate. Okay? so what we're gonna do is configure that I can go over here and click on email customizer and That's going to take you to your customizer on the front as well and We can click on the pre-built templates and you can download or use the template as well this one the free fluid template is also the one that I've showed you in the Demo in the introduction of the video so you can follow that and Gallow that and import it Here just load the template so I'm not going to show you that right now because I'm gonna make the video super long But let's just say for example You know we select this one over here Maybe click on load. Ok, something like that Ok, nice and simple one and you can configure, you know All the things over here like the footer section the social links. You probably want to change that to your social links customize the colors to your Specific thing as well and you might want to add in a logo and things like that What I do want to show you is I think the email okay So for example, the the customer completed the order so this one over here You might want to say that the order has been shipped, right? So here your recent order site title has been Instead of completed. I think that's a little bit more clearer so your customer knows and you can put some additional information like Let's say you'll receive the order with you know, within X amount of days if you have any issues that way you can make sure that the customer is happy and you know, they're not like angry and then they leave like an angry review or anything like that, which is not good and We can save that and I think you can also click on back over here. You can also do a test preview email as well so let's just say we click back over here and Let's go back to that specific order again Okay, I'm going to use the same example Okay. So what I'm gonna do is maybe send the order details again and see if we can get the email and see What it actually looks like the new template, right? So this is the new order details in with the new sort of template Which I believe looks a lot nicer than the default one and it will include the invoice as well Hopefully if you have that plug-in installed, okay so what I want to show you now is how to download the WooCommerce app onto your phone whether that be Android iPhone or anything like that Alright, so if you guys want to manage everything from your phone and everything like that then you just need to download the WooCommerce app in the App Store or the Play Store and Install it so I was gonna click on open here and we're gonna log in so here we need to put in your website's address Right. So in this case is going to be ecommerce demo click on next and then What you need to do is log in with your email account that you signed up with when you signed up with the WooCommerce Services the jetpack and then that should be good to go Right. So on the home page, you can view your stats the second tab over here. You can view your orders All your orders and you can also click on processing so let's say a new order has came in then you can click into it and here you can click on begin fulfillment and Click on add tracking here. You can select your carrier Now if you don't find a carrier, you can add a custom carrier and then you can add the tracking link for them And then we can click on the type of carrier. For example US Post. Let's just put in the tracking number All right so the post office or whichever shipping company has given you that then you can put it in there click on add and Then once you've done that then you need to click on mark autocomplete. And once that order has been completed The customer will be sent an email saying that the order has been shipped Alright, so that is pretty much it now If you have any issues, for example, the customer won't might want a refund. You can also refund from the phone as well So you just need to click on issue refund? ok, so I'm pretty sure if if it's a stripe credit card refund because we've connected the API key and things like that you can Issue a refund here directly in terms of the PayPal one. I think you might need to connect the API as well So you need might need to go back to your PayPal settings and get the PayPal API key and put it into the settings area To do that one? Okay. So here we need to select all ok so if you want to select all the products to refund or you can select it individually and do a partial refund and Then next we can click go on here. Ok, we're going to click on refund and refund and That's gonna process. Ok. So your customer will also be sent an email saying that has been refunded. Ok. So once that is done then Here you can also view your products and you can manage your products So for example, you can click the stock and you know change the stock levels You can also manage the description and you can also change the price and set in the sales price as well ok, so it's really really good and really really efficient so you don't have to log into your WordPress website Every day and then you can go over here. You can also manage your reviews as well So if there's any reviews coming in, then you can click into it. You can approve it. You can trash it and You can I'm not sure if you can edit the reviews so you can actually edit the reviews in the WordPress dashboard area But I'm not sure if you can do it here. I think that is pretty much it with this app alright, so you can click on the top here click on settings and He can manage your notifications so you can set in the new order alerts, so generally I don't have any other alerts I just have the new order alerts and then if you want to turn on the sound then you have to do that for your phone and I think that is pretty much it. Right. So I'm gonna jump back into the computer and show you guys how to Really enhance the experience for your customer So I want to show you how to customize certain things Now you can go out and literally start selling right now like everything is complete but I think this bonus section of the video is really gonna help you out and You know, you might want to subscribe and then maybe you can come back to it when you actually need it, right? So, yeah, okay, so we're gonna start off with the contact page Now what you want to do is make sure to download the template onto Your desktop now I just want to remind you guys that sometimes it might automatically unzip into your text file So you might need to right-click and compress it back into the zip file So we need to go back over to our website and click on turn on build up and Here, we just click on import import from file. Ok, and Then we choose the file. So this one's gonna be the contact page click on open and That's gonna take a few seconds to load up So the only thing that I want to go through here is you want to make sure that you have the contact form plug-in installed So it's in the description below you want to make sure you install that as a plug-in and then it will appear here So this is the plug-in and this is the add-on. Ok, so click into it So you want to make sure that it's sending to your email and not my email? Ok, or you can send it to the admins email which is the admin of this website, which is generally your one ok Or you can send it to you know, whichever email to e1. So here you can just fully customize anything that you want including the form fields like that and also you can click on the styling tab and General and you can really customize how you want it to look Okay, so you can do that by itself And the only thing I want to show you now is save it is You want to make sure you go to the backend or you can go to edit page if you have closed the Builder You want to go down scroll down to the content width and select full width' and update, right? So that's gonna remove the white spacing and you got to do that every page right now What we want to do, once that is done, then you can view the page and check it right. So that's looking pretty good Then if we click on track my order So if you want a tracking page for your customers to where they can track their orders So for example, they put this in and they click on track then they'll be able to see if you've shipped it or not Ok, and then click on this link to see the tracking on the actual website that you've set in okay, so Let's say for example you want to do that? Then what you need to do is you want to add new and add a new page So you can call that page anything that you want like tracking track my order Really anything that you want so I've just called it tracking right now once you have that page, then you can just turn on the Builder and go back to our website and Then you can download the template as well okay, so download the template and Install it over here. So the only thing that I want to share with you guys is this layout is very very simple Right. The only thing that we really need is if we click into that. It's this short code over here, right? So if you use this short code on anywhere on your website it will Sort of provide this tracking thing over here. You can literally add it to any page Then the next thing I do want to show you is also the my account, okay? So if you wanted my account like that So sometimes you might have the default one where you don't have the hero image on the top Okay, so all you really need to do to recreate something like this is you can click on edit page Ok, so generally there will be like will come as my account shortcode over here so you just want to delete it right or you can just copy it actually so copy it and You can delete this block over here, right? And then what you want to do is you want to save it, right? And all you need is the shortcode right? So let's say for example You want to recreate the layout and you want to delete that block as well, right? So if you want to recreate the layout you just click into it and as you can see I put the shortcode over here Okay so I've added some spacing on the left and left over here and some spacing on the top and then I add my own hero image and here you can put like maybe like your Your text below there as well like few your orders or anything like that Okay, so you could do like view your orders and more right and then going over here font Center eyes it and There you go. Something like that and maybe change the font size to like 18 and Then you pretty much be good to go so if you want to boost the visibility of the text click over here wrote overlay add a Black drop the opacity down like that Okay, and that's gonna add a black sort of transparent layer on top and that's gonna enhance the text Alright, so click on save and that's your my account page done So it looks a lot better now and you've also got to track my order contact page So all the other templates, so just do that by yourself. It should be pretty easy. Then we can go back over here Okay Okay. So now what I want to show you is how to customize the car page and the checkout page Alright, so by default. I personally think it's not too bad It's very very simple and minimal and pretty nice honestly, so you can actually go over and click on edits right you can do the same thing as what we did before so you can take the shortcode and Put it in a text module in here and then you can really customize it with the hero section and whatever that you need But there's also another thing that I do want to show you guys which is the WooCommerce I think blocks and adds a new different cart look alright, so we can go to the plugins over here and What we need to look for is the WooCommerce block so sometimes you might have installed it already So you might not have to install it again but if you haven't then let's go to WooCommerce blocks and then click on enter and It's this one over here right click on install now and let's click on activate Then what we need to do for the Coe page changes Alright now what we could do is just go over here. Let's just delete this one actually delete the whole Maybe delete whole block. All right, let's do click over here. We're gonna search for cart and click that All right, and that's going to add that in Okay, so I think that's pretty cool. All right, then what we could do is click on update and Then we can click over here and then click into that link okay, so as you can see the cart is not looking great because this thing should be over here and basically to fix that what you'll need to do is just go back to my template page and scroll down to the very bottom and Here the FAQ so we can click into that and we just need to copy this code So it's just some CSS styling for how page so all you need to do is go back to here Alright, then go to customize So sometimes your website might need some CSS styling for certain parts. This is just to arrange certain things let's click over here and Let's just paste that in Like that, and then you should be good to go So this is also going to configure the checkout page which I'll show you how to do as well so I'm going to close that and Close that over here Right, so that should be looking great Now the next thing I want to show you is click on proceed to checkout and how to customize this section over here as well So here we can just click on edit page Alright so we can take this shortcode here and we can just delete it actually, so just delete that click over here Search for checkouts All right, and this is the new checkout right so that's gonna be cool and you can also customize certain things over here as well and Yep. Alright. So what we're gonna do is just click on update and Let's view that checkout page. Okay. So this is our new checkout experience I think this is the better one, but it's really up to you Yeah, okay. So now the next thing I want to show you is click on your dashboard section. This is the advanced shipping So I'll show you where you can actually customize it. So we're commerce shipment tracking and What I generally like to do is change this status to shipped All right So you want to take that there we can scroll down here to the tracking info display and click into that So I just want to show you where you can customize the look and feel of the tracking part of The email okay, so we can click on the table layout design. So this is where you can change it I believe so scroll down over here and what you want to do is probably change the font size because I think right now it might be like kind of small or You might want to adjust the font weight to at least 3 to 400 in the font weight Which is the thickness of the font? Okay, and for the tracking link background color, I normally just leave it as default I don't really play around with the settings here too much because it doesn't really need to be styled too much Right, so can close that and once that is good then I think that it should be pretty much good to go Okay, so let's go connect our themify social links so click on the themify settings and Then you want to click on social links over here. Right? So if you want you can add your social links Okay, so I'm just gonna paste in the URL So obviously pasting the right one. I just want to show you an example if you do want to change and add Instagram So you can add a link and then you can find the icon and things like that So let's just click on save now if you want to display your social links on the bottom of your website then what we could do is we go to the widgets area appearance and Widgets right here we can look for the themify social links All right. So this is widget click it and drag it up and We can put it below the footer logo widget area right, so you can literally add it anywhere you like as long as you have this widget, right so we can click on Open link in a new tab and click on save because it's an external link like linking to another page other than our website I normally want to have people open another tab because I want people to stay on my website. Okay, so let's go and visit site so scrolling down here, you'll see the social links on the bottom rights are very very simple social links if you want to display a Sort of nicer one. Well, you can I'll show you quickly. So go to dashboard and Let's go themify shop themify settings So we can change that over. I think it was Over theme settings here and footer social banners. Okay, so we can enable whichever one that we want. So for example this one Pasting the link paste in your username, so I'm just gonna paste in the link I want to show you a very very quick example how you can you know add extra things onto your website? Paste that in over there. Let's click on save and then let's click on visit site Oops, okay, so that's gonna show a really nice Thing over here where you can link it to your Instagram page and things like that The other thing that I want to show you guys is how to connect your newsletter, right? So collecting emails is really important because you might want to like offer sales or you might want people to sign up for your email list for a 10% off and then you can collect email so like when Christmas comes or whenever you want to have a sale you can just do like an Email blast and you can make a lot of money doing that so to do that what you do need to do is sign up for MailChimp so MailChimp is a free Email sort of marketing platform that allows you to collect emails and send emails, right? So you just need to sign up for free? I'm not gonna walk you through the entire process in this video because that's gonna be like another video But I'll show you how to connect it up. So once you've signed up with MailChimp, this will be your account dashboard Generally with the free account you'll only have a one list, right? So the list is essentially just your email list with all your customers emails and things like that and that will be under audience Right. So all the subscribers will be added here and then you can create campaigns and things like that so what I want to show you is how to connect it to your website so you can click over here and click on account and All we need to do is look for the API key. Alright, so click on extras and click on API key and Then we can scroll down and just copy over the API key copy that and go back to your website so let's minimize that and we need to paste that in so go to dashboard and Then we need to go themify shop themify settings and then we go to Integration API and click on opt in so you can use other ones as well like convertkit get response These ones are really really popular Let's click on MailChimp and paste that in and then we can just click on save So once you've saved it we can click on visit site now We can go and turn on the Builder Then over here we can click into the opt-in form So I've created this form using the opt-in form module, which is really cool So I think there's this one over here and you can click into that So here select the MailChimp here, you can select the list Generally, you only have one and you can also change the layout of how you want the form and how to style it This is just how I did it I just collected the email and things like that and then you can really just fully customize anything that you want Okay, so you can go to styling and you can edit how everything looks using these functions over here So once we've done that the next really important thing that I want to show you is how to add Content and layout parts because sometimes I think this will really unlock the possibilities of how you design a website and things like that So if you want to create like a secondary header, I'll show you how to do that. And this is really cool So click on dashboard What we need to do first is you need to go over here to layout parts So once you create a layout part, you can add it to anywhere on your website So this is really really cool because you can add you can create any layout using the themify builder So let's just say this is called the secondary header Okay, so this is where maybe you want to put like $50 free shipping free returns any sort of notification that you might want to do so we can click into the link alright turn on the Builder and what we could do, let's just say we want to add in texts over here and here we could do like let's say free shipping for Orders over whoops $50 Something like that, right? So I just want to show you like a really quick example let's make that into the center and What we could do is maybe Let's add in a background. Right? So let's add a background to the road background. Let's set this to like maybe Dark gray to do too and Obviously we can't see it. So we need to change the font. Let's change it to white like that Okay, let's add a little bit of padding on the top And we also want to click into the text module. We want to make sure that the spacing is minimized So to do that click on styling Click on the margin. So margin is a little bit different from padding padding is essentially the spacing inside the blue box or Inside the module, right? So when you hover over the purple Then you also see that the padding is in the inside margin is going to be outside that box So what we need to do is minus the padding to like maybe five or maybe not five So sometimes you just need to play around with the pixels It does Something like that, maybe eight. Okay and click on safe and I think that is pretty much good to go. Let's click on save and then you can also add in different things like maybe an icon and Really customize it but I just want to show you an example of how to use it because it's really really cool so let's click on that and Sometimes you might also want to make sure it's responsive as well just in case so if you do need to do that Then you need to click on the responsive styling and you can also click over here help right? You've also got some additional videos here, which you can watch as well and some shortcuts, okay? so let's click on the save here and click on the back end and All you need to do is copy the sort of short code ok So just copy that short code and you can add that anywhere on your website So where I want to add it is I want to go to themify shop themify settings and I want to go to hook content So if we click on Huck locations, this is going to allow you to add anything anywhere on your website without coding, right? So it's really really cool. We can just look at it and there's so many different possibilities it just yeah Yeah, you don't really need it too much actually So don't use it too much because you just going to over complicate things for your website so what I do want to do is maybe put it header after okay, so after the header and Let's just go over here add item. Okay, so we're gonna select header after pasting the shortcode click on save Right and let's go over here and visit site and then you've got your Secondary header. Alright, so you can also edit it straight from here as well. So Literally, yeah, it's just super super amazing The next thing I want to show you is your footer section. So how do you make it like a more advanced? footer so to do that what we can do is we can go to the widget section over here and You can put in any widget over here alright So what can do is let's just say this is just how I do it and one way that you can do it You can put the text over here like that. And let's say you've got your different pages like about Oops maybe like contacts you got blog and then you've got Maybe FAQ right just just as an example You could do like pages For the title, you don't have to do this and what you can do is Just link it up so you can open up a new tab Right and just copy the links like this copy link address Come back over here click on link link it up and I'm just gonna link it up here as an example Okay link these all up. Obviously you should find the right pages. Alright and click on save Click on done and what you need to do is if you want to have it on different footer widgets as well. Let's click on Visit site to show you what it looks like Right, so it would be like that Alright, so if you have it like that Then you could have literally anything so you could have your category pages you could have different things on your footer section and if you want to remove this section over here then all you need to do is We can go to dashboard Then we can go to the let's go to Where it we're going to go appearance and then we want to go to the menus Right because we've set this in as a menu already In the location, so go to footer Click on select and then over here. You want to remove that and save menu and then click on visit site and Then it will be gone right and what you could also do is I'll quickly add some more pages then I want to show you Also go to dashboard over here themify show up themify settings You can go to the theme settings The I think theme appearance over here Change the footer widgets if you want to have 4 widgets, so maybe you have more pages that you want and you want to have Just you know more menu items that you want link to then you would select that one over here And you can also change the layout style as well. So this one might be it looks a little bit better probably click on save and click on visit site Let's have a look Alright, so something like that You might have your things over here, and then you have all the pages If you want to add some payment icons as well, then what we could do is I'll show you how to do that alright, so what we need to do is go over here and we go to layout parts again and Here we can create a new layout part. So for example, this might be payment icons And let's click on publish once that is done, then we can click the link here or click on front end and That's going to take us to the front end. So turn on the Builder So it's very very very easy all we need to do is you can use the icon module drag it in like that and Here we can click on the icon Ok, whoops Ok, then what we need to do is click on font awesome and here we can search Visa, right visa card and you can do the labels like that and we can just remove it Ok, and you can add new and you can set in the color. So I'm gonna quickly do it. Let's say we do MasterCard, oops, fun awesome master cut like that. Let's remove the background for all these ones. Just keep it nice and simple and And here click again here. You can search for PayPal This one over here and let's do stripe so add new again Let's search for the stripe Ok, maybe this one or this one ok, really depends on what you want and Let's just say that's ok So you can add as many as you want and once you're done so you can set the size here to be small large Depending on what you want Maybe you want to change the column to make it a little bit darker Click on icon color set the color to maybe like 2 to 2 something little bit darker it looks a little bit more modern like that click on done and then we click on save so that's pretty much it and All we need to do is we can click on the back end and add it onto The thing. Ok, so here we need to copy the shortcode so copy that T clipboard and all we need to do is go to the widgets section Go back over here and we'll put it here. Ok. So this is where it will appear So I might delete the social links because where you have that now all we need to do is find the text module Put it into here paste in the shortcode click on save click on done and visit site and Then we're pretty much good to go right? So a lot of people do have the opt-in box over here as well So that's very very easy as well. Click on turn on builder. Now, you can control it and build it from here as well let's just drag in an opt-in module and Drag it in and you can literally create it in a few clicks So if we just hide this and hide this then you've got an opt-in box. So I'm not gonna really show you how to Customize it and it's very very easy to do Let's just say we do it like that. Okay, cuz because there's a lot of space there and you can also change This one to subscribe. You can also add an icon if you want to And you can fully customize it in the styling. So however, you want it to look Alright, so let's just say that's done. Click on save and Maybe let's drag in a text module so could do like you know Sign up for 10% off instantly Okay, and then maybe Center it let's add change the color a little bit a little bit darker something like that Have you add some spacing? Okay, save it and let's close it and see how that looks Okay, so obviously you can customize that even better So I do want to show you another thing how to customize the footer section because you might want to reduce the spacing So you can click on the customize over here then we just go over here footer Okay So here is the footer text. So for the font, we can change the line height So we can reduce it like that. So I put 10 maybe you would put 12 I think 12 looks decent and You can also change the link colors and everything that you want over here. Alright, then let's click on publish Close it Okay, so our website is pretty much complete now. I want to show you guys how to Translate your website to any language. They want it's going be super super easy And I think you guys will really really enjoy it because now if your client asks you okay? They want to translate the website You can do it for them and it's gonna provide so much value for their customers Or your customers because now you'll be able to reach new audiences and also it's good for Google as well So not only will we rank for English keywords, you'll rank for whichever language that you've set in as well So that's super super good for SEO purposes. That's gonna get you a lot more traffic. And yeah, it's just super amazing So to start translating your WordPress website, we need a plugin. So click on add new and This is a really great plugin in my opinion. So it's called we Glatt okay. I'm not sure how to say that properly Hopefully that is right. This one over here translate WP website. Okay and click on install? So this plug-in is really good because it doesn't take up any of your website resources right some other plugins out there, which is some free ones, which I did say I was gonna mention is The poly lang plug-in. So let's have a look at that one. That one is free, but you have to do it manually and That one isn't as good. I mean, it's still okay pretty good for a free plug-in This one over here, right 500,000 installs. So you can also use these to make it multilingual It's a bit more manual and in my opinion is not as good as this one because this one is really really good So what we're gonna do is we're gonna go over here and click on here. So we got It's hard to pronounce for me. I don't know and here we need to put in the API. So here we'll click on to the Register a account here Okay, so we're gonna put in an email. So this one is going to be ecommerce demo 91 at oops gmail comm Set in your password Okay, take that and start free trial All right, I'm going to close that let's close that all right. Let's go to my email click on this and confirm your email Once that is done, all we need to do is copy the API key so copy that and just paste it into here and Here you can select your language. So originally it might be a different language I'm just gonna pick English and here we can choose the destination language so you can choose from over I think over 100 different languages and the For the trial accounts or for the free accounts. It's going to be 200-1000 words Okay, so if you need more then you have to upgrade to the annual plan I believe and I think there's a link down below that's gonna give you two months free So if you do want to check out the annual plan, I'll show you a little bit later But let's go over here. And let's say you want to put a Chinese or any language that you want so select that and click on save Okay, so let's click over here So right now it's not going to display yet it's gonna display over here so you can leave it like that It depends on you like if you want it to be sticky like that or I'll show you how to add it up here and also on to your Footer section here. So I'm gonna show you how to do it here first because it's so easy You can literally add it anywhere on your website. We just need to add the widget. So click on turn on builder. Okay? So here with the themify module we need to click on the widget, so let's just drag it Let's just say drag it over there I guess and here we can select the widget and we need to look for they this widget over here and select that and Then it will appear right so you can obviously add some styling and add some padding onto it I'm not gonna do that. So I'm just gonna click on close I don't want to show you how to add it onto your header section because that's probably one of the most Prominent places that you want to put it right. So let's go over to here and we can click on menus Okay, then what you could do is Let's just say you want to do a mega menu, right so you can do a mega menu as well since we're here you can put in like a Hey your product categories here like under and you can select mega post right so Sometimes you might not see your product categories and products here What you need to do is click on screen options to enable that right? So if you want a mega menu, then you need to select mega post and then you can drag your categories below that alright So I'm not going to cover that too much So if we want to put it into the icon navigation, then we can click on the icon nav select that All right. Now all we need to do is we need to scroll down over here this one over here we got switcher select it add it to menu and Then just drop it over here click on save and you Can also click on to it and you can change the look of it as well and pretty sure all right So let's go back to our home page Ok, so hopefully that is saved Let's head back to our home page Okay, and then you'll display over here so you can change the display settings as well so let's go back to the dashboard area and then I'll finally show you how he can actually edit the The words and stuff like that because not every time it's gonna translate correctly So we do need to fix it manually sometimes now click over here and we can scroll down and you can play around with the settings here scroll down over here and Here they've also show you how you can add it to different sections. You can exclude certain URLs So if you're on the free trial, then you might want to exclude certain URLs. You can also exclude certain parts of your website ok, and Things like that and then we're gonna save changes. All right, so if you want to edit your translation, so click on edit so we can click over here and We can review the words that have been translated You can click into it and sort of manually edit this way like for certain parts of your website And you can definitely like it's very very customizable. If we go back over here. We can click on the visual editor So this is the thing that I want to show you click onto that All right. Now you can also click on the same thing over here on the top right edit with visual editor so what you can do right now is you can hover over each of the different items like for example here and You can manually review the text right so that one can be ticked Okay, and then you'll be good to go. Right so you can manually do this and check everything if it's good to go And that's pretty much it. So if you go over here if you want upgrade your plan, and we click on billing So it is free for two thousand words after the 14-day free trial So if your websites kind of small What you want to do is probably you want to exclude certain areas of your website And try to minimize how many words it's translating to keep under the limit now If you do want to upgrade then you can go over here and click on upgrade So in the description below there's a link for the annual plan, which has two months free So you'll see for the billing cycle is two months free Okay, and here I'll probably recommend just a starter plan to get started. You probably want to download Google, analytics to track, you know, where your visitors coming from? So for example, if more of your visitors are coming from a different part of the world Then you might want to get more languages Alright, so here you can just choose it and you can just upgrade and I'm pretty sure you guys know how to do that But that's completely up to you. You can also go back here and use the polling Lang translation tool as well That's a little bit more manual and it does use up more resources on your theme and server and things like that So what I also want to tell you guys is that sometimes you might get an update for the theme, right? So when you do get an update for the theme you've got two options so you can either go to my website Okay, so, hoganchua.com/update All right, and scroll down here and just redownload the same onto your computer All right, so I normally update every week or two depending on when they update. All right, so you can click over here and We can go to the appearance themes So you can also get automatic updates what I'm showing you is the manual way So click over here and we need to activate another theme first. All right So once you do this and you update to another theme your website is not going to look like it was before All right, so it's gonna look quite messy. Ok. So what you need to do is we need to delete this theme over here Okay. Delete it So generally all your settings will retain itself Ok So if you are maybe it will be skeptical or scared then you can also backup your website with a plug-in called updraft plus now if you're with SiteGround They also do like daily backups as well where they backup your whole entire website so you can easily do a one-click You know restore So if we go over here, right we can click on add new then We need to re-upload the theme that you just downloaded from our website the updated one So update this one so themify..it and then click on open install and Then click on activate. Ok, and then we can go back to our website and view that website So everything should be back normal, right? So now the second way is to get automatic updates. So if we go over here Scroll down over here and click the link to the themify membership so what I've shared with you guys is actually a premium theme which I've partnered with themify so that we can share this theme with You guys for free so you can get started to build your own online store Now there are definitely a lot of other tutorials which show you how to use the free theme and for me It's quite restricting and sometimes a lot of people don't like that because a lot of the premium functions You know until you upgrade you can't use it. So that's why I showed you using this premium theme and it's really really awesome So if you do want to get automatic updates you also get support as well so you get I think one year of support and updates and you also get the Add-ons as well and plugins so they have different add-ons and plugins over here, which you can definitely check out They've also got to build a pro. So I think that might be a separate thing. I'm not quite sure But I have the lifetime Club and it's included in that so personally if you're on a budget then you just go with a single theme and you can click on single theme and you can Choose the shop theme you can click into that and This is the thing that we've been using, right? so what you'll get is once you log in you can download the seams and you can download the themify updater and you can put your license key in right so Essentially if we go back to our dashboard. I already installed it so it's the updater plugin click over here and You just put in your username and license key and then that way whenever there's new updates you can Automatically update ok. So if we go back over here You can also check out the support so you can scroll down over here You can start any topics or whatever questions that you have Generally they get back with you within a few hours so you can click on 'theme if I shop Ok, and let's say you have some kind of error where something's not displaying properly They can basically provide you with a fix you can also email me at support@hoganchua.com or leave a comment down in the description below and That is pretty much it. So you can also check out the documentation as well over here Ok, so let's go back on our website So what you need to do is make sure to turn off your maintenance mode if you have that so pretty much That is it for this tutorial You just make sure you log out and and yeah so please drop a like it did take me a few weeks to actually create this tutorial and I hope you guys really enjoyed if You have any questions like any sort of requests? maybe if you guys liked the video then I can try and make a Second part to this video to show you how to really take it to the next level as well Yeah, so, thank you You
