WooCommerce Masterclass 2022 - Build a Full Online Store with WooCommerce | Alexander Oni | Skillshare

Playback Speed

  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x

WooCommerce Masterclass 2022 - Build a Full Online Store with WooCommerce

teacher avatar Alexander Oni, Web Developer & Cyber Security Expert

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Lessons in This Class

54 Lessons (5h 4m)
    • 1. Introduction to the Course

    • 2. Introduction to Domains and Web Hosting

    • 3. Buying Hosting and Domain Names

    • 4. Installing WordPress Quickly

    • 5. Installing WordPress Locally with Local

    • 6. Installing SSL

    • 7. How to create a web mail account

    • 8. Installing WooCommerce

    • 9. WooCommerce Default Pages

    • 10. Creating Shipping Zones

    • 11. WooCommerce Shipping Classes Part 1

    • 12. WooCommerce Shipping Classes - Part 2

    • 13. WooCommerce Download Images

    • 14. Creating a Simple Product

    • 15. Creating a Variable Product

    • 16. Creating a Grouped Product

    • 17. Up Sells and Cross Sells

    • 18. Product Settings

    • 19. Setting up Payment Gateways

    • 20. Announcement

    • 21. Creating Sandbox Accounts

    • 22. Testing Sandbox Payments

    • 23. Setting up Stripe

    • 24. Managing Accounts and Order Flow

    • 25. Account and Privacy Settings

    • 26. Working with Coupons

    • 27. WooCommerce Analytics

    • 28. Section 3 Woo Commerce Design Preview

    • 29. Choosing our Theme and Menus

    • 30. Customizing the WP Ocean Theme

    • 31. Creating the Footer

    • 32. Building the HomePage Part 1

    • 33. Building the Home Page Part 2

    • 34. Building the Home Page Part 3

    • 35. Building the Home Page Part 4

    • 36. Building the Clothing for Men Page

    • 37. Customizing the WooCommerce Pages

    • 38. Responsive Design

    • 39. Final Thoughts on Design

    • 40. Section 4 WooCommerce Functionality Preview

    • 41. Managing WooCommerce Refunds

    • 42. Adding Product Sharing

    • 43. Adding Order Delivery Dates

    • 44. Adding Notification Bars

    • 45. Adding Order Tracking

    • 46. OceanWP Premium Extensions

    • 47. Adding Customer Wish Lists

    • 48. WooCommerce SEO Section Preview

    • 49. Working with Rankmath

    • 50. Adding Product Videos

    • 51. Adding Image ALT Text

    • 52. Image Optimization by Optimole

    • 53. Website Design for SEO

    • 54. Conclusion

  • --
  • Beginner level
  • Intermediate level
  • Advanced level
  • All levels

Community Generated

The level is determined by a majority opinion of students who have reviewed this class. The teacher's recommendation is shown until at least 5 student responses are collected.





About This Class

As more people are embracing e-commerce, businesses have taken to selling their services and products online as well. If you are such an individual or business looking to sell your products online via an e-commerce store and are looking to learn how to create such a store, then you have come to the right place. 

In this course you are going to learn how to build your very own e-commerce store using one of the most powerful plugins known as WooCommerce.

With this plugin

  • Create different kinds of products - simple, grouped, variable and affiliate
  • Create shipping zones and classes
  • Add pricing 
  • Manage customer accounts and refunds
  • Work with coupons
  • Install and configure payment gateways such as PayPal and Stripe

In addition to this, I will show you how to extend the functionality of your WooCommerce store and you will learn how to do the following

  • Connect your store to Facebook so you can advertise your products there
  • Add social media share functionality
  • Create and publish store wide notices advertising sales
  • Add live chat customer support
  • Optimize your images to improve site speed and performance

By the end of this course, you will have learned all the necessary skills needed to build your e-commerce store.

Meet Your Teacher

Teacher Profile Image

Alexander Oni

Web Developer & Cyber Security Expert


My passion is teaching people through online courses in a fun and entertaining manner.  I have been teaching online for about 3 years now and during this period, I have created over 25 different courses on different platforms including my own personal platform - The Web Monkey Academy.

What would you like to learn?

Would you like to learn how to build and manage your WordPress website? Would you like to learn advanced skills that will make you a true WordPress developer? Would you like to learn how you can establish a successful career as a web developer? Would you like to learn the basics of information and cyber security?

 If you want to do any of these things, just enroll in the course. I'm always improving my courses so that they stay up to dat... See full profile

Class Ratings

Expectations Met?
  • 0%
  • Yes
  • 0%
  • Somewhat
  • 0%
  • Not really
  • 0%
Reviews Archive

In October 2018, we updated our review system to improve the way we collect feedback. Below are the reviews written before that update.

Why Join Skillshare?

Take award-winning Skillshare Original Classes

Each class has short lessons, hands-on projects

Your membership supports Skillshare teachers

Learn From Anywhere

Take classes on the go with the Skillshare app. Stream or download to watch on the plane, the subway, or wherever you learn best.


1. Introduction to the Course: Well, hello and welcome to this special welcome us course here on skill share. My name is Alex, and I'm going to be your instructor. So common up, I'm going to show you exactly how you can use Wouk homers to build this store known as the cool store. Fashion is basically stole that sells clothes for men and women. But don't worry if you taking this course because you want to sell all the cancer puts. Maybe it's gadgets, electron ICS, toys, whatever. You can still benefit because all you need to do strip like the exact same principles covered in this course. So the course is divided into three main sections are forming sections in the very first section. I will cover how you can get yourself a domain name. Taken its toll. What press? Hey, goodness told SSL, if you already have those covered by omens, you can skip the first section and move on to the next section, where we will now begin to walk with commas. I will show you how it connects Tokyo commerce, how you conclude yourself different kinds of products. Also, you had a concrete Shippen's own shipping classes, shipping methods. How you can even created him and get ways like PayPal and stripe on your stop and then in Section three is going to be all about the design. How does your stall look like, of course, is that is available important. We will make use off the Ocean WP theme and the good book page Bill page builder to build ourselves. They stole that she'll looking at an end. Finally, in Section three. Volchkova. Enhancing the functionality of Your store It's one thing to have yourself a really well designed store, but it's quite another to have all the necessary functionality to truly make your stole a world class stole. So we will make use of a lot of plug ins for me. Keith. Many of its off reached Don't worry. You don't have to pay for them, but also you how you can use some plug ins to enhance the functionality off your store. For example, I'll show you how you can enable your customers to be able to choose their delivery dates for the orders, how they contract their orders, how they can create wish lists, how they can walk with gift cards and so much more so By the end of this course, you old off learned exactly everything you need to know to build yourself a war class welcome our store really excited to get started. So let's jump right in. 2. Introduction to Domains and Web Hosting: All right, So it is very special section we're talking about web hosting in domains and working with WordPress locally on your computer. Now if you're already familiar with this topics and you don't need a web hosting, you already know how to install WordPress locally in a computer. By all means you can skip this entire section, move on to the next section. Don't waste your time here. However, if you're brand new to web development, web hosting domain names, then this session is going to be for you. In order to take this course, you need to be able to walk with WordPress. Now, this could mean either walking locally on your computer or you actually go the live world where you buy yourself a domain name. You get to sell some web hosting, and then you walk with WordPress live on the Internet. Now there's pros and cons to both sides. The major pros with working locally on your computer as well. It's completely free. You don't have to pay any amount of money. And then second, you don't need internet access so you can walk on your website anytime. It doesn't matter where you are. The major downsides though, is that you're not going to get the experience of working with an actual web host. So you're not going to know exactly how they protect your website from hackers and malware. You may not be able to do certain things like maybe install SSL certificates and so much more. There are basically things that you need to be live on the internet before you can actually do them. So your work and experience with working with what does locally on your computer will be limited. Now on the flip side, the major pros of walking that live on the Internet is that, well, you're going to get all the experience. Your website is going to be live on the Internet. Plus, if you want somebody else, like say for example, me, take a look at your website is going to be very, very easy. You just have to share the link to your, to your domain. And I'll take a look and it's going to be as easy as that. The major downside though, is that it costs money to buy yourself a domain name and also get yourself are some web hosting. But without being said, if you want own personal recommendation, I would always recommend that the live route, get yourself some hosting, get yourself a domain name. I just personally prefer that. But regardless, if you want to go the local route or you want to go with the live route. I have sped no efforts and introducing you to as many options as possible. Let me first of all talk about the live route. Now when it comes to web host, because you need a hosting company to host your website live on the Internet. I have two main options for your site ground and then cloud ways. These are two web hosting companies that actually personally host with our b would say gone since 2012, I joined Cloud ways are 20, 20. Now the major difference between both of them as that Saigon offers you something known as shared hosting. And then they also offered you offer your Cloud host. Now cloud hosting is superior to shed host. And because we've shared hosting, your website is basically sharing resources with websites are across the world. But with Cloud hosting is just going to be your own website. Having a particular amount of resources specifically used by your website, you're upset isn't going to share those resources with other websites. So basically cloud hosting is more superior. With that being said, though Saigon offers you both shed horse and, and cloud hosting, cloud was offers you only cloud hosting. They don't offer you shared hosting. So as a result, with side ground, you can get slightly cheaper alternatives. Like if you go to web hosting, for example, on safe ground. These are the prices, okay, So it starts from $7 per month, 2 all the way to $15 per month depending on which plan you go with. And then with Cloud ways, it's going to be a bit more expensive, like I said, because they only offer cloud hosting. But honestly, in terms of Cloud horse in itself, there among the cheapest that you can find on the Internet. Adele plants that from $10 per month all the way to $80 per month depending on the amount of resources that you want to buy for your website. Now in the very next video, I'll walk you through briefly how you can by yourself, domain names and web hosting with both Cloud ways and sad gone. But let me also mention that I have written extensive articles on both side ground and Cloud ways. I have also made videos comparing both said gone and Cloud ways. Here is one right here, SiteGround versus club who is hosting, which is better. You can check out my YouTube channel, the Web Monkey. I'll recommend that you subscribe as well. So I've made videos comparing site ground and Cloud ways. I have also made extensive tutorials on how to walk in the back-end of both SiteGround and Cloud was this is the one for SiteGround. So I showed you how you can take advantage of the features they offer you like speed, security, or services and so on. Everything is covered in the video. I've also done the same for Cloud ways as well. I've made a full tutorial walking you through the entire back-end of cloud ways. So regardless of which one of the two you choose, I have you covered, I have all the necessary information for you. I have also written articles on my blog and my girlfriend or chronic and check it out where a comeback, a compare both of them. And also by my honesty views about both our web hosting companies in shorts, I can stick my reputation on both Cloud ways and setting up because I walk with them. And the good news here is that if you decide to go with Cloud ways, if you want to buy yourself some cloud hosting, you want to go with Cloud ways. They've actually partnered with them to provide you with a very special discount that you can get to an effect percent off. For the first three months, you simply use the coupon code, cloud 125. But you also have to use my link, which I'll provide in the resources attached to this video. If you can't find the link to let me know and I'll send you another one, but you have to use the link and then you use the coupon code cloud monitoring and 5 to get 25 percent off for the first three months. Now, that's for the livelihood. If only goal law called wanna walk with what is locally on your computer. I've also made extensive tutorials. You can check out my YouTube video titled How to install WordPress locally week samp sample is one way how you can walk with WordPress locally on your computer. But I've also made another video for our local by flywheel. I am so Local by flywheel the S, It's another way how you can work with WordPress locally on your computer. You will find the video. I think the next one is going to be the second one after the upcoming video basically. So I'm going to show you how you can install what is locally on your computer with fly will end. Personally between exam and fly will, fly will fable is a bit better because with flywheel, you can actually generate a live link for your website installed locally on your computer. So if you need somebody to take a look at your website, you can do so with flywheel. So I'll recommend you use fable of a exam. So again, you can check out the video I'll have is going to be further down. I'll walk you through how you can work with flay will Hey, can install WordPress locally on your computer. So with that being said, that's basically the introduction to web hosting and domain names. In the next video, I'm gonna show you how you can actually purchase web hosting, which say ground. And also with Cloud was and also how you can buy a domain name from a site called, named Chip. Thanks so much analysis in the next class. 3. Buying Hosting and Domain Names: All righty. So like I said in the previous video, let me show you how you can buy assault web hosting and domain names with both our Cloud ways and side ground. Let's start off with SiteGround, and you can go to siteground.com. And then right here on the host and you will see web hosting. What hosts in WooCommerce hosting. It doesn't matter. They're all the exact same thing. I'm going to go with what race horse in and innovated. They have three main packages. Startup, grow big, and then go geek. Now, if you are non-personal recommendation, you wanna go with grow big because we'll grow big, you can actually install as many websites as you want on that single hosting account. With startup, you're limited to just one single website. So keep that in mind. Now with Colgate and grow big, obviously you see the differences. With Gauguin. You have access to more resources, more speed, more disk space, and so on. So it all depends on how much you can afford. And I'm going to go right here, click on Get plan. And then if you have a domain name that you've already bought from another website, you simply go with, I already have a domain and then you proceed from there. But let's just say, for example, you don't have a domain name. You want to get yourself a domain name. Well, you come in here right now and you type it out. So I'm just typing something ridiculous because I know no one in the world has this domain name right now. So I'm going to go ahead now click on Proceed. So Saigon will check to see if it's available. And of course it's available because no one in their right mind would buy such a domain name. So you simply fill out information right here, put out your email information. Now, very, very, very important. Let me show you something right here where you have the data center. Automatically, it will default to your physical location, but you want to make sure that it's actually accurate. Now it's sediment to Asia because I am actually in Asia right now. But depending on where you live, you have several options. You want to choose the datacenter that is closest to your physical location. So for example, if you were in India, the quizzes would be Singapore. Asia does the closest star to India, and so on. The reason why is because the closer you are to the datacenter, the more, the faster you'll be able to access your website. So simply choose the correct data center. And then of course you can go with 24 months, that a six month and so on. Right here. They do offer additional features like domain privacy and also the side-constraints. Can I in all honesty, you don't need them, okay, just just ignore those two and just buy your domain name and web hosting. And then you'll receive an email and then you can proceed from there. Of course, don't forget to check out my YouTube tutorial on how to access and use. All the features are Saigon offers you in the back end. Now with Cloud ways launched and I need to mention is our big cloud ways. You can have buy yourself a domain name. They only provide you with cloud hosting. Our speaking of cloud hosting, I nearly forgot with SiteGround. They do also offer you cloud hosting. Don't get me wrong. It's just that their own cloud hosting is a bit more expensive than that of cloud way. So if you're looking for a cheaper alternative, cloudless is your answer. And yes, they are actually quite good with their Cloud host and as well. So in Cloud ways, you're gonna go over to price in and you will see the different options that they have. Cloud-based themselves don't actually offer you the cloud service. They partner with other companies. So right here you have digital ocean lymph node vaulter, AWS, which is Amazon and then Google. And of course, Amazon and Google are the most expensive as you can see, I mean, with Google you can go as high as $225 per month, which is insane. Digital Ocean is by far the most popular. It's also what I use. So if you're gonna go with cloud hosting, our command Digital Ocean and innovator. You choose whichever one you can afford our document at the very least, go with the 22 dollars per month at the very least. And then you can click on Start free. They'll offer you three days free trial. But don't forget though, why here you have to fill out your name and all that. You have the link for God, a promo code when I click in there and then add your promo code cloud monk 25 to get unfavorite and represent off for the first three months. Don't forget to use my link inlet to take advantage of that promotion. And then I believe with Cloud wisdom, you'll have to verify your identity. So you may need to take a picture of your ID card. But as your line says to Java's line sensor, your passport, things like that, you send it to them and then within an hour or so they'll confirm your identity and then you get access to the host. And of course, like I said, don't forget to check out the YouTube tutorial where I walk you through how to use the Cloud ways back end. Now I know you said earlier that we can do is you cannot buy a domain name, the only offer you cloud hosting. So what's the alternative? You could buy your domain name fungicide ground, but a cheaper alternative would be named Sheep.com. Or you can buy domain names for really, really inexpensive of hormones in here. So as an example in here, again, I'm going to type in something ridiculous. Hdf is df.com. Let's go ahead now search for that one. So of course named tuple check and verify that it does. It's available. So let's wait. So, let's wait, let's weightless weights. Okay, So you can see right now it is a Ford. It is available and it's only a dollar per year. So I'm gonna go ahead now, add down to the cart and then proceed to checkout. I buy the domain name and get my e-mail and I am in. Now, the question you will have here obviously is you bought yourself a domain name from named cheap. You've gotten yourself cloud hosting from Cloud ways. How you connect both of them, right? Well, it's very, very easy in the YouTube tutorial, I show you how to do so, but Cloud ways also have an actual document of ITA. Explain to you the entire process. You have to create something known as an a record on your named Chip account. They show you all the steps in here. It's right there. It's very, very, very easy. I guarantee you it's not going to take more than five minutes. You simply do whatever you do, what they tell you to do right here. And then the rest is history, as they say, you will easily propagate your domain name from them, shipped over to Cloud ways. Of course, if you run into any issues, if you run into any difficulty, you can contact how the ways their support is also very, very good and I guarantee you that they will be able to help you out. So if you have anymore questions about SiteGround, Cloud ways are named ship, of course do let me know. I'll do my best to answer your questions as soon as possible. So hopefully I've been able to give you enough guidance on how to get started with web hosting, domain names, southbound, cloud wars and so on. Thanks a lot fortune. And of course, I'll see you in the next class. 4. Installing WordPress Quickly: I'm making this video to quickly show you how you can install what press on the website on both side, ground and Cloud ways. Now, of course I covered both in my YouTube tutorials, but I think there's a lot faster for you. Or you can watch you to, to, to ask for more information like backups, security, ssl certificates and so on. But let me show you how you can quickly get to set up and running on these two platforms. Now if you're with SiteGround, once you've logged in, you will see websites up here on your main menu. You click in there. And then right here, just click on new website. Up here, you click in there, choose your hosting plan. Let's continue. Now a writer, you have three options. You can go with the new domain where you'll have to buy a new domain name again and then proceed. Or you can go with your existing domain, click on select, and then choose your domain in that you bought from site ground. Or you can go with temporary domain where safeguard will create a temporary domain for you. It's free. You can see right now it's good at this one for me. I'm going to click on Continue. And by the way, the process from this point on is the same for either the temporary domain or the existing domain options. Right here you're going to click on Start a New York City. Click on select right here to install an application and right-click and go with what quiz? Or if you're taking a WooCommerce course, you can go with what? Woocommerce as well. But our community, those COBIT WordPress right here, you click on Select, and then you just set up your login details, you enter your images right here, your password. Click on Continue. And I should have entered an actual email address in here. My apologies or kilometers quickly fill that out. K. Click on Continue. And you don't need to add the sides, can I? You don't need them and just click on Finish. And there you go. So right now said God will create the site for you. Let's move on to Cloud was on. Let me show you how you can add your website. From here, from servers you want to go over to applications on your main menu up here. Okay, So from here you click on Add Application, the green button. Okay? And then from here you're going to choose your server that you have with them. You click on Add Application. And then from here what you're gonna do is you select the application. You want to go with WordPress version 5.6. It may be an updated version dependent on when you're watching this video, but currently it's 5.6. So 5.6 now you can name your website, so I'm just going to call my own test website just as an example. Test web site project. Just leave that as it is and then click on Add Application. And there you go. So psycho, I'm sorry, Cloud who is right now, is installing WordPress on the website. And so you can see right there, it'll take approximately two minutes. Are Saigon has already finished. So for me right now you can go to the Access WordPress admin. You click on the button right here, and it'll take you straight to the backend. So you might, you might see this one and telling you that, hey, this site is not secure. That's because you've not yet installed an SSL certificate, but it's fine. You can go ahead and proceed to the website. Okay. So you can you can ignore the LL1 in and there you go. So with segment specifically, they do have the STL wizard. You can just click on exits to exit the wizard and take you straight to the back end. And there you go. So from, from here right now you have what was installed on your website. You can then proceed with the course, are with Cloud ways. Let's see. Okay, it's gonna take about a minute and I'm just wait for this one to finish. Now once again, my YouTube tutorials on both side, ground and Cloud ways. We'll cover everything, everything they need to know from Kuwait. An e-mail accounts are insulin, SSL certificates taking backups are, and so on and so forth. Then go ahead and close this too. And there you go. So fortunately, cloud, which has finished installing WordPress, so you're going to go back to your applications. And then right here you should see the name of your website. Right here you click on Test Website right there. Just click on the link. And then from here you will see now the application URL right here. You will have the button to launch your website. And there you go. So for me right now you can see Claudius has a soul bought quiz on this temporary domain. You can now simply from here, go ahead and access the backend WP dash admin. And there you go, you simply login, provide your username and your password, and you're good to go. So hopefully, this video has shown you how you can get Wordpress installed on the website with both sat down and cloud is you have any questions? Of course do let me know. I'm more than happy to answer them. Thanks for watching. I'll see you in the next class. 5. Installing WordPress Locally with Local: All right, it let me show you how you can install WordPress locally on your computer using local by flywheel. So you can go to local WP.com and it's free for the most part. So what you wanna do is you simply click on the download button up here. And then you can choose your platform whether you're working with a Mac, Windows, Linux, and so on. And walking with windows, I'm going to choose Windows. And then they can simply go ahead and provide my firstName, lastName, walk email, and then phone number and then get it now. So I've already done this before, so I don't need to do so again, just simply go ahead and provide a first-name, all these details. Then click on Get it now. And then you will get your download link to download local on your computer. And it says a consumer, it now I have already downloaded the local application. It's about 416 megabytes for the Windows PC. So I'm gonna go ahead now and install it by double-clicking on the file itself. And it may take a while for you to see this particular window popup. Just be patient, but it will pop up eventually. So right now you can install flywheel for anyone or just to you on a computer. I'm going to go with our only for me, so I'll click on Next, click on Install. And there you go. It's very, very, very straightforward. Let's just wait for a few more seconds for this to finish. It's a little bit larger. It's going to be about 1.5 gig once you've finished installing the application. And it will only get bigger and bigger with the more our local websites that you create on your computer. Because keep in mind that you will be storing all the files, the themes, the plugins, everything that make up your websites will be stored locally on your computer, so make sure that you have enough space in your hard drive. Okay. So this is taken a little bit longer than I expected. So what I'm gonna do is I'm going to pause the video and it seems to be picking up right now. Okay. Okay. So I knew it's usually doesn't usually take that long to install, But for some reason maybe because it knows I'm recording, it decides to take it bit more time. I don't know what I'm going to go ahead now and simply click on Finish and we can run our local as well. And I'm going to show you how you can now begin to create websites using local on your computer. So right now, I'm just come down here, you will see the local symbol right here, that's for local down there. So this is basically the main interface. And now we can create a new site by clicking on the green button right here. Let's go ahead create a new site. Allergists call this one. Blog are just as an example. Okay, This is going to be the name of our website. You do have the advanced options right here, but you can choose that local site domain, the local site path, and then whether you want to quit aside from blueprint, you don't need any of this other command, you just ignore them. Just go ahead and click on Continue. And anyway it here you have the preferred options or you have custom. This is where you can indicate the kind of database software you want to use and so on. Again, if you click on costume. Or you can choose your PHP version, your web server, your database. Unless you know what you're doing, I would recommend you simply go with the preferred option. Click on Continue. And now you can provide your username. I'm going to provide my Islam as Alex. And then the password, I'm going to provide a strong password all the same. And our WordPress email, I'll just go ahead and add my official e-mail vide here. One kilogram book com. And of course you also have advanced options where you can indicate if this is a sub-directory or a sub-domain. Where do they live? That's all those click on. No. Let's go ahead now and simply add our site. And right now, local is 18. The website locally on our computer. It's not going to take that long. So let's see. I'd say studying up the side services. And so you might get in all warning signs like this in Hey, you know, this program is trying to access your process or things like that. Just say yes. Okay. Make sure you Gwen permission. If you have a firewall that's also active on your computer, on your Mac or your PC. The firewall might also say, Hey, you know, this particular application is trying to access to files and make changes. It's safe, Don't worry, just go ahead and grant access to the application. So you can see right now it is downloading WordPress. It's now add in WordPress. So I'm gonna pause the video right now and simply resume on what person has installed and consumer hit now. Just as I said, I was going to pause the video. It quickly went went ahead to finish installing. So there you go. We have WordPress installed successfully on our blog or website. And then right here where you have your overview or you can make certain changes. So right now you have the same domain in here, blog of the local. You have the SSL, auto committed, go ahead and click on trust. So that's your browser, will trust your local upset too long. It's DPS. It may not always work, but in all honesty, it's not going to matter for the most part because you're still working with files locally on your PC. Alright? You don't need to change anything, any HIV or web server PHP version, the one-click admin, it's kinda disabled or recommend that you enable it. Let me show you what it does. So right now, right here, if I go to the Admin button right here, I want to access the backend of my site. You can see right now I have to provide a username and a password. But let me go back to fly. If I go ahead now and enable this for myself, who's the admin? And I say Alex, if I go ahead now and click on admin automatically right now, you will see that I have now been logged in. So this will depend on whether or not you're the only person who uses your computer, even if there are other people who are competent and you trust them. This is perfectly fine. You don't need to provide your username and your password because you're still working with files locally on your computer. So I'll highly recommend you go ahead and activate the one-click. Adamant is just, it just makes things so much more convenient in easier for you, okay? Right here you have your database, okay? And you've ever need to access the database for your website, you simply click on the Open. Add me now. Okay, I've clicked in there and right there you can see I have access to the actual database for my website. So if you ever need to access your database, this is how you would do so with local. And then you have utilities as well, which yeah, we don't need to walk with these. You also have tools where you can buy things like live links instantly load link check Athens like that. You also have the image Optimizer option that will allow you to optimize images are with local. But in all honesty, there are plugins that you can also use from what epistemically that can help you with this. Okay, Just a few more things to mention with you are the Connect button right here. This walk. Specifically if you're hosting our width WP Engine, you can easily transfer your files to WP Engine. You simply login with your oldest and then follow the prompts is very, very, very convenient. Unfortunately, it's only, there will be ending right now and that flow will, is partnered with hopefully in those future that will partner up with other very popular web hosting providers like an Cloud host and Alonso Cloud ways and siteground and so on. And then right here you have the add-ons again. You don't really need to walk with any of these. And then right here you have the GitHub button, and so on. Down here, of course you have the plus button to add a new site. If you want to optimize your account, you're going up good Two Pro or login to the hub if you want to. And then of course you have your menu buttons right here. You can add a new side. You can import a site as well. And you can also check for updates. Okay, let's go back to the blogger site and I wanna show you something very, very, very important. If you need to access the files that make up your website. I'm not talking about the database now. I'm talking about the actual files themselves. Right here underneath the name of your site, you will see this link, this arrow. You simply click in there. And this will take you to the folder containing local and all your files for your websites. And then from here you want to go to the app, open up public. And now right here you have access to the core files making up your WordPress websites. If you go to WP content, for example, right here, you will have access to your plugins, your themes folder, and so on. So if any, to access the files off your website locally, this is how you would do so. All right. If you more things, you can choose to stop at the website if you want to go on a break and resume later, is simply click on stop site right here. Now let me show you one not a very, very cool feature or with local writer, you can actually enable a live link for your site that will allow people to access it on the Internet. So right here where you have the live link, you can go ahead and I'll click on Enable. Okay? So what this does is that it's going to create a live link for your sign. I'm going to go ahead and click on Copy. And then I'm going to go back to my browser icon right here. And I'm going to paste and go. And right now you can see, I can now access my blog or website via the Internet. So if you ever need to access your site via the Internet, you can do so by creating a live link. But of course, keep in mind that you will need internet access in order to do so. Okay, I'm gonna go ahead now and stop everything. And if you want to delete your website or you've created, you simply re click right here on the name of your website. And then right here, you will have the Delete button. You can rename the button. So you can rename the side as well. You can clone the side, you can start the science, can open up the folder for your site as well, and so on and so forth. So that's pretty much how to install WordPress locally on your computer using local. Thank you for watching, and of course I will see you in the next class. 6. Installing SSL: All right, So here's a major update for you, and it turns out that Google is actually going to start punishing. Webb says they don't have the H T. T. P s encryption. Now, I heard about this a few months ago. I heard that Google was going to stat punishing sites without the https encryption. But a lot of people said it's not true and that we shouldn't bother about it. But it appears that Google is actually going to go ahead to do that and as because one of my sites in here, this is the actual say, that I used to build the very first version of this particular course. I can say right now that Google at saying this site is dangerous and that is because I don't have any https encryption on the site. So just to be on the safe side, I think it's best that I show you how to encrypt your website and moving forward. I think whenever you get a new site should always go for the eight https encryption. So here's what you want to do, OK, hopefully, if you its side ground, it is very, very easy to encrypt your site. We're going to have to install something called s s Ill. S S L C stands for secure sockets layer and it's used to encrypt your data. So if you're with side ground, all you would have to do is and you'll see Panel Calm down, Teoh. Alway you have security and then click on. Let's encrypt. Okay, If you're using a different web host, they should have something very similar. You can contact them. Tell them Hey, you know I want to get SSL on my side. How can I do that? They should be able to direct you anyway, coming back here in here, you choose the domain that you like to encrypt. And in this case, I would like to encrypt the blawg. Does that monkey Orlando calm And I'm just going to change the email address in there to my actual email, and all you would have to do is just a click on Install and SSL will begin to be installed on the site. And I think what's really awesome about this software is that it's free usual. In the past, SSL used to be quite expensive. You would have to buy certificated SSL certificates and this was you usually about $49 or $50 or something like that. But it appears right now that we can use the let's encrypt for free, which is just awesome. So this is gonna take about two minutes or thereabouts. So I am going to pause the video and all the resume the video wants. The encryption has been completed. I don't actually, I was just about the pause, the video, and then the installation finished. Can you imagine? Okay, cool. Awesome. So it's finished. So we now have SSL on our site now in here. Originally, I tried at in the https before I encrypted the site. And as you can see, I got this message. So if I refresh the page now, now you can see I have https and we don't have any more Are able messages when you try accessing the site using https. So that's exactly how to encrypt your site using Ah, let's encrypt once again. If you're not using side ground, be sure to contact your Web host and tell them that you would like to encrypt your site. You would like to get some ssl onto your sense. So that's how to and crypto Website. Thank Fortune and I will see you in the next class. 7. How to create a web mail account: if you try distant your sub tomato right now, you should see a very similar message. 403 forbid in a raw and basically, all this means is that you don't have any content yet installed on your science. Your science is just blank. It's just there. It's a domain name, but there's nothing on it. So you should be saying something very similar, but we'll fix this later. Right now, I want to show you how to create a Web mail account for your website. So in here, inside, gone in the sea panel, I am going to look for a very small section, cold mail and all click on email accounts. And now in here, I'm going to select the sub domain, which is blogged that the monkey only the calm. And I'll just add my user name, which is Alex, and I'm going to add my password, which is very, very, very strong the strongest password in the whole world. And I am just gonna click, create account and it's a Z Alex at blawg Dr Web monkey on land that come has been qui eight head. Awesome. So what I'm gonna do is I am going to copy ups. Scoop, scoop, scoop. So where is it? Ah, the page disappeared. Okay? I always covered over here. It's a symphony in here. Them just copy that, Alex, at the blogged about the woman coming to calm. Now I am going to go back to my sub domain, and at the very end are we add 1/4 slash and then say web mail. And I am going to paste the email address, and I am going to add my password, and I'm gonna look in Save that. Now, in here you have are the trace of using three different types off software forward in your mail. You have hold Van Cube squirrel male. So if you likes girls, you can go with the of this option. I am just gonna go with run Cuba because that's my preferred option. So we'll click in there. And basically, I now have access to my Web mail account. So whenever anyone emails you using your Ebola countess's where you would receive the emails and it's just like any other email client against, like, Google is like a G mill. Yahoo, mail, Hotmail, whatever male do you. So that's basically how to create Ah were mail account from your Web hosting company. So, as usual, if you have any questions, feel free to reach out to me or you can even reach how to Europe host. Tell them that you would like to have a Web mail account and you will be sure to help you. Sort Thank you for watching Jeremy. The next class Will will finally finally install what press? So I will see you then. 8. Installing WooCommerce: All right, so let's get this show started and let's go ahead and install will come us on our warp perception. Right now, this is the store I'm gonna be walking with or the website brother. It's called the Cool Store. Cool quotes for every man and woman. All right, so I'm gonna come over here where they have the UML add 1/4 slash and in WP dash admin. That's to take us to the back end. And then if I'm gonna go ahead now and simply add my user name, which is school stole and, of course, my password, and I'm going to log into the back end, it is gonna take a few more seconds. Unfortunately, my Internet service has been kind of a wacky Are this past few days, So I do apologize for the delay. All right, so it's been good and access to the back end, so I'm gonna go moving it away, have the plug ins, and I'm gonna go ahead now and add new plug in. Now, over here, I'm gonna go ahead and typing will come us and let's see what we have. All right, So I've got will come. That's Why here? I'm gonna go ahead now, install. And after installing, I'm gonna go ahead now and activate the plug in light. That's pretty much the standard for WordPress. You installed a plug in, and then you activate the plug it. Right. So this is the new set up, Wizard. Full welcome us four point. Oh, I'm gonna go ahead and click on. Yes, please. To get started with the installation. Okay, so from here, I'm simply gonna calm down over here, and I'm going to click on this link down here that says proceed without jetpack and welcome a services. Now, jetpack and welcome A services do offer you additional functionality, like security, speed and things like that. Well, in all honesty, I personally don't like jetpack because I feel that it actually slows down your site and many of the services. You can get them from auto plugging, so I'm gonna go ahead and proceed without jetpack and willkommen services. All right? I'm going to ignore this and simply click on continue and all right, so in here, right now, I'm just gonna add an address, and I'm gonna go ahead and choose the United States, and I'm gonna come all the way down here to Maryland and I'm gonna go ahead and click on. Continue. All right, so for me, we have to choose what industry are store operates. And in him going to go with fashion apparel and accessories off this leads, I'm gonna click on continue and in water projects. Bill Bailey said, Well, mostly physical products, and I'm gonna click on Continue. How many eggs you plan to sell? Let's it between 1100 currently. Solin elsewhere? No. All right in here. We've got three additional options for Facebook marketing, Mill champ and Google shopping. I'm gonna go ahead and check thes two, but I will leave the mill chimp option on because we're gonna build a list with Mill chimp . Something to click on continue. And because we've chosen Teoh, activate the middle chimp. The EU plan is gonna be installed for us automatically. I'll show you in just a moment. And from here right now we have to choose a theme that we're gonna walk with will use a different thing later. But for now, let's go ahead and use the storefront theme. This is actually the thing provided by walk amongst themselves. I'm going to click on Choose and you consider this. A storefront was installed and activated on your site. And this will bring you automatically Teoh this page and it says, Well, who? You know you're almost there. Let's get going. Continue. And there you go. Pretty much finished the basic installation of all commas, and we can now go ahead and begin to make some other changes. But if I come down here to plug ins, I just want to show you something real quick. From here. You will notice that we now have the milk informal Commons plugging already are active on our side because we chose to allow local monster installed a plug in on our behalf. All right, from here, I know you would also see Whoa. Commas and you will see analytics analyst exists. The new feature provided with Luke almost four point. Oh, where you can track things like your revenue number of products sold. Things like I will take a look at that a bit later, But from welcome ass over here, I'm gonna jump down here to where you have settings. Click in there and basically from here, you have your store address where you can always modify and then general options in here, all the commander that you fill this out are truthfully. So you're so into all countries or your sense of a specific countries since like that shipping locations as well the default customer location. You can go with geo locate, which will involve map in, but you can just stick with the shopper base address for now. You can changes later on. You can enable tax rates and calculations if you want to. But for the purposes of this video, I'm not gonna be walking with tax rates. So just leave this box on Checked. We will be walking with coupon codes. I'll treat how to walk with them so we'll keep this box checked, and then you can calculate coupon code discounts sequentially. So basically concede explanation in here when applying multiple coupons are pretty for us keeping to the full price and then the second coupon to this kind of price and so on. This is very unusual. I haven't seen too many stores that apply this kind off system, but hey, if you want to go ahead and do that, by all means just check those books, and that will be that. And, of course, currency options. You can choose your currency, the position, things like that. Let's go back up here and OK, so that's pretty much it for the basic insulation. Off off Welcome US Journey of Earnings video well will now go ahead and begin to create our shipping zones. 9. WooCommerce Default Pages: One thing I forgot to mention in the previous video is that when you install will commerce, it will automatically create several pages for you. This would be the checkout page, the cart page, as well as the my account page. And you have to assign those pages to war comma. So what you're gonna do is you're going to go over to your advanced stab where you have your blue comma settings. And then right here you will see the cop page, checkout page and then my account page. All you have to do is to simply click on the dropdown box right here and then you will find the cock page, the checkout page, my county just assign them to their respective pages. That's all you need to do. Let me also mention that this is actually a new video I'm uploading to the course. This was recorded after the cause was already published. So please don't be alarmed if you see that in my backend and now have r and commands. I have elemental, I have cube, and so on. Don't worry, these are installed on much later in the course and I will be discussing all of these plug-ins in full detail. But for now, I want you to go to your Advanced Tab and then ensure that the pages I've been assigned to the cop page tech, AAC page, and the my account page. Now in a situation where you don't actually find the COP page, checkout page. And in my account page, you'll have to create them by yourself manually. So you would just go to pages, click on, add new and innovative. For example, you will type caught for the title and then for the content of the page. These are the shortcuts that you need to use for each page. So for example, the cod page would be a welcome us onto the cart. Check-out page will be welcome us on the checkout and so on and so forth. So all you need to do is to grab this code right here, including the brackets as well. Just copy that, come over here and then simply paste that. And then you go ahead and publish the pivot. This will create the cod pitch for you using the word commerce on the score card shortcodes. So you can do the same thing for the checkout page and my count pages as well. Of course, if you have any questions about this, be sure to let me know. Thank you for watching. I will see you in the next class. 10. Creating Shipping Zones: welcome back and people's video was successfully installed. Welcome us. But now it is time to create shipping zones for customers. So to do this, I'm gonna put on the shipping tab right there. And from here, I'm gonna click on add shipping zone. So because we're based in Maryland, United States, I'm gonna go ahead and add the very 1st 1 called Maryland and what you have zone regions, check this. I'm gonna go with us. Say, actually, sorry, Mabel and first Maryland, and then you can see why he, Mabel and United States. I'm gonna choose that one. So basically, the idea here is I want to create free shipping for all customers within Maryland. All right, so to do that, you also this but in your essays at a shipping method. Now, if you click on shipping method right here, you've got three basic options. You can go with either the flat weight, our first ship in all local pick up. I'm gonna go with a free shipping. First of all, let's click on add the shipping method. O k. This should pop up. Right? So here it is, right now. Free ship in. She can click on edit right here. And basically over here, you can set some sort of a requirement that is to be fulfilled before for shipping coming offered. So you can go with a valid for shipping coupon, a minimum order amount minimum order a month or keep earn minimum or amount and a coupon. I'm not gonna go with anyone on any one of these options as long as you're based in male and I'm gonna ship you their product for free. So I'm going to go with no, none available and save changes. And there he goes. I'm gonna go go ahead and add one more shipping method, which would be, well, it's not really shipping X, actually local pick up. So if customers are within Maryland, they can always come down to the store and pick it up. So I just go with local, pick up and add the shipping method, and that's pretty much it for customers in Maryland. Now, you could also limit a specific zip codes. If you want to have, that is link right here. Click in there and you can just simply come in here and begin to add the zip codes. If you want to be more specific with your our local delivered local deliveries. If you wanted to, just go ahead and ah, click outside of this. All right. So just leave Maryland, United States. I'm gonna go back to my shipping zones, and we're gonna do right now is we're gonna create another ship in zone now for the rest off the United States. So let's click on Add Shipping Zone and we'll call this the United States. And let's also see and Canada all right, it's a neighboring country, so well, coming here right now, typing United States will also add Canada as well. So for all customers within Canada and United States, we're gonna provide them with a new shipping method. So let's go ahead and now click on add shipping method. And now we're going to go with the flat. Wait, So let's click on add shipping method. Okay, so from here, right now, I'm gonna go ahead and click on edit for the flat weight. So in here, you've got the option off providing tax for the ship in or none. I'm gonna go with non. So for the cost in here, let's go with 29 99. I think that's Ah, Fairmont. So let's go ahead. Save changes. And that's basically it. So we can offer a flat weight after the $99 to anyone based in Canada or the United States . Let's go ahead and add another ship in zone, and this one is basically going to be full. Let's say for you up. All right, let's add you. Better use. Go with South America. How about that South America? Because South America is closer. Student new to United States than you appear. So we'll go with South America and then select regions. I'm going to go with simply South America. And there you go. So let's go ahead now and add a shipping method floodlit again. And this thing is going to be a bit more expensive. Will go with, Let's say, 49 99 for this one, right? For nine 99 let's save changes. And there you go. All right. So if it go back to the ship in zones in here, you can see we've created three Maryland for local United States and Canada and in South America and and finally in here. You do have a default Shippen's on coital automatically, which is the locations not covered by your other zones. So this gives. Right now you're looking at other countries. Let's say, like, for example, those in Europe, those in Africa, Asia, Australia, we haven't even actually added for Central America or even Mexico. But all just ignore those for now. I mean, if you're building your girl so you can go ahead and, of course, add those to your as you've been zones. But for the purposes of this lesson, you understand perfectly what I'm trying to do here. So we'll ignore those. What does come down in here right now? Click on manage shipping methods for the rest of the world, and I'm gonna go ahead and add a shipping method. Flat waits. Let's go ahead at that one. And we'll just make this 1 15 9 19 9 Que 59 99 that you go The civil changes and that's basically it. Okay, so we do now have full shipping zones Maryland, united in Canada, South America, and then the rest of the world. In here. You've got shipping options cooking there, and in here right now, we can make some further customization. So, for example, enable the shipping calculator on the cock page, or you can hide shipping costs until an address is entered. I prefer the hide shipping costs until and address is entered and then shipping destination . Basically, it defaults to the customers 1,000,000,000 address, which is the usual set up, So we'll go ahead and keep that one, and that's basically it. I'm gonna go ahead now, save my changes, and there you go. That's it. We have successfully created our shipping zones German over next area where I'll show you how to create shipping classes. 11. WooCommerce Shipping Classes Part 1: Welcome back. Hope you having a great date and abuse video is successfully created Our ship in zones for Maryland, United States and Canada, South America and the rest off the world. Before it took about shipping classes and what they are, I'm gonna make some changes because over here, we've got flat waits for United States Canada flat wait for South America are flat rate for the rest of the world. I want to change the names so that they're more descriptive. So let's do this. I'm gonna go ahead now click on edit for United States and Canada and then for the flat. Wait, I'm gonna go ahead and click on edit. And let's just change this to something called That's a Domestic Rates. Okay, let's go ahead. Save changes. Let's go back to the ship in zones and I'm going to change the 14 South America as well. Let's edit. So let's just let's just say South America rates, I guess, save changes And then finally, of course, for the rest off the world, let's click on minded shipping methods over here, And I guess over here we'll just call this the International Late right into national rates . Let's go ahead. Save changes. And OK, so now let's talk about shipping classes And what exactly? All the what is a ship in class. Now, to explain this, I'm gonna come over here to Amazon and take a look at this. Okay, we've got plastic cups, all right, but we also have glass cups. Now, obviously, when it comes to ship in shipping, glass products will be more expensive than shipping a plastic cup because glass cops obviously are very sensitive are products where they can break easily. That fragile plastic up, on the other hand, don't require as much care. So as a business you might want to charge a bit more for products that fall on the A sitting kind off category. This is where shipping classes come into play. So you can Kuwait special shipping classes for many parts of very heavy. But it's a very expensive products of a very fragile and then add extra charges to ship those than the regular products. All right, so let's do this. I'm gonna go ahead and close Amazon and let's come over here to welcome us. And let's add a very forced our shipping class because I'm gonna go ahead in here, add shipping class and for his name. Let's just go ahead and say dedicates just as an example. Right? So for my reference, I will see wristwatches and ah, jewelry. Alright, Jew will read. Okay, so these are gonna be the two categories off products that will be bit more expensive to ship because they are expensive products. So let's save this. Should be in class for delicates. All right, Now, if I go back to my ship in zones and then I come down just to start off with United States and Canada first of all, okay, if I click on edit in here where you have the domestic rates, if I go ahead now and click on edit, take a look at this. Now, over here, you know, have the special category now for the shipping class costs that has been produced. So for the delicate shipping class course, So any product that falls under the delicate class, how much you'd like to charge to ship them to customers within the United States and Canada ? I could easily come in here right now and say OK for the 9 99 right. However, there are most of physically ways off charging for such products over here under the Wu commas documentation specifically for shipping costs. In here you have the advanced costs, so you've got place hold as basically variables you can use for your car collisions. You've got quantity, and then you've got fee and an under fee. You can add additional arguments like percent age minimum fee, maximum feet. Here's an example of what I'm talking about. So we have this car collision in here. This formula basically, and it's basically saying, First of all, you would charge a base shipping cost off $10 plus $2 for each item in the court. That's how you can do this with this formula. There's an even more advanced formula in here where basically, you can charge a based shipping cost off $20 1st plus 10% off the total order, which is at least $4. So with those variables in here, quantity, fee, percent, minimum fee, maximum fee. You can very flexible with how you want to charge for your delicate items when it comes to shipment them. So I'm gonna go in and simply grab the very first option in here. Let's copy that. Let's come back down in here and I'm gonna go ahead now and paste this. I'll make some changes. So rather than just handle as I will no say $20 for the base ship and feet and then an additional $10 for every item Arben shoot for the notion class cost will kill this. That's 29 in 19 9 other costs. We no longer need this so we can remove that one. So this is how it's gonna walk right now. So any orders that are delicate shipped to customers within United's in Canada, this is how much you charge them and in for the regular products that don't have the delicate shipping class are 39 99 for them. Now, finally, in here, you've got a calculation type. Are you gonna go with per class or poor order? The idea he had been that Okay, what if a customer in Canada buys three products that fall under the delicate class, but then also buys five products that fall on the the regular class, so don't have any class at whole. How would you calculate the total cost are you gonna go by class and then say OK will charge shipping for each shipping class individually, or you'll simply use the most expensive shipping class now, obviously going pro Consul, be more expensive because now you'll calculate based on All right, how much for the delegates costs. And then how much for the non delicate cost and then combine both to get the total cost order. You simply say, Okay, we'll just charge you with the delicate shipping cost because that's the most expensive class. So this really depends on how you want to go about this. I'm gonna go ahead and simply choose the per class times a Perodua. All right, let's go ahead, see what changes. And there you go. Awesome. All right, let's go back to the shipping zones and let's come back down here to Maryland and why? Because right now as it is, we're offering free shipping toe all customers within Maryland. Right. But do you still want to offer free shipping to your customers in Maryland? If the order your delicate items? I don't think so. So to fix these, we're gonna come back down in here right now, and we're simply going to remove the for shipping. So no more fish before customers with in Maryland. OK, we've solved one problem here whereby customers who want to receive their products that delicate products in Milan they will have to pay. But then, what now happens to the customers who live in Maryland and order products that are not delicate? We still want to offer them for shipping. What do we do? I don't know. I'm joking. I know we're gonna do is we're gonna add another shipping method called the flat weight. Add that method. And now in here, Let's go ahead and edit. So for me right now, I'm gonna come in here right now and say OK for delicate shipping class cost. Let's go with the regular $10 into the lost for every item in the cart. And then for the no shipping class cost that's basically going to be a zero. And then calculation. Thibodeau's go with our order. And there you go. So this Well, right now we can offer for ship into our customers in Maryland who are all the windows, the regular products. But then we can now also charge them if they're ordering the delicate products. So there you go. I'm gonna go ahead now, save my changes. And there you go. So that's before shipping classes. Jimmy. In very next video, we'll talk about some more shipping classes. 12. WooCommerce Shipping Classes - Part 2: welcome back in the video is successfully created shipping classes for the delicate products. However, I do have one question for you as it is right now. We do have the special fee off $20 then $10 for every item for the duplicate shipping class for our customers within United States and Canada. Right? But what if you wanted to offer free shipping for certain kinds off products to our customers in the United States and Canada? How old you do that? How would you be able to offer free shipping for setting kinds of products to our customers within its It's in Canada. I'm gonna pause the video right now and give you a few moments to think about it. Okay, So have you thought about it? Well, if you have, I'm gonna tell you the answer right now. And it's been a simple you create a shipping class. It really is that easy. So let's just go ahead right now. Click on shipping classes again, and what I'll do right now is just to add a new shipping class and we'll call this free freedom. No, just just free free stuff, okay. And the description will just say free Shippen for, uh, customers in U. S. A. And Canada. Okay, let's go ahead now and save the shipping class. Okay, So now if we go back to the ship in zones and I come back down here to netizen Canada, click on edit. And then I added the domestic rates down here right now. You can see we now have the free shipping class cost. And obviously, I'm not gonna come in here right now and add Z role, and that is pretty much it. That's how you can offer for shipping to customers with Indian s in Canada for setting kinds off products. So there you go. I'm gonna go heads of my changes and voila, a lot. So at this point, if you're building your store like your real store, although commend, you take some time and plan properly how you want to manage your shipping, your shipping classes, the zones and of course, the costs take a time because this is gonna be very, very important. But remember that you can be as flexible as you want with your costs. Your shipping zones don't forget. You can also take a chip in zones based on post code or ZIP codes. Don't forget about that. So take a time planned. This out and German of earnings of the well will now go ahead and begin to create our products. 13. WooCommerce Download Images: I hope you're enjoying it the course of those far. Now we're gonna go ahead and begin to create products. But before we do that, I don't want you to go ahead and download the zip file attached to this particular video. You could find it in the resources tab or in the put it section, dependent on where you're taking this particular course. But when you extract the zip file, you will find this Father Caldwell commas images you cook inside and then you have access to all these images. So this is entirely up to you. If you do have your own product images, by all means, please use them. But if you build on this side along with me and you just want to create sample products for now, these images, I believe, should be able to help you out with that because I'm gonna be using these images to create our products in this course. So please go ahead. Extract the files on then imported mutual media Library 14. Creating a Simple Product: So hopefully you've added the images to your media library and that you're ready to begin to create some serious products. Okay, So to quit up first product, I'm gonna come down here to products and I'm gonna click on add new. No. And the first product in here is going to be the Laure X wristwatch. That's right. We don't sell Rolexes with cel lo X. That's our own, our particular upper end of look serious risk to accept in here, you can add kind of like a description of what this particular product is all about. So I'm just gonna go ahead now and say, Ah, look serious. Look serious. Ah, watch for men. Very simple. All right, now down here. But you have the product data. You do have access to different types of clocks. Now, this is going to be a simple product. All trade how to create these other types of products a bit later, but we'll go with simple for now. So regular price in here. Well, let's see. I'm gonna go and say 1999 because it is a very expensive watch. It's much better than the Rolex soap will go with one that in 99 inventory you can hear you can add the SK you. So I do have the crow, Lex as my stop stock keeping unit. Qualex. Okay, you can also choose to manage to stock at a product level so you can click the books right here and in here. I'm going to say we only have 10 because these are very, very, very expensive watches. Now, do you own allow back orders? You can choose to know allow or you can allow, but identify the customer or just simply allow I'm gonna go with allow, but notify the customer so they know that. Hey, this might take some time before they get it. Put it because we've run out off them. All right. Low stock Tresh hold. At what point would you receive identification that? Hey, we're running low on a particular product in your store. Now, In the case of the lower ex watch, I'm gonna go with let's say three. All right? So once the number off Rolex Lomax watches in our store has which three. We will get identification from local my saying Hey, you know, you're running low on this particular item, it will be via email by the weight. All right. So you could also just sell individually where you will enable this to only allow one of this attempt to be bought in a single order. There's depends and Halle on you. But, hey, we might have some very expensive was part of some very rich customers who might excited by five or six off these at one. So I will give this box on checked. All right, we do have the put a short description, and I'll say, Ah, with this watch, you are going to get the attention off the ladies. Thank you, face. All right. Gosh, this is so cheesy. Enemy What? Whatever. Let's just move on. All right? So down in here, we've got the ship in and for the weights. Let's say this is £1.4. Are dimensions not available now for the shipping class? We're going to go ahead and choose the deli Cate shipping class, because this is one of our more expensive products. Ah, link products. Attributes will talk about this later. Now, under advanced, you can choose trainable reviews for the purchase notes. You can add like a very special thank you for your customer who buys that product if you want to. And then finally, anyway, you've got to get more options. Well, this is for additional stuff, which we're going to get into for now. Over here, to the right, we can add a new category and will called his watches. All right, so there will be a category for this particular product with the watches. Let's add that you can choose to add product tags if you want to, so we'll just say watch, for example. That's one I will add luxury, and we can add men. Okay, so doesn't three tags associated with this particular product and then for the part image. Very, very, very important. You definitely want to show images of your products to your customers. So let's go ahead now and shoes. I think I have got about three. Okay, this is if I hear that will use this image. Let's said that as a plucked image, and then down here, you've got the gallery for your images as well, so you can show different angles of the same product. So choose this one, and I'll choose this image as well. Do I have another image for the watch? I don't think so. Yeah, I don't think so. It's just us two. Fine. We'll go ahead and add a city gallery and the U goes Let's go ahead now and simply publish this product and let's see what it looks like. Okay, so I'm gonna click on view product up here and let's see what we have. Okay. The lyrics. Wristwatch With this. What? You're gonna get the attention of the ladies smiley faced. An in stock can be back ordered. So that's the image right there. You've got some other images from the gallery you can zoom in. Okay, Not too bad. And of course, down here. You've got the description. It looks us. Watch for man. And there you go. Now I know this page looks It doesn't look very, very appealing, But don't what? We will take a look at design a bit later, but for now we're successfully created our very first symbol product. German invented video. Where all tree How to create variable products 15. Creating a Variable Product: Welcome back in the people's video is successful equated our first simple product, which is the law Rex wristwatch. But now let's go ahead and create a different kind of put up, which is going to be the variable product. And by variable I mean, that's a for example, you have a product that comes in different Kahlo's or different sizes and such a scenario. You would use the variable products. So let's go ahead at a new product. And I'm going to call these product the Skol T shirts. That's a very nice name Skull T shirt and we'll just say, Ah, casual T shirt, full men. All right, so down here will change. Simple to now variable product. OK. Ah, for the sk you. Let's see, S k u l t skull t will be the SK. You manage stock? Yes, Stock. Well, today we do have 100 back or there's no one is gonna allow back orders for this one because it's just a regular T shirt. Ah, low stock threshold will go with Let's say 15. Uh, Kate. And there you go. Now down here. Full. Shippen, let's just say the wait here is going to be point full pounds a guest, I mentions. Ah, 2122 23. I have no idea what I'm doing that we'll just we'll just leave that as it is, shipping class here is going to be no shipping class because it's a regular product. Now, over here, I'm gonna come down here to attributes. All right? So from here, I'm gonna click on add custom put attributes. And now in here, we can add the very first. Ah, what's my name doing here? Let's go ahead and add the name of a very first attribute, which is going to be our color. Okay, So any right now we can add the values for the color and we consecutive by this symbol. So for the T shirt, I believe we do have black, and we also have ah green and believe those of you to cause we have so in here. I'm gonna take this book that say is useful physicians as well save the attributes. And now from here, let's go over to variations. And now I'm gonna come in here right now. Click on this books in hit and say, create variations from all attributes and then go click. Ok, so right now woo Commerce is gonna create Oh, I do apologise. I went way ahead of myself just now. I forgot to add another attribute, Which is size. Do you forgive me? I'm just gonna go ahead and remove these. Oh, okay. Okay. Okay. Let's go back to attributes. Let's add another one and we'll code is one size. Oh, I'm such an idiot. All right, so in here will go. It's small will be the first value and then we have medium and then we have large. Okay, let's go ahead. Jackson's books save attributes, and now they can come to variations and now we can create variations of all attributes. There you go. And all case of six variations have now been could. So we now have black and small. We have black, medium black, logical and small green, medium green, large. So from here, right now, we can go ahead and begin to add individual pricing or even individual shipping for each one of this variation. So let's look for the very 1st 1 here. Black and small. I'm going to click on the job, done heroin here. You can add a special sq here. If you want to Our for the image. I'm gonna click in here. Let's go about your media library and I'm gonna choose the black right here. Let's sit that variation for the image Come down in here for the variation price. It is gonna be the simple 1999 for the way dimensions will live that as it is shipping class. Now, you can either just go with the default value to be for the parents, which is no shipping class. Or you could go with delicate or free l depends on what you've got. Ah, description will just say a literacy black and small. Okay, Favorite simple. And there you go. Let's go ahead now and also do the one full, green and small. Let's come over here. Click in there. We'll go with the green one said Operation Image Ah, for the price. And it will go with seven in 99. No shipping class actually come back. Appear. Changed this 1 to 789 as well. Okay, so I've got black and small. Let's do for black and large as well. Very, very, very, very quickly. Let's add black T shirt right This add variation image. Our version price. It will be 1989 because it's for large. Let me just close this one. Let's do the same thing for green and large. Come down here at Image, said the variation image Come down here. Vision price will also be 99 we'll just go ahead and save our changes now, because of time. I haven't done the ones for our black medium and then green and medium. Please feel free to do those in your own store. Over here, you've got the default form value. So what will be the default vows When a customer wants to buy this fable part, I'm gonna go with black and small that could that just be the default and then over here. But let's add a new category, and we'll call this the T shirts for the category. Let's add that one and inputs will just call this man and then ah T shirts, T shirts. They go. And then, of course, product image will go with the black image. Let's set that one and then, for the gallery will just go ahead and choose the other ones. The behind green going behind. Let's add those and ah yeah, potential description. A cause Jewel T shirt for men. And there you go. Let's go ahead now and we're gonna go ahead and publish this and the U goes. Let's go ahead now and view the product and this is exactly how it's gonna look like. So you've got the black and against the default of black and small. We've got the other images in Art Gallery 100 stock. But if I came in here right now and I keep this on black for the size, we don't have medium because we did not add a variation price for black and medium. That's why medium isn't here. But if I could go on large right now, you can see that the value has now changed to 99 you can see the range of prices for the small to the large size of 79 to 1999. That's basically how to Kuwait variable plucks for your work. Must I think of a watchin I will see you in the next class 16. Creating a Grouped Product: A. So far we've created a simple product and a variable product. But now I want to show you how you can create group products and to demonstrate this I've actually going ahead to create two additional products. I created the ninja hoodie, which is a variable product, and I've also created the wou d, which is just a simple product. But what exactly all group products on while we're doing to Kuwait? One. So in this case right now, the ninja hoodie and the hoodie, they're different products, but they're very similar because their hoodies in this kind of situation, if you wanted to give easy access for your customers to see these Hootie's at a glance. This is where you would create a group product. So it's basically a way off grouping items of very, very similar under one category on the one class. So let's do this. I'm gonna go ahead now and add the new product, and I'm simply gonna call these the hoodie I like, and I'll say, Arrange off. Awesome. Who these four men. All right, so down here, where you have the category already have Hootie's created put a category. I'll just called his hoodie come down here. I'll choose the product image, and I will go with the the black who hoodie and all those. Go ahead and add the remaining images for the hoodies. I think I've got about six of them. I think I got one. I got 2345 Okay, well, it's five. Let's go ahead and add that and let me just copy this. Click cup P. Let's come down here. Paste that one. Ah, OK. So over here, right now, where you have put a date. I'm gonna change this to Grouped product. And I will changes to hoodie as the sk you now in here, I'm gonna click on linked products. And now in here. I have to type in here right now. The name. So I'm going to say, Woo, this is one of the products off credit as a hoodie. And then the next one here is going to be the ninja hoodie. And there you go. So these are the triple X. I credit for who he's gonna go ahead now and simply publish. And now let's take a looks. Ever go ahead now and view the products you can see This is exactly how it's going to look like 1999 a range of awesome hoodies for men and then in here because the Wu hoodie is a simple product, I can come in here and simply choose the quantity. But a ninja hoodie is a variable products, so I'll have to click on select options and then from this page will now have to choose the color and then the size, all to the calls and then and then posted from there. But if I go back to my shopping page now, note the way will come. Us now lists this different kind of products for your regular simple products. You're gonna have the art to caught for your variable products. You'll have select options, but then, for your good products, you have view products. So that's how will come. Outs will level the buttons associated with each of these different types off categories of products. By the way, in case I didn't mention this Elia when we installed woke Hamas, it automatically create head four pages forwards. By the way, I should have mentioned this earlier secretively called Check out my account as well as the shopping pages. These are the pages created automatically by who? Commas the progress imposed. The here is by war press actually assemble pages by my hosting ah company outside Gone. So I just wanted to mention that so that's physical eat for co 18 group put ups. Thank you for watching. I will see you in the next class. 17. Up Sells and Cross Sells: Welcome back, Electric spent to you the concept, off up cells and cross sales and how they work. And to do that, I've gone ahead to create to mawr new products. I do have the chika genes, which is Jen's for women. It's a simple product. At 39 99 I do have the jasmine purse, which is establish purse foot. Classy woman is variable, and there are three variations for the color red, yellow and pink. All 1999. All right, so what exactly are cross cells and up sells? Well, to explain this, I'm gonna go ahead and add a new product, all right? And this one is going to be the bow cheap bag. Don't ask me. Haven't come up with these names. I just create them about your bag. OK, so we'll just call this Ah, black bag full women. That's a very, very simple explanation of what the product is. I'm gonna come in here right now. Add the tags bag women and for the category will have bags. And there I'm gonna add the product image and it's going to be this one right down here like bag. Let me add that as they put a image. And I do have one more image off the same bag with the model cam in the bag. It's that's right here. Okay, let's add it to the gallery. All right. So regular price here is going to be Let's say this is Ah, 49 99. Okay, Now take a look at this, and I'm gonna come over here where I have the inventory them. Just quickly add the S K, which is bouche. Okay. Attributes. I'm sorry. Not attributes are linked products. What do we have here? We got up cells and cross cells now, Daddy A here is an Upsell is basically you trying to promote a more expensive product to the customer. That's very, very similar in this case. Right now, I do have the jasmine purse. So the female customers, she might be tempted to not go for the bag, but go for the purse. Instance. I'm gonna come in right now and typing jazz. May that's it. Adjustment purse. I'll just go with the main product and then across cell is basically a part of that can complement the product that the customer is currently trying to buy in this case right now . But the black bag, I can say that it will go nicely with the chicken jeans. Okay, so I'm going to do that. So by the black bag with the chicken genes, Or if you prefer, just get yourself in nice jasmine purse. But let's see how this actually works when we try to buy them. Let's go ahead now and publish. So I've got the Bauchi bag published. Let's go ahead now and view the products and I'm gonna pretend, like, actually want to buy the back. So take a look at this. Okay. On the product page right here. If I scroll down, take a look at what you have over here. You now have the You may also like section, but you have the judgment purse, and then you now also have the related products. But you now have the chika gene, so this will be listed underneath the actual main product itself. Now, if I proceed to add the bag to the court All right, now let's go down here again. You can see both the jasmine purse and the little products, but now if I finally go over to know view. My cart, you are now notes, is that the cross sell is not featured. More prominently is basically in here are You may also be interested in the Chika ginseng and see again. You were trying to push the customer to buy an additional politic and complimented product that it currently trying to buy. That's basically the idea behind our up cells and cross sell cross souls are products. I can compliment the product. The customer is currently transit bio bi op cells are basically a more expensive product, are similar to the one that the customer is trying to buy. 18. Product Settings: before we begin creating our products, I would like to show you some settings. So I'm going to come down here to welcome us, and I'm gonna click on settings. And here you have access to the products tab. And if you click in there right here, you can choose your shopping page. But remember that welcomes has automatically created a shipping page for loss. Now, here you've got the product Perma links, which is very, very important. So I'm gonna click in there now by defaults. What press has is very annoying our plane propelling structure, which isn't good at all. So what I'm gonna do is I'm gonna change this to a post name instead. And then down here, you will have the opportunity to change the prima links for your products. And this is great for S E O. So I'm gonna go ahead now and choose the one in hit. It stays shut base with category. So department six now would be your u L four slash shop four slash the category of the product and then the name off the product. I think this is a much better way off structure in the Urals for your products is very, very good for CEO, so I'm gonna go ahead now, save my changes for the product. Unveilings. Let's go back to welcome us sit ins. Let's go back to the product. Stab Now in here, you do have the odd to called behavior and, like you can read into the cut page after successful addition, I don't think this is, ah, good way to do this, because usually you might have customers whom I want to buy. More than one are single product, so we'll examine immediately once they've added one product to the card. May not be, ah, great idea. Enable Ajax at ticket button on archives. This is entirely subjective. It's up to you now. Indeed, you've got this place holder image, and it's set to five now. Basically, this is the image they'll be used as a placeholder should. In case you don't have an image for products, not first of all, all your products should have images because that's one great way to advertise them. But if for some reason you may not have an image for one of your products, these idea the image of with 85 will be used now to change this If we go to a media library just as an example. Ah, let's say we wanted to use Ah, let's see. All right, that's it. Wanted to use this particle up lady in here. The idea here is 93 can see opiates 93. So this is how you would choose or select the I. D off the image that you want to use as your place holder. Just in case. All right, measurements entirely subjective kilograms intimate is off default and then reviews. And it will productive use show very fight on a label on customer reviews and then reviews Can Onley left by verified owners. So only owners of actually bought a products will be able to live reviews. Let's go ahead and check that at important meetings. Enable story to normally views story and should required not optional. This is entirely subjective. Okay, it's up to you was gonna go ahead to save my changes. And, um, that's pretty much itself on the full extent as well. You have access to the in Venturi appear you click in there and also we'll show you. Ah, this is where you can manage your inventory stock, so we've been able to stock management by default. But you've got the whole stock in minutes, and it's set to 60. All this means is sometimes when a user has paid on time so many customer has paid for a product. It might be Penan, meaning that the payment get where they used benefits. PayPal or stripe may not have processed the order they are. The stock will be held for them for one hour, and even after one hour, the payment has not finished processing, it will be cancelled. So that's how this particular that that's how this works you can. I said this Change it you won't like in notifications. Yes. Enable us to identifications and enable out of stock notifications. Yes. And then you can add your email. Here. This is This will be the email address where the identifications will be sent to ah, low stock threshold. The default here is set to to that is full items that we've not specifically set a low stock special fall ill increases to 10 just in case out of stock special. Well, that's That's basically zero Adam stock visibility. Now it saves hide out of stock items from the catalogue. This is an tally subjective. It's up to you and then start display for months. Always show wants to be many like Okay, let's say 12 in stock. Or you can go with only sheer quantity remaining in stock when Lo likes. The only two left in stock never should call every minute in stock. I do like the only show according to remaining, because this might urge the customers to actually buy the product because now they know that, Hey, it's running out of stock. Let's go ahead, save changes and that's it. So, under downloadable products, this would be if you are selling virtual products like E books. Are all your father things like that? But we're not dealing with that. So that is that. So that's for the product settings. German over next video well will begin to create our products 19. Setting up Payment Gateways: Let's talk about how we can make some money and specifically payment gateways that will allow our customers to pay us money for our products. So to do this, I'm going to go over to the payments tab and let's see what we have here. All right? Direct bank transfer. We're not gonna be walking with that. We're not going to be working with cheque payments either. Cash on delivery are yes. We're gonna enable cash on delivery for our local customers in Maryland. So will enable this in an old click own set up. And let's take a look. So in you right now, you can change the title description, instructions and double for shipping methods. Very, very important. I'm gonna click in here. I'm gonna choose the mail and flat. Wait. So customers with in Maryland who would like to I'll pay for the product when it is delivered to them on the doorstep with cash will enable that for them. And then, of course, will also enable for the local pickup. It's American local pickup. So if a customer comes over to our store to pick up the product, that can pales in cash. That is perfectly fine. So those two selected, except for virtual orders, we're not dealing with virtual orders in here, So I'm gonna go ahead and check that save my changes. And that is that. Let's go back to payments. And now over here, where you've got PayPal, I'm going to enable PayPal as well. Now, just to give you a quick tip, you want to make it as easy as possible for your customers to pay. So the more payment methods you have, the better I'm gonna nibble. PayPal. Let's go to set up. So in here, people, standard is enabled. Fine. Title is papal description people, email. Ah, make sure this is legit, people. Email should be legit. Now, over here, you do have this extremely important box that say's ah, enable papal send box. I'm gonna go ahead and check this. What this means is by enabling the papal send books, we will be able to test payments first before we actually begin to accept real payments. So this is a safe way of testing payments just to see if it's actually working. So coming up in the next video, I'll show you how you can create send books, account and then begin to test our payments with PayPal. Ah, that's pretty much. All we need to do in here is gonna come all the way down here, and I'm just gonna come in here and save my changes, and that is it. So Germany next video well will begin to create some books, accounts and test payments with PayPal. 20. Announcement: I hope you're enjoying the course those far and I just wanted to you very quickly make an announcement right now because the next to videos have also watch the one that involves creating sandbox accounts with PayPal and then test in payments with PayPal. Those two videos are from the old version off this course, that course use Vision 3.5. However, the process off CO 18 sandbox accounts and testing those accounts for payments hasn't changed is still exactly the same thin. So rather than me having to, you know, we create the entire videos all over again. I'm just going to include those two videos from the previous course version in this particular course. So don't freak out if you see that the sides being used is a little bit different. It's called Cool Store, not the cool store, and that might be one to changes in the back. And don't worry about that. Just focus on learning how to create your sandbox accounts and learning how to test payments. We thought. Send books, accounts, and I'll see you after the videos. Where will begin to you configure our payments with stripe? Enjoy the videos 21. Creating Sandbox Accounts: all right. As I said previously in the last video, we have enabled the papal sandbox, which would allow us to test payments using PayPal. So now what I want to do so sure, you how you can create the sandbox accounts on PayPal. Now, obviously, you should already have an account with PayPal. If you don't have an account with PayPal, then please, You're simply goal to PayPal. It'll calm and simply register. It is very, very easy. I'm gonna zoom the jury, have an account with PayPal. So what you need to do is to simply go to Google. You can type in san books, accounts, PayPal. I think this is the easiest way to really find the location of where you can build our sandbox accounts. So in here, I'm just gonna go ahead now and click on send books, accounts. PayPal Developer. I am already signed into papal. By the way, you can see my name. Alexander. It's right there. So in here right now, we have the ability to create sand books accounts so you can see the big blue button right here that says create account. I'm gonna go ahead and click on it. arts. The country? Well, you can choose any kind of country from the United States to train to Germany to India. Take your pick. I'm going to stick with the United States now In here Already have the personal buyer account over the chosen. So this one, the personal account will represent the customer. The customer who is coming to buy the product. So for the email address in this case have used so many of them. The miller just in here, I'm going to say cool buyer at by a dot com. It doesn't have to be like a real legit email address, by the way, so you can choose any kind of just like us. It has the at Sissoko com. You should be fine. So called by cool by at buyer that come. All right, and then pass What? I'm gonna add a very strict password and ah, that sits of payment methods for the papal balance. I'm just gonna go ahead and say I've got ah, $2 million or something like that. That's fine. It's verified by the bank. The payment card. This isn't necessarily we can live it on discover credit cards. It's fine visa. That's okay. I'm just gonna go ahead now and click on create eight account. And just like that, you know, we go. So it's processing. As you can see, I'm gonna go ahead now and create ate a second account, and this one will be for us. The owners of the store, because we don't need an account out, would receive money from the our sandbox account off the potential customer. So in here, right now, I'm gonna choose business instead. And then for the villages I'm going to say cool cilla at cella dot com. Okay. Ah, let's see. Okay, that's available and then passed. What? I'm gonna go ahead now, and ah, simply admit password. Let's cool down, people. Balance. I'm just gonna say 10 10 bucks. No, $10 way are very poor stole and are looking for customers to give us lots of money. So 10 bucks. That's what we have. Enough people balance. It is bunk verified. I can just gonna go ahead and click, create accounts and Ah, there you go. So all right. So you can see it's processing. The one for the cool buyer has been completed. I'll go by here and with first, This shouldn't take too long. It's usually a few seconds for it to finish processing them just to refresh again. All right, so there you go. So now I've got the business account. Cool cellar at Slate com already processed. And we also have a personal account. Cool buyer at by it that come Already processed as well. So Germany next video available. Now test. How? Payments. Using our sandbox accounts. 22. Testing Sandbox Payments: Oh, it's another we've got all send books accounts. It is time to know experiment to see if our customers can pay for products and then we can receive their payments. Now, before we do this, I want you to go to your payments. Tabin in on the Papal Make sure that the people email has been set to the business Matron's E mail that we used for our send books account. Minor was cool. Cellar at Cell above comes from Mitchell People email is set to this mixture. Enable people sandboxes also are active. I'm eligible rare to Firefox, and I'm going to pretend like about customer of coming here right now. And ah, let's go ahead and choose the skull t shit. I like it and let's see. I'm gonna choose the green color. I'll choose the medium size I like. It's on a big picture of them. Let's ought to the cart. Let's view our cart pump, pump, pump bum capes. Everything is to the 97. That's fine. Let's proceed to check out. Oh, all right. So, billing details. I'm gonna come in here right now and say my name is Bob. Uh, Jones. Ah, that's my address. My state in this case would be main. Ah, zip code for number is 78 blah, blah, blah, blah. Email address is going to be Bob Jones at yahoo dot com. Of course, all this can be freaky. Doesn't have to be real. All right? And then, of course, remember when we were setting up Welcome us. We said that we wanted customers to be able to create an account. So I'm gonna go ahead and take this box so that Bob would be able to simply log in the next time he wants to buy something for my store. And then, of course, ship into different addresses. Depends on the customer. But they have the option of choosing a different address from shipping two billion island. Shake this. Let's come over here right now. And ah, let's just proceed to pay. Proceed to pay policy concedes that. O k Papa. Papa! Papa, Let's it was gonna happen all Kate not pay attention to this. The You always see essays, sandbox toe, PayPal, book home. So you can see now that this send books environment is now active. All right, so I'm gonna log in right now. with the personal account that we created, which was the cool Ah, Byam at by it'll come and then I'm gonna add my password. Let's look in. I don't save. Um um um ok, Ok, OK, we're been securely locked in. Thank you very much. Paypal. Oh, why did then pay now? Yes, but want to pay. We want a T shirt. Let's pay for it. And OK, so you can see that now. We've paid with my 97 That's awesome. Now let's return to the match ins. And now that you can see, the customer will get the message saying Okay. Thank you. Your order has been received. Order for to warn the 77 2018. That's the email. Total payment method was pay, pal. And of course, you can see for the clarification the product was this call to show green medium size. Everything is right here. Building address, shipping address. Awesome. Awesome. Awesome. Okay, what I'm going to do right now is I'm gonna open up the sandbox of paypal dot com site again. But in this case, right, I'm gonna open this up in a private tab and I will say sandbox of people to come and never gonna log in as the merchant as us. So email in this case was a cool cellar at Cilla. Come and in the past would Now I'm doing this because I want to make sure that I've actually received the payment on my PayPal account due to due to a light. Let's come in here. Now, let's see what we have. Okay, lets see. And Okay, so it does say payment from Alexander. Only it doesn't say from Bob Jones, but you can see right now that we have the correct amount, which is 29 97. So one thing on the point out here is that I don't get alarmed if you have slights issues like this where maybe the name of the person making the payment isn't same. This happens a lot whenever you're testing out with this sandbox environment. All right? Just as long as you can see that we've received the money. That's all that willing matters now just to confirm that, indeed. Welcome us has registered Bob Jones as a customer. If I go back to our back end, if I come over here right now to order as I clicking here. You will now see the actual real person that made the order, which is Bob Jones four minutes ago. And it stays on hold because, well, we haven't confirmed payment yet from Paypal, so I can come in here right now and simply click on this and simply come over here and then say on hold. But it's now completed. There you go. Updates. And that is if I go back to my orders. There you go. So, Bob Jones, his order has been completed and was 29 97. So this tells us that yes, we are now able to receive payments from customers. Customers are also able Teoh pay for put up on our online store. Thank you for watching. I will see in the next class. 23. Setting up Stripe: All right, let's talk about how you can set up stripe payments. But before we do that, just a gentle reminder. If your PayPal test payments have been successful and you want to start recieving will payments Make sure you come in here on check the papal sandbox and make sure people emails are legit. So I'm gonna go ahead now and I'll just save my changes and that. Is that all right? Now let's talk about stripe. Now you can google a welcome us for stripe, and it will bring you to this page where you have the official straight plug in developed by woke almost themselves. It is free. So on this page, all you have to do is just click on download now, and you will be acts to fill out this information in here. And then you can just simply go ahead on per chase the plug in. It's not a real purchase where you will receive the downloads automatically for free. So simply go ahead, install activated. Plug in. Now. I have already are going there to activate the plug in. As you can see, right here will come as strep get weight. Some for me. I'm going to go over to welcome us, go back to settings and then let's go to payments again. And now in here, you should see stripe and all the revisions off strike for different countries or I don't know, I've never heard of most of this before. I'm just gonna go ahead and configure their main one with is the stripe credit card. So turn that on and we'll go over to set up. All right. Well, do we have here now? Over here, you can change the title and description as usual. Now, over here, we do have the option off enabling a test mode so you can test payments again. For these, you will have to get your publishable key, your secret key and also a Web hook secret. To get these, you do need to have an account with stripe. If you don't have an account with stripes, simply go ahead and create one. It's free, and it's very, very simple. I already have an account with them. This is actually a dummy account I set up. So to get these information, the publishable key secret key all I'll have to do will be to come down here where you have developers. Now I click on developers. I now have access to my M P I keys and then Web Hooks. Here's the thing, though I'm not going to enable the test mode because it's pretty much very simple. Two is very similar to the way PayPal test mode works. You know, you get the keys and then you attempt to pay and you see what happens. Basically like instead, I'm gonna go ahead and is able this and just go straight for the actual real are configuration. Now that we've on check the enable test mode, we now have life publishable key, live secret key, and then the Web hook secrets. So to get these, I'm gonna comment right in here. Make sure the view test data hair is set to off. If you want to test your payments first, make sure this right here is set you on and you'll receive special eight p I keys on Web hooks for your test payment. But we're not testing payments anymore, so I won't check this. Now let's go over here to a P I keys. So I came right now I do already have a publishable key and a secret key. As you can see, I'm just gonna go ahead now and grab this too, if you don't have, You know, your publisher of a cure. Secret keys is very easy. Just click on the create secret key right here. You click in there and you will automatically be able to You'll also provide a key name you click on, create, and then you'll get the secret key. It's very straightforward. I'm just gonna go ahead and grab the publishable key, which isn't public. So I'll go ahead and place that, and then I'm gonna do the exact same thing now for the secret key. Which off course, I am going to blur. Even though this is a dummy account all the same, just gonna make sure that it stays. Ah, Secret. Okay, let's go back in here. And now, finally for the web hook, I'm gonna come down here, click on the Web hooks. All right, So from here, right now, I'm gonna click on add an endpoint, and actually, if you go back here, I'm sorry If you go back in here, it Cesar, you must and the full on Web hook at one point. So this has already been created for automatically by Stripes. I'm gonna go ahead and grab this one instead. Let's go out that let's come back in here. And then I'm simply going to go ahead now and paste that like this. And then over here we can slick the events. The idea here is to receive notifications whenever anything happens with strip. That's the whole point off adding the Web hook. So right here you can choose the kinds of events that you want. Ah, so let's say bounds available. What's a charge? Captured, for example? We want that one right. Let's come down here. Let's see. Charge filled as well. Let's go with the charge. Ah, pending Let's go with a charge refund and ah, charge succeeded as well. I think that should be a bald it. What else do we have here? Check out credit note. Ah, yeah. I think I'm going to find with ah, these ones that we've created. All right, let's go ahead now and add the endpoints. And there you go. So now you can see that the Web book has been configured for us. It's enabled, and these are the invent types where will receive are a notification. Let's go back to a welcome US settings. And then in here we do have the Web hook secret that we need to add. That's the last thing. Let's go back to stripe. Now to get the web hook secret. I'm gonna come in here, click to reveal, and I'm gonna grab this secret right here. Let's copy that. Come back in here and I'm going to paste that secret. And there you go. And in line critique art form. This is just the styling off the credit card with straight. Basically, you do have the option of checking his books, which we will check, and I'll show you how this looks like. We're not walking with statement. Descriptors are charge. Capture charge immediately. Yes. Um, all these other information in here is entirely subjective. Payment request, But anti bio or you know, when no one is donating their customers that binds all living on by Ah, the theme Dark lied light outline. Oldest is just design changes. So we'll just go ahead and leave that as it is. Let's go ahead now. Saver changes. And let's see how this would actually look like on the front end. So let's go over to our store and let's pretend like I want to buy this particular item right here and I'm going to attempt Teoh. Check out. So you have the buying our button with stripe, as you can see, so that clicking there you can see right now that we now have the option of choosing from our store credit cards and things like that. But I'm gonna go ahead and cancel elbow just posted to check out. And let's try to see the information from here. So we have a credit card stripe down here, so make looking there. Now you can see this is the in line. Are styling for the form you have, You got a credit card, and then you've got the of the month and date right there so that come back over here and I own checked this in line credit card for listen. Check that and then see how it looked like. Let's save changes. Let's go back in here. Let's refresh the page and focus on every click on critical stripe. Now you can see it's a bit different now. The credit card number, Date and CVC all on separate lines. That's basically are the difference between the in like regard for Mandy, known in line credit card are form. That's it for the season. Up off the stripe payment gateway thinking fortune And, um, that's it, that we'll see the next class. 24. Managing Accounts and Order Flow: So let's take a look at the way our site functions in the perspective, off a customer. So as against it right now, I am locked out. I'm gonna pretend I am a customer coming into the cool store to get myself some cool clothes. So I'm over here on the shopping page and, ah, let's just say I'm interested in getting the cool blazer. Ah, let's go ahead and add the low X, which watch and ah, some sent sneak has as well. All right, three items. Let's go ahead and view are caught and ah, okay. Now over here, you can see ship into M D Maryland. The reason why this is rated may feel that is because before I started recording this video , I was playing around just to make sure I had everything in order. So my browser, the cookies, have stored the address they initially put in, which is a Maryland. That's why you're saying that anyway, that's unimportant. Let's go ahead now and proceed to check out all right now, because in a previous video, we said it so that customers can log in to a previously created accountable to check out we now have this option that says returning customer are click here to log in. All right, billing details. I'm gonna go ahead now and feeling my name. My name is Ah, Dick Jones. No. Now, this isn't and, um, I just watch the ah Robocop movie from 1987. And if you've ever watched a movie before, you would know the person I'm talking about. Anyway, that's the important Big Jones is my name, House address. I'm just gonna add some some stuff in here. It's not important, by the way. I really do have the papal sandbox are enabled. Just print that out there. All right. Email address. I'm going to add my dick Jones eight for 44 and Yahoo come. That's Ah, just a dummy email account and ah, it just make sure everything is in order. Art. I'm gonna come over here to pay Powell and ah, I'm going to choose papal Click on, proceed to PayPal and Ah, let's just wait for a few seconds, pay with PayPal. So I'm gonna change the images in here to the ah sandbox account, which is a cool buyer at buyer calm. And I'm going to add my password and let's log in Teoh sandbox account. And Ah, no, I'm not saving the password. Thank you very much. And so I'm just gonna go ahead now and simply pay and that you go, art. So I have paid almost $3000 for three items. All right, I'm gonna click on. We turn to Merchant now down here. All right, So you can see the customer will receive this message. Order has been received. Now, if I go to my email account for Dick Jones 844 you can see in here from the cool store. And it Cesar, welcome to the cool stole. Thanks for creating an account on the cool store using a mystic Jones. And this is your password? It's been automatically generated. Okay. Remember that we said that customers will be able to quit a council. One stay place an order. So there you go. So now Dick Jones has his user name. He also has its password that's been generated automatically for him. Okay, I'm gonna go ahead and just copy this password. Let's go back to the site. Now if I go over to my account page, let's see what we have in here. All right. So against right now, Dick Jones Dashboard. This is the dashboard orders. And over here, you can see I do have two orders. 1 31 31 They want that. It was the one I played with before I said, every court in the video. So as it is right now, the the order for want we want for our three items is on hold as it is. Let's go ahead and view and see what that does for the customer. Okay, so it provides in full details. The projects been ordered, the amount, the billing address as well as the shipping address. Okay, So from our perspective as the customer, this everything here looks just fine. If I go back to my email, you can see that a second email has been sent by the store to the customer saying that your order has been received and the details off the order. Okay? Everything looking just fine. Let's now go ahead and actually log in as the admin and see things from my own perspective . So I'm looking out. Let's now. Ah, log in to go back up here. Loopy dash admin. All right. My name is cool stole, and my password is my password. Let's log and ought. So now we all the admin I'm gonna I'm gonna come down here to welcome us and then orders, And I fear you can see that I do have the one form Dick Jones, which is on hold. So I click in there right now, and let's just say, OK, I've seen the payment has actually been received. I can come in here right now and simply go ahead now and say completed. It has been completed, and I'm gonna go ahead now and dates the payments and that you go. So payment has been received and the order has been completed. And there you go. Awesome. All right. Now, to modify the emails that the customers would receive and that you also to receive is an admin. We can come over here to welcome us. Go to settings. Enemy from settings. You will see e mails over heels click on emails. So, basically, this is where you can customize the kinds of emails you would receive as the owner of the store. And also the emails that your customer would receive When, If placed an order with Nick and I cant has been created for them and so on. So right now you can see the recipient This the 1st 3 would be you while the rest down here would be for are the customer. And of course, the very last one here would be for you as well. So to modify, let's say, for example, you wanted to our modify the email that is sent whenever a customer has created their account, you come down here where you have the new account, just click on manage. And then from here, you can just simply coming here right now and maybe even choose to disable the notification . If you want to do that baking company right now and just add you additional content at your email head in your subjects and ah, there you go. That's been much how you would customize anyone off these emails. And other commend that you do spend some time to modify, have some of these emails and make them a bit more personal as it is right now, the the emails are very standard, very formal, and you might want to just add your own Toan head to the kinds of emails that your customers would would receive Down here. You can also customize the email, send out options. So what would be the from name? The From address. You can customize those down here your email template as well. You can add an image. Simply add the i d off the image you want to use down here and, of course, customize your foot attacks. And it can also customize the coloring scheme. Just background. Call it, maybe make the bed and call a black and then the body text Calo. Why? It's just to give it, like some sort of like a really cool design. It's entirely up to you. All right, so that's basically it for the account management. 01 more thing to mention if I come down here to users and they go to all users, you would notice that Dick Jones has now been added as a customer because his account has been created and his order has been processed. So that's it for accounts management, Germany Fenix Video Bell will not take a look at working with coupons 25. Account and Privacy Settings: all right, so we're doing pretty well. Those far we've created are shipping zones with credit products. We've also set up apparent get ways. But before we move on to extending the functionality off our side and also changing the way it looks like, let's take a minute to take. Look at the accounts and privacy settings full, will commas now accounts and management is gonna be very, very important because, ideally, you want your customers to be able to create accounts where they can track the products that they've ordered for where they can process we phones, and but it can change their delivery address things like that. So over here, where we have a comma settings and then accounts on privacy, you do have the guest check out options where, first of all, you can allow customers to place orders without an account. Now, this is entirely subjective. There is no light, a long answer here. First customers to create eight or that took first of all, creating account before they can place an order might turn them off, maybe, but a mount experience. If there's ever been a product I wanted to buy, um, it hasn't bothered me that I had to quit in account. So I think that you can simply don't check this box and actually force customers to create an account before they can actually place orders. But, hey, this is entirely subjective. And it's up to you. Allow customers to log into an existing account. Doing check out. Yes, I will enable this one. I can't question allow customers to create an account during check out. Yes. So if we're gonna force customers to quit and I can't before the complete honor that then it makes sense that they should be able to get an account while they're trying to check out that makes sense allow customers to create an account on the my account page. Ideally, my account should only show up when a user has actually looked in to the site, meaning that they already have an account again. This is entirely subjective. If you want a locked out users to be able to see the my account link on your main menu, then by all means, you can check this box. But I'm gonna live this books on checked as it is on blinker and they can automatically generate an account using them for the customer based on the name Ah Sunny More email? Yes. Brain creating account automatically generate. And I cant password. Yes. These two will always be creditable by the customers. Say they prefer to change the There is the name of the password. I can always do that later. Account Origen request Remove personal data from orders on request Yes, please want to comply with privacy laws in here So please check this box. Remove access to downloads on request. Yes, we'll do that one as well. Personal detail removal Allow personal data to be moved in bulk from orders. Yes, Basically, if any of your customers decides to send you an email saying Hey, look, you know we want you to remove Ah, personal littlefinger site then by all means, you should comply with that over here for the privacy and policy by default. What press usually creates a privacy policy page for you? In fact, if you go to your pages, you should see a privacy and policy page already created for you. Ah, this is taking forever. Okay. All right. So here it is, right here. Privacy policy. It's a draft page, right? now, but this is good automatically for you. By what? First, you can always edit the page. So by default, it's been said to the privacy policy page. You can change this by simply comedian here and ah, clicking that the Cairo and simply choose in the page decision Privacy policy. You can edit these to your own, uh, satisfaction, our personal detail. Attention, they says. Choose how long to it in personal data when it's no longer needed for processing, live the foreign options blank to intend this data indefinitely. Ah, I will not retain any of this data indefinitely. So what I'm gonna do here is retaining inactive accounts. I will say, after 12 months, if an account has not been active for over a year by omens, just go ahead and remove their kind of make it 13 months. It's actually over one year. Retained pending orders. You do have the option of weeks, months, years, days here. I'm going to say one single day, 24 hours because we 10 pillars for one day retained filled orders. No day. Do not retain any field orders. Retain canceled orders. Actually, what I said, it makes sense for you to retain filled orders for statistical purposes So we can say even be seven days in here within castle order. Seven days retained completed orders in here. I'll recommend one month. If you're offering, like, a 30 day back money guarantee, then it should make sense that you retain the color. Others for at least one r mont between stripe data. But we can over here. Honestly, I don't really know much about this particular option. It stays, retains the distributors. Such a strip custom. I d source. I d, uh, welcome to maybe seven days. Wants it still again. Unit for processing, I guess seven days in there, I'm gonna save my changes. And that is it. Okay. One more thing to mention before we round this up are under advanced. You do have access to setting up your pages, but there is really no need for you to change anything in here because automatically welcome us has created these pages for you and has set the pages to the corresponding functionality. So you've got carpets that a car to check out to check out my com account our terms and conditions, I would encourage you to create a Terms and Conditions page where you can talk about your refund policy and things like that and then choose the page right here is Wade would want to choose the page the checkpoint to check out endpoints account endpoints. You don't need to change anything in here at all. Just leave that as it is. All right, let's go ahead. Save changes. And there you go. That's it for the accounts and privacy settings. German next video Well, will not take a look at accounts from the perspective off our customers. 26. Working with Coupons: already. Let's talk about coupons. And, of course, everyone lost coupons. Businesses love coupons because, well, they can use coupons to promote sales. And, of course, customers love coupons because they can use coupons to save some money and get themselves in. Paulson deals I to create a coupon gonna come down here to coupons, underworld commas And of course, I'm gonna click on eight your first coupon. So let's go ahead. Now click in there. The first thing we'll have to do is to provide the actual code. And, um, these are trying times for you want, So I'm gonna say, Ah, good times. All right, good times will be the coupon code. And, uh, you can add a description for what the cold is before the coupon is meant for. But now, over here, would you have the coupon data where you can set us fictions and determine just exactly how this coupon should be used? So on the general, we have the discount type. So are you going by a fixed cat discount or fix product discount? Or better yet, a percent page discount under is going to go with the regular percentage discount. So 25% off, 30% off. You know, stuff like that. In this case, let's go with a very generous are 40% off, you know, on all products. And now engage. We can choose to allow for ship and if this coupon code is used, But, hey, I think 40% has already been ah village. And also we're gonna take this. Ah, Bo. Just set a date for the experiment to the 26th of March and on the usage restriction. This is where we cannot begin to set the restrictions as to how oh, how the Cuban can be. So first things first, you've got the minimum spent. Do you want to customers to spend a minimum first before they can actually use the coupon. And yes. And this is what I'm gonna say. Spend a minimum off $100 then you can get the coupon code for 40% off maximum. Spend no maximum. Spend as much as you want. Individual use Onley. Yes. We don't want customers to be able to use this code with other codes as well, because then they can get themselves some very, very ridiculous prices Exclude sale items. Yes, We don't want items that are already on sale to be eligible for the coupon, either. Now you can say on the products you can choose setting products that will be eligible for the coupon code. All you can come down here and do the opposite, which is to exclude certain products from being able to be used with the court. And this goes right now I can say, All right, I'm not going to allow the Lurex Ah, watch to be used so that it's so unfortunately, this is our most priced I am on our store and we don't want cost the most available to use coupon codes for this particular our product. You can do the exact same thing for categories as well or extra extra categories. So I can just coming down here and very easily just say, uh, exclude all. What is one been eligible to use with the coupon code and then allowed emails? You can add restrictions in here as well. Name everyone. Jin. Where would this be useful? Let's say, for example, you wanted to offer coupon code specifically for employees from a particular company organization. You can tell them that Hey, use your business email when trains you are played a coupon code that way Onley them that have that business email with the name of the company would be able to use three coupon code. That's where this would be useful and finally on the usage limits. Right? How many times can this coupon be applied so we can say OK, only eligible for the 1st 100 people can use the coupon code and not limit usage to X item . So are you going to say all right, I only this keep on should only be eligible if the customer does not have more than eight or maybe more than 10 items in the cart. This is where you can add such a limit. Finally, how many times can a user used the exact same coupon code in this case and was going to say one time, right. So welcome us is able to track the user by the i. D. Or their email address. That's how you welcome us, is able to keep track. So I'm just gonna go ahead now and publish this and ah, they go. So good times, Let's go ahead and actually try to walk with this coupon code and see if it actually works . So let's go over to the store and I'm gonna come over here to shop and, ah, let's try to First of all, that sort of by the ah, Lurex. Wished watch. Okay, I'm gonna try and buy it. Let's go ahead. Add to the court. Let's view the caught and ah, it's over here right now. I've got the box to apply to keep on code. So let's go with the good times. Good times are here. Apply to keep on and again it says now. Sorry, this coupon is not applicable to selected products. Unfortunately, Okay, let's try for a different product instead. Let's see. Let's go with the Bauchi bag, I Let's view the cart. Let's try to apply to keep on cold in here. Good times. I played a coupon and it stays all the minimum Spend for this coupon is $100 0 my gosh. Okay, let's go back the shipping page. So let's try to add a few more items. Let's just add the cool blazer. Let's just add one. Okay, so now it should works at good times Applied to coupon And there you go, Keep in court. Applied successfully. Now nearly $300 has been deducted. Why? Because, well, it's 40% off, so you get to the coupon code works, and that's basically how you would walk with your coupons. 27. WooCommerce Analytics: one more things took about before we begin to change the design off our store would be the analytics tab right here. Now, this is the new functionality provided boy woke almost four point. Oh, and it's basically where you can keep track of your in Venturi revenue. Your coupon codes, things like that. As an example. If I clicked on a revenue old see that Jones already made an order and we've made ah, what's that? Almost 2000 and $2000 you can see right here. First order 2799. Net sales. Shipping costs as well. So to those cells is 2811. So as you begin to generate revenue on your store, you will come in here and you will begin to see your shipping expenses. The shipping costs, gross ills, coupons. Things like that are you click on orders under the analytics tab, and in here you be able to see all the orders, the products, the order number, the number of items sold the customer. But it's a new customer or returning customer. You can keep track of your products as well. So over here Let's just wait for a few seconds rights over here right now, You can see the products already been sold, the SK you category and ah, something a place like coupons. Taxes. If you are run in a virtual store, you cook on downloads. And this is where you would see the number off your downloads that have bean a purchased already. And then, of course, for stock in here, you can see at a glance C which items are still in stock. Which ones are not our stock, things like that. And finally, we've got the settings. So in here, you've got the exclude statuses function. Penn and payment canceled and failed, and it stays. Orders with these statuses are excluded from the totals in your reports. So this makes perfect, perfect sense because you don't want to include any any silt filled or was cancelled as part of your toe. Those cells, that's not gonna make any any sense at all. So a pen and payment canceled and filled, all excluded from the status is now over here. The actionable status is now on which particular our studies Can you act on processing and on hold right now, are the two, and it says orders with these services require action on behalf off the store. Admin. These are girls will show up in the orders tab on of the activity panel now, usually in here. I'll recommend you also check the pending payment because sometimes it could involve maybe that the custom economic a payment because off one issue or the other with this site. So all the command chicken pending payment as well, and then the default are date range. So a default it range when no into selected reports will be viewed by the default date wing . So you can choose to view your reports either quarterly or yearly or a week to the data. Things like that. So you can customize this to your own heart's content and an important historical data. Yes, you can choose to import all your historical data if you want to, or maybe the last 165 days the last seven days. Since like that now, to download any of this information, if you go back, Teoh woke amiss and then click on customers over here. This is where you would see all the customer names when that unless of my active and then over here. This is where you can choose to download all of information, and it will be in the form off on Excel file. So that's how you can download old information. You've got reports on the war, commerce as well. It's it's similar to the analytics, are basically in here. You can see your gross sales in a particular period may be the last seven days. The last year you can click on sales by product sales by category as well are you've got the customer's tab, where you can again view information of your customers. You can keep track of your stock, things like that. So all these tools are here to help you with the management of your customers, your total cells as well as your however new era in general. So that's it for the analytics function. Like if watching and German of unexceptionable will not begin to walk with the design off our store 28. Section 3 Woo Commerce Design Preview: Well, Hello, then. Welcome to Section three where we're going to be called wing design. Yes, it is. Stand to make our website look really appealing look really attractive. And yes, this is the site that you will have designed by the end off this section because I'm going to show you how you can do everything that you're looking at right now. We'll be making use off the Ocean WP theme to achieve this. And of course, we will be using the good book page builder as well. And with those two, we're gonna build ourselves a really attractive store. So I hope you're as excited as I am. Let's get started. 29. Choosing our Theme and Menus: all right, it's welcomes. It has been new section where we're going to go ahead now and walk on the design off our store now. Currently, we're using the store theme made by walk amongst themselves, and it's a pretty decent theme. But to be honest still, we do need something to beat. More are powerful than to store thin. And I'm gonna introduce you to the theme ocean, W P. Now this theme has a premium version, but the free vision is simply incredible. You can see right now over two million downloads, and there's a reason why this thing is very, very popular. It is fantastic. It is amazing off us a ton, and I mean a ton off options for to customize your site. And for newcomers, it is bloody fantastic. So let's go ahead and installed these amazing theme. Come down here. Let's go to appearances. Go to themes and let's add new and let's come in here and type in ocean. W B. There you go. Let's go ahead and stall and we're going to activate. Activate the theme and there you go right. You will see this Notice that if FEMA commands are elemental ocean extra and WP forms. I'm a huge fan of elemental, but for the purposes off this particular course, we're going to use the regular up good in book page builder to build our pages. Don't worry, I'm gonna show you exactly what to do. So if you have any fears about Gutenberg, don't worry. I think you're gonna love what we're going to build with going to book. So we can, you know, elemental, but ocean Extra. I'm gonna click on Ocean Extra. This will give us some additional options. Toe walk with the ocean theme. So let's go ahead. Click there. Let's also go to WP forms as well. Let's go ahead and install now. Okay, so these two should be installing in the background. But let's go over to the plug ins page and let's see if they've been if they've been installed. Okay, so you can see Ocean Extra has been installed. Let's go ahead now and activate that plugging as well. And I will come down here and also activate the WP forms are lit. And let's trade that one again. Come on. Oh, Okay. So that has been active and, uh, just looks a bit weird. Let's go back to Deployments Page and all right, I'm gonna go ahead and simply close this one right here. Let's close this message about getting into the ocean sticky. Hedda, let's also we move this one, you'll say notice here. That Cesar thumbnail of a generation is when in the background. This is because we've changed themes. So you can just let this run in the background. Don't worry. Over here you do have the set up. We said for ocean W people, we're gonna go ahead and simply keep that set of. Don't worry. I'll show you what to do with the theme. In the meantime, I have already gone ahead to create some additional pages so I could have the f accuse page re phones shipping as well as the student discounts page. We're gonna make it to this page is a bit later, but if you're building a real store for yourself, I take a minute to consider what pages you actually want to create. I think shipping and reforms are very good pages because for reforms, you can explain what you're different. Policy is for shipping. You can also explain where you ship to what country? You don't shift stuff like that ever accuse would be great as well. You can think off questions your customers would ask you, and you can simply provide the answers. There a student discounts? I just thought about this, to be honest, So this depends on new. It's completely optional. If you're going to offer special discounts for students, you can simply create a page and describe what the conditions would be. So please go ahead now and create some additional pages. And then once you're done, we're gonna go ahead now and create our menu. So let's go to our parents, go to menus and ah, first menu, of course, is going to be the main menu itself. Let's click on Kuwait Menu and then for the main menu. I'm going to add my accounts. I will add checkouts. Can other court page the shop page for now? And then what we're gonna do is we're gonna add the categories for products as well. So let's do this. I am going to come where you have screen options and then click on product categories to click on enable put categories. Let's do that. Let's close this again. And now if you scroll down here, you can see we now have product categories. So let's do this. Alright. What I'm gonna do, first of all, though, is hold on a second. Did we add the pages? Okay. We haven't headed to pay disease. Let's do this. Okay. I'm gonna click on add to menu first. Sorry about that. Okay. Next, I will add custom links. Okay. So we'll just add a hashtag here and there will add men. Okay, so we'll have a nice job done for the men's products, and then we'll do the exact same thing for woman as well. So women at menu Okay, lets we arrange This will put a check out here. Let's put man by day. Let's put women. And then we can simply put shopping and caught. Look, I think this this is fine. Okay, Now, let's go over to the Port of Categories now for men. I know that. Who these watches? T shirts? A jeans. I believe those four women ah, blazers is for men. So let's add those to the menu. First of all, so I'm gonna add now who is just under men? Let's add watches like their T shirts and then blazes. Okay, and then let's not go ahead and add blouses, bracelets. Ah, the genes. The bags. I think sneakers was full was for men. Okay, let's just go ahead and add sneakers as well. It's fine. I'm just do this schtick has goes on the man. So now bags goes under women jeans, goes in the women blouses and the women and then bracelets under the woman. Okay, that's on main menu. And then we're gonna come in here right now and take Maine. Why did Let's save that? Uh, okay. And now we're gonna create another menu. This will be for the footer. So let's typing full time menu idea, create menu. And for the foot, Emmanuel adds to than discounts if accused shipping and refunds. Okay, so let's at those and there you go. So the split location right here for foot are right there. Save the menu, and that is it. Okey dokey. Alright, So that's it. For the first part, we have installed Ocean WP theme with creditor menus and oh, let's do one more thing. Actually, let's go back to the cool stall to the back and we're gonna create a home page. We need a custom home pitch list of this page is I forgot to add the home page. Silly me. Okay, let's just go ahead and add home. Let's publish published that page. Let's come down here to Settings will go to reading and my grades Now choose ah homepages but to be a static page and they will choose home as that page safe changes. Let's now go back to the front page fresh and there you go. OK, so that's it. So joining the very next video, where will not begin to make changes to our Ocean WP theme? 30. Customizing the WP Ocean Theme: All right. So let's get started with customizing the ocean WP theme. And, boy, do we have all lot. And I mean, a lot of things to do have actually written down all the necessary customization is on a piece of prepare right next to me. So let's get started. I'm gonna click on customize here less so let's go out to customize and begin to make some nice changes to our stole. Ah, OK, so let's wait for the page to load. Papa! Papa! Papa, Come on. And we called in. I don't have all day. Thank you. All right, so finally, it's loaded. So the first thing we're gonna do is I'm gonna come down here to head out, all right? And let's click in there. We'll go over to logo, all right? And I'm going to select my logo. And I do have the logo right here, something to select, and I'm going to choose everything right here. We're not coping anything. Let's go ahead and simply crump the whole image all over again. And OK, so you can't really see the image because, well, it's transparent. And the background is also white, and the text is white. But don't worry. That will change in just a moment. We do have the max with I'm going to set the max with right here to our 140. All right, let's go back and let's just go over to general. All right? So the background color here, I'm gonna take this to black. And there you go. Now, for they hide for the head up. I'm gonna go ahead and also choose 100 and 40 140 pixels. I'm just type it manually at 140. Okay, now, over here, you've got this style. All right. So there are different ways how you can design the head. And it's pretty cool. For example, if you went with our vertical right here that you would see the head and now to the left of your screen. So they do have other designs in here, but for time, I'm just gonna go ahead and simply choose are minimal, because that's the one I do like, but a feel free to explore the other options available over there. Okay. I think this is all we need to do. Ah, head up. But a bottom. Let's go ahead. and remove the head up. Brought up bottom are Let's go back. Wait here. All right. For the menu. Check this out. I'm gonna go ahead and leave the position to right? All right. So I'm not changing anything in there are we're gonna change. Dole is going to be the link color itself. So we're going to go with White for the length color and Ah, there you go. We don't need to change anything else. Now, you do have this effect off the text color becoming blew a new hole over on it. I'm not going to change that. But if you wanted to change that, you simply come over here and change the length color. So this is where you would make that change if you wanted to do that. I'm so it's up here. I'm sorry. It's right here. It's the one appear the one down here. Which other shootings? For the drop down? It's for, like, the hoodies. What? You stuff like that? So? Well, there you go. I'm gonna go back over here and ah, that is that good on top bar? Let's go to General and in here. You do have the enable top bar. I'll go ahead and disable that. We don't need a top box. So that you go. That is that Let's go and click outside. Next is to go over to the general settings. They'll be on the general options. And then in here you have general settings. So in here you've got the layout style you have wide boxed separate are we're gonna live this on wide, but the main container. I'm going to stretch this over to our 1400 which is pretty standard. And then for the content within sight Boat with will leave that as it is before the layout , I'm gonna choose the fool with for the lay out and for your search results page. When people search for things on your store, What are they looking for? Well, they're looking for products. Most is I'm gonna choose put ups right here for the source are such posts per page will live that are blank. And that is that for the general citizens. Let me click outside. And what do we have next? Ok, we do have some stylings. Let's go to general styling right here. So over here, I'm not gonna change anything. But this is where you can change. Like the permit collars for your links as well. You can add a specific background call and, you know, change tickles of your bodies and so on. If you wanted to, personally, I'm going to change anything, and I'm gonna leave everything as it is. Okay, we're going to come down here now to the tape or graph E Very, very important. And right here you have got generals. I'm gonna go on, general. And in here are you do have the option of disabling Google funds are people's sometimes like to do this energy, improve the speed off their sights. But I'm not going to do that because in all honesty, yes, even the you deserve a goal funds the amount of time you gain isn't worth it. In my humble opinion, I think there are more effective ways off. No increase in the speed off your website if you wanted to our do that. All right, let's go over to body. And now in here, You for the front family. I'm gonna change this from defaults, and I got to go over and say months say that are filthy to use whatever fun family you like . Personally, I do really like monsters. I'm gonna stick with Monserrat, and I'm gonna do the exact same thing for the H one. So do Monserrat for H one for the fun size for each one. I'm gonna make this 34 are pixels, okay? And, ah, the front waits in here would be medium 500. That's for the H one. And then for the age to which we're going to be making use off quite a lot. Let's go with month Senate as well. Ah, the phone size in here. Let me just take what I have. I have tatty pixels for that one, and then the front weight is going to be our 400. Okay, let's click outside. Well, did execs in something for extra view as well? 400 for the front weight. And then for the fun science, this is going to be 26 pixels from family. Of course, would be months and out. And there you go. All right, that's it for the tape or Griffey's. We're gonna go over now to the food tar, Uh, photo widgets limits. See, over here. Right over here. I'm going to set the fixed footer to be on so that the footer is always at the bottom of our screen, no matter what happens. And then you can also add a parallax foot effect, which you will see a bit later. Let's go ahead and turn that one as well. Eyes there Anything else we need to change in here? I don't think so. Are the text color story the text called Down here? Let's changes to white as well. Okay, click outside. Let's go over to foot all bottom as well. Ah, the background color in here. It's said to black, but within the text call over here to white as well so people can see everything. And then for the copyrights Leisure's Do this. I'm gonna change ocean date right here. Let's remove the ocean dates. All said this to copyrights twins. He 20 and I will simply say the cool in capital. It has the cool store. How about that? Okay, click outside and that is that full now. So we've made quite a few changes to the all customization options for the Ocean WP theme. Let's go ahead now and hit, Publish and ah he goes, Let's go ahead. Close this and let's just take a look at the home page and there you go. Now it's looking completely different from what we had initially. But this is just the start. We're gonna be going back a bit later, again to the customization options to make some for that changes. But for now, we've ended our logo. We've made some changes to the foot there as well. And, ah, I hope you're getting really excited for what's going to happen next because we're going to start building the home page. 31. Creating the Footer: welcome backs and a professed video. We successfully made a lot of changes to the Ocean WP theme, and I did say that we're going to start working on the home page. But before we do that, let's fix the footer. First of local. It's fix the food because right now we do have a nice head out with the logo and menu and ah, for me. I usually like to take care of the head and then the photo before I start building. Ah, the actual pages. So let's add some content to our footer and to do this, go over to the back end and I'm just gonna jump all the way down here. Teoh appearance. That's go to widgets. And let's add some cool stuff. Okay, so first in here is the foot out one over here, and we'll just go ahead and add the logo. So I'm gonna drag that custom header logo widgets and will drop it into that side bar. Okay. And then for foot to two, I'm gonna add a menu so you can click on custom any right here, and I can add that and then I can choose the many. We want to display. So I'm just gonna go ahead and choose Thesis, aim foot on menu that we created Alia. So let's add that. And then for food two or three check this out. I'm gonna add a contact in full. So let's add that. So I'm going to remove this text that we have it there. So what do we have in here? We do have an address. I'll live this as it is and simply leave the address. The phone number will live that one as well. Mobile. I'm going to remove Mobile. We don't need that. I already have a phone number. Ah, fax. I'm going to remove everything on the facts as well. Email will live this as it is. Ah, website. Well, not necessary. Skype will move that as well. And there he goes. Go ahead and save this for footer three and then full foot, the full. We're going to go ahead and add some social media Aikens. So let's go down here and see what we do have. Ah, where is it? I don't see the social. Aiken's oh area is social icons. There it is right here. So let's drag social. Aiken's trouble it right there. So follow us. Style is light lived. That, as it is, has come down here. Will add some links for Tweeter phrasebook and, of course, Instagram, AARP interest and ah, YouTube. I guess each people's go ahead. Save that. And then he goes, Let's go ahead now and take a look at what we have. Let us make sure everything is saved. Okay. Should be fine. Now let's go back to the back end. Want to defund it? Sorry. And there you go. All right. So now we do have a rather nice looking Ah, Fota just like that. So you have a logo? We do have a many. Now, I do know that this menu and the menu at the footer itself are the exact same thing. But I wanted to do this deliberately just to show you what's possible with the ocean. WP thin. So if you do want to display a menu or one of these two menus, you can decide which one you want to display. If you don't want to display the one down here are all you needed to simply go Teoh your go to customize. Okay? And then I left us weekly show you you go to customize, and then you will come down. Hit too. Ah, this page always takes so long to Lord, it is driving me insane. Come on, You load this page and okay. Thank you so much. It finally decided to load anyways. So to disable the widget down here, you would simply go to menus. You come down here to filter menu, and then you can simply own check. The one here that say is foot are currently just on Check that one. And you no longer see the menu at the very bottom. So it really depends on what you want to achieve. If you do, you have another many to show. You can simply create that menu if they decide to display it in the foot origin or at the foot itself. So that's really up to you. Okay, let's move on. And while we're costume, when I'm gonna do is I'm gonna make some changes to the way the content in here looks OK. So let's come down here to food, tell widgets and what I'm gonna do is we're not gonna go to our topography. Excuse me? Telegraphy. So Let's come down here to the widgets. All right, Now in him, little take change text transform over to the upper case. So now everything is in Here is an upper case. I think it looks are better this way. Let's go back. Will also come down here to the foot on menu change takes transform to upper case as well. I think that looks a lot better. And then let's do the same thing for the very top as well. The main menu. Let's do that. So we're gonna go about two main menu and of course, will change the text transfer over here to upper case. I think it just looks better for the job down as well. We could do that. Let me just see what it's gonna look like. No case. Yeah, I think that looks as well. Yeah, then that works. In fact, I'm going to change the sighs off the main menu from 13 pixels over to 14 pixels. Make it just a little bit bigger. Let's go ahead and hit, Publish and ah, let's see how this looks like. Of course, all these changes are subjective. If you don't want to make your own menu items are capital letters or changes size by omens . You can leave that as they are And there you have it all. Quedo que have got header We now have all photo as well. Thins of beginnings Look in place. I'm excited So Germany Vendex video Bell will not begin to create AIDS are awesome Home page also you then? 32. Building the HomePage Part 1: okay, It is time for us to begin to build the home page, arguably the single most important page on any website. And the truth is, when it comes to design in websites, I am one off the laziest people you would ever find. I really don't like coming up with my own designs because in all honesty, I'm not that great off eighties. Then it's What I like to do is I would usually go to other websites similar to the one on building and then tried to get some ideas from them. So what I did here was, I simply went to Google and, um, let up. I went to the search bar on my brother and I simply typed in our Calvin Klein and that was the very first designer that came to my mind. I don't know why. Because I don't have any of Calvin claims products. I don't buy any of them, but for some reason, it came to my mind and attempting Calvin Klein. And here we are. So this is called inclines. Ah, home page. And you can see it's very, very minimal. There isn't that much going on. So basically, you know, you've got like, your header. You've got, like, thes announcement in lounge shop launch essentials with an extra 10% off. And then you've got these two buttons in here shop woman shop man. And then you've got two models. The female model on the left of the mill model. Right? And then you go this other image in here as well with another model and the shop now button that will take you to the shopping page. Did you have the, uh, our subscriber forming here and then, you know, a section talking about transparency, accountability, security, and that's it. So it's a pretty simple home page, and we're gonna build something a little bit similar. Teoh this we're gonna get some ideas, some of this, and just to give you an idea of what I'm going for, this is the test sites that I'm building on the side. Very dual test in. And then, you know, I come over to these actual said that begin to do the actual building and recording. So I just give you my walk secret right there. But anyway, this is what we're going for. You can say you have the shop for him for her bottoms, which is very similar to what we have over here. And of course, we got the two models Male, female. We've got the Discover bestselling products section. And then I decide to added this, you know, rather nice section with the image in the background that has the Parallax Air School in effect. And then, you know, the attractive model advertising summer sales and then also the newest arrivals section. And then, like, you know, the transparent that contributed to security section as well, which is what we have over here. And that's pretty much where I have gotten to at this point, so we'll see how it goes. But, um, yeah, let's get started. So I was gonna go ahead and close this and in other first to work effectively with the Gutenberg pitch builder. I have gone ahead to download and installed the goodness, but blocks and Paige go there by Cuba Lee. So if you haven't don't so please go ahead and do so. Let me go over to the back end and let's come over here to the plug ins section while I wait for the pitch to load. OK, let's go over to plug ins. And as against the I do have the Cuba Lee advanced couldn't vote. Gutenberg blocks plugging already activated. So please go ahead and do so own. Oh, there is a new update for the militant for Welcome us. Let me quickly do that. Let me update that. And Okay, so go ahead, install the cube Lee, plug in and ah, let's get started with the homepage. So I'm gonna go back to the home page. Let's go ahead. Now click on edit page. So this will take a straits toothy back end and a couple of things were going to do. First of all, before we begin building the content would be to make sure that the page goes full with and I'll do that down here. Content layout. I'm gonna go with 100% full with All right, let's do that. And then for the header, we're going to disable the top of bar we don't need that will enable the display head out. Let's enable that one. And for the rest, we don't need to change anything in there. Okay, First I'm going to do right now is we're going to add the section containing to the to our models. So to do this, I'm gonna go ahead now and add a block. And what I'm gonna do is I'm gonna jump over to Cuba, Lee, and then in here, I'm going to choose the role block. Let's choose that one will choose the two column layout. So we've got that. So I'm gonna come in here right now and simply click on add a block and I'm gonna go with the image. All right? We're gonna use the Cube Lee image block instead. So that's the image right there. And then in here, where you have the image type right here, you've got the section for adding to the image itself. I'm gonna click on insert, and then we're gonna choose the image off the Asian model. This dude right here, choose him. Let's like that. And then we're gonna do something very similar in here as well. Let's go ahead. Ad the image block, come back here again and then inaudible. Simply add the image of this. Ah, lady, that's at that one. And there you go. So I've got to two images. Pretty awesome. So they a lot of things we're gonna do right now. Let's double click in here for to edit the actual go itself. So right here you've got the content position, so I'm gonna make there's goal downwards, and then anywhere you have got a size, we're going to reduce that all the way to just start 10 so we can make the images of a very close to one another under advanced. We're gonna remove all the patterns you consider. There's petting of 70 pixels, top and bottom. We don't need that. So we'll make this zero and then for the margin top as well. We'll just make this 10 as well and bottom as well. Let's just make sure that is set and OK, next, I'm gonna go back in here, and then I'm gonna choose the fool with All right, So let's go ahead now. Update. And I forgot to do something over here. But you have this styling for the low. Let's set the container to be full with as well, All right, so set full within here. Let's go back again. Update and we're gonna take a look at what we currently have. Let's go ahead. View the page and Let's see. Oh, there you go. So now we've got the two images right there. We still have home showing up here, and I don't like that. So let's change that. Let's come back over here where you have oh, title. We don't expect a title. So let's go ahead and disable the page title. We don't need the title. Let's update and they will go back in here. Let's refresh and see what we have. There you go. Beautiful. Okay, so I've got are two images up the next would be to add the buttons, the shop fall, you know, came shop for her. So let's does go back in here down here. I'm gonna add again the same of low two columns, and then just click outside, click in here, click the button, appear to take this up. So we're gonna add the block right now and again, we're gonna make use of Cuba. Lease are button block. That's at that one. So this will be shop in capital letters shop for him. I'm typing that out. And now in here you have style. There's got to style. We're gonna choose outline. All right. For the button. You're available. Edit this a bit later. But for now, let's just stick with the hash tag. So where you have designed, let's go over to the text call or we're going to make this one black, okay? And then for the border, we're gonna make the Buddha black as well. However, remember that over here we do have the hover effect. You can sit you things change the bag, one becomes black and it takes turns to text color turns to white. So let's do something similar in here as well. So I'm gonna click right here. I'm just click outside, but you have designed Let's switch from normal to hover. So I'm gonna click on hover. So when we hover on the bottom, we wanted to exclude to become our white. All right, so it's white as it is, but they were gonna fill the color with black. So there you go. You can see it's very similar to what we have on the carving clients are site awesome or key. Just click outside. Click back in here. I don't think there's anything else we need to change. Ah, thing that is fine. Okay, we're gonna do right now. is rather than we create in the entire block was simply going to choose the more options right here for this particular block. Oh, I'm sorry. Not that one is Click back in here, okay? For this one down here, I'm going to click on more options, and I'm gonna click on duplicates and then for the second. But I'm simply gonna click on the drag icon like he'll hold and then simply dump right there. So now we have shut for him again. But now it's gonna be shop for her, and it has the exact same designs as well. However, we're going to do some things in here to make this look actually really good. We're gonna move the patterns again. And they were going to make sure that the buttons actually are go down. Because if I update, I'm gonna show you what this looks like right now if I update and I come back in here and I refresh all right, they look good, but we want the buttons closer to the images, right. And we want them right. Want to shop for him to be at the edge on the right and then shop for her to be on the edge at the left, off the image. So let's come back in here and make those changes. I'm going to click on the go. Let's first of all, we moved the patterns again. Zero zero. Let's set the Imagine top to be zero as well. Imagine bottom to be zero as well. Okay. And then right here. I'm sorry. Let's click now. Right here. Where you have again the rolls. Right where you have this. Right here. You have the content position where? I'm gonna click on down right here. So this will push the bottoms down boards. And then for the gotta size, let's also big. This 10 just look differently images and then for the individual buttons. I am going to align the shop for him towards the right, where you have alignment, right? And then I'm gonna click on ship for her, come down here to style, and then ship this one to the left. All right, let's go ahead now and updates and let's see what we have. It's go back in here, refresh the page and Voila. There you go. Pretty awesome, right? However, let's be honest. The buttons in here. They're a little bit too close to the header, so let's actually add some margins. I think somebody's would be good in his. Let's go back, Click inside tuvo call, Go back, go to Advanced and then you have imagined top. Let's add Imagine top off, Let's say 20 pixels. I think it should be fine. Let's update So this one push This will add some space and to the blocks out, Come back in here. Let's refresh. And there you go. Awesome. So now we now have some more space between the buttons and the border off our head up. So there you go. We've been able to add the forced section on our home page. We have the two images of our models as well as buttons for shop for him shop for her, which would go to shipping pages specifically for men and then the showing pictures specific specifically for woman. I will show you how to build those it later, but that's it. Thank you for watching. I will see you in the next class. 33. Building the Home Page Part 2: Welcome back to the people's video is successfully added the force part off the home page. So now let's go ahead now and display votes for our best selling products as well as our newest, our rivals. Let's go to the back and and it was gonna come all the way down here. Click on the plus button. Let's go ahead and add another low with the Cuba Lee. Add on. I'll choose a one column and then for here we just simply go to add the head up block and I'm going to say, Ah, in capital letters, let's just say Discover best selling products, Okay? And then I'm going to align Thies to the center and then right here where you have this plus button just underneath directly. They had not this one down here. This is for like, a whole new vote. But I'm just gonna click on the plus booking right here just on a nifty header and I'm going to know go over to woo commas down here and I'm going to choose best selling products . Let's go ahead and add that and will add four columns, so we have four products. So the event is right now. As it is, we're not selling anything. But what we call this is going to do is that it will simply peak four products just to display. But in reality, if you are actually selling products and I welcome us, we'll keep track of that and will display the ACA waits for best selling products. I don't worry about this. Been long or it not been correct. So that said, Let's go ahead now and update and let's see what the page looks like fresh come down here and okay. Not bad at all. I kind of like this. Now we could add some animation so that the basil in products comes in and any other dramatic fashion. Okay, so let's try this. I'm going to go over down here to where you have. I was gonna click outside. Sorry. Where you have the actual role occupied everything. First of all, let's remove that patterns as usual. I don't know why, by default is has 70 pixels of pattern. That's a lot. Anyway, I cleaned outside. What? I'm gonna do it and I'm gonna click on animation. So we're going to animate the entire vote and there's a lot off. Well, not too many. There's actually Ah, is this six? Seven of them. Seven different types of animations. But I'm gonna go with the flip and the direction will be from delights. And ah, that's what I'm just gonna go ahead now and any mates and they go, That's the animation. Let's go ahead. Update and let's see it live Going to school all the way up the first page. And now. Okay, so well, we didn't really see It's but, um, it's there. There you go. That's how that works. And, uh, okay, we're gonna need to add some our margins, actually, because this is a bit too close to the images of the models. So let's go back in here. So imagine top. We're going to make this hope. That's a lot. We're gonna make this. Let's give this 20 pixels 20 pixels. Okay. Oh, why did I think this would should look better? I'm gonna go ahead now and simply duplicates this entire law also duplicates. We have that again down here. And I was simply coming here right now and change the text form. Discover basil and products to newest newest arrivals and then for those block, we're going to change this, so we're gonna transform this two newest products. Now, this will be accurate because welcome us will simply display the four last products that were created. So it's kind of funny that three of them, Theo Cool Blazer snake is an alum Bagh, actually, three of the latest products actually also created. Anyway, that's that's fine. I guess we'll just go ahead and update this and Ah, let's see how this looks like. Let's go ahead with fresh. Let's come down here. And ah, OK, so not to bed. Although this also has thes same animation. I'm gonna go ahead and move the animation for this particular Erol. Let's come down here and it looks like I'm actually editing the column and not the vote. So, you know, let's do this. This is actually a new feature with Gutenberg that just came with the what? Press 5.4. Sit down here at the bottom. We do have access to the Heracles structural off our page, so I'm just gonna click on a roll right now. Click on Roe And there you go. Now we can edit the world so awesome gonna come down here to advanced. Also, no advanced, advanced appear. And now, animation. I keep getting confused. All right, I'm gonna remove the animation of my teachers, click on the X button and removed animation. Let's go ahead updates and let's go back in here. Let's go first the page and OK, so it's only discover best selling products that now any mates OK, not bad at all. German Avonex Video available. Continue building up and in fact will try and finish. Ah, home page and next video. I'll see you then. 34. Building the Home Page Part 3: well, come back soon. A people's video was successfully added our best selling products as well as the newest arrivals. But now let's go ahead and add the next two sections. And the 1st 1 here is going to be this right here. But you have this, you know, the model in the background and then advertising summer summer sales. So we're gonna try and recreate this, and it's gonna be a little bit tricky. But don't worry. I will walk you through every step off the weights. Let's go to the back and it's go to our page. So the first thing we're gonna do is I'm gonna go ahead and add a role. Okay? Lets at the vote will choose the one column for the role and then inside off the vote, we're gonna add a block, and I'm going to add the columns block from Gutenberg. So it's under. I think it's under for Matin. No, it should be on the layout. Sorry. Layout elements and Diego. So it's on the layout elements. Let's add columns were gonna choose three columns, and I'm gonna explain exactly why this is the case. I'm gonna choose three columns. What I'm gonna do here is First of all, let's edit the vole and we're gonna make this fool with all right. And then we're gonna add the background image right now. So I'm gonna come down, hit your background. Let's choose that when she's bag on type and in here, you can choose the image. So I'm gonna click on Baghlan Image. Let's click in there to insert the image and it's gonna be this one right here. The summer image. Let's go ahead, select. And there you go. Okay. Now, for over here you have Parallax, we're going to say fixed because we're going to make this fixed so that once we scroll down or school up the images just fixed there in the back ground Okey dokey. Over here. Let's just continue with us. Well, to fool with as well. And then down here, where you have the advanced background in certain cases with maybe the image you use me if things look a little bit different, are basically in here. This is where you can play along with how you want to display the image. So, for example, the bag and position right now it's set to center center, but it could changes to left bottom. And that will change the angle from which the images are displayed. If you have a very small image, you can choose to be constantly repeat the image that it occupies the entire width and height. And finally, the bag on size. You can play around with this on the sea how best your images are actually displayed. So feel free to play around with all these options. They are available for you. Okay, that is that for the back down the over label. Take a look at this a bit later. But what I'm gonna do right now is where you have the second column. I'm gonna add Plus, and I'm going to add the advanced text on the Cuba Lee. So over here we have the advanced Texas Go ahead and add that one. And then note, though I'm gonna click on column down here, which is the middle column. Let's click in there and we have the percentage with I'm gonna open the changes to 50%. Can we gonna make that 50%? Let's go ahead now and updates and let's see how this is looking like on the front end has come back down here. But first a page. Let's come over here and okay, so it's time to look a little bit decent. The thing here is this. Okay, The reason why I chose to go with the three columns and not one column or two columns is because if we had gone with one column, all this texture scene right there would be further to the left or right. But we wanted to be a bit more essential. And that's kind of why I decided to go with three columns. That way we can as much as possible central lies, the texts and the head of light in the middle of the Campbell of the background image. That's my said to use three columns as opposed to one column or two columns and let's go back in here and I'm gonna make some changes right now. Toothy advanced text. So let's click on at fast text way day it was Go about your style and over here, where you have the text, I'm gonna open up text. I'm gonna turn on the topography for the fun size. We're gonna go with 24 pixels 24 pixels. Let's click on text again. The text color here is going to be a white. Okay, I think that is fine. Let's go over now to the title. So that's Ah H two. We're gonna make the title 40 pixels. A lot of 44 pixels. I'm sorry, 44. Are we going to change the color as well? To green. This is a little bit too green has come for here. Ah, let's see Then we should be fine. So let's change the text. Teoh, Summer is here. Okay, I think that is that. Let's come down here right now where you have the plus button now going to add They block. I'm sorry. Their buttons. So we're gonna go with the button with Cuba, Lee, and I'm going to say shop now. Okay. And then for the button itself gonna go overhead to style. We're gonna align this to the left in here. I'm gonna add four slash and then shop, which will take them directly to the shopping page. Oh, Kate, that's that. All right, let's change the design, so I'm going to make the text. Color is white. Fine. We're gonna fill this up with the Red Culo. I think that it's fine and okay, let's go ahead and updates and let's see how this is looking like this should be much better now Let's were first a page and there you go. Okay, not too bad. Some of these here. And then, of course, we have the text in their shop. Now let's go back and let's try to add a little bit off some overly so that detects can be a little bit more visible. So we're gonna go back in here. Let me come down here, click on HVO, and I'll go over to the background. Come all the way down here where you have overlay, Let's enabled overly the over lake. Hello, of course will be black. And that's it. Be too much. I'm gonna bring fingers all the way down. Let's go with 0.14 You don't make it to duck because remember that this is supposed to be some are you know, the song is supposed to be shining and you know you don't make the devil a bit too dark. Okay? I think we are fine. One more typical change would be the height. So we can switch from auto to custom and we can go with that. Let's say 600 pixels think 60 pixels should be fine. So content position. We're going to choose middle like their update. Let's go back in here. Let's refers to page and there you go much, much better. Okay, so that Evers successfully added the summer section. But the last time you need to do is to put this section in the middle off the best selling products and newest arrival. So what does come in here? And very simply, right here the very well you have the move a button. Just click in there and there you go, updates. Let's go back in Here were fresh and voila, LA There you go. So the home page, it's starting to look really, really nice. German Next video available. Now add the very last section on our home page 35. Building the Home Page Part 4: Welcome back. Hope you and join the course of those far. Now we're gonna go ahead and finish the homepage by adding two more sections on the fish. One is going to involve some text and a link. So let's do this. I'm gonna come in here right now, and I'm going to add my row. And of course, I'm gonna go with the two columns for the first column. I'm gonna add the heading for Cuba. Lee. So you have the advanced? I'm not. I'm certain of the advanced heading, but just heading It's called Just irregular heading. So gonna add that one. And what I'm gonna do is I'm going to type in some words. So let's go with, ah, accountability press enter. We're going to go with transparent see And then finally security que And then for the second column, we're gonna add advanced text, and I'm going to add for the regular text itself very competent paste, A very competent text. So that's it. We're committed to your privacy. Learn more about the steps we're taking a blah, blah, blah, blah, blah o t. Now let's make some changes to the row itself. First, I'm gonna do is I'm going to add a background off black right there. Let's make this really blacks. I'm gonna type in 000 That is the hex. Abysmal Valley. Awful black, by the way. All right. And then I'm going to make this goal full with Aziz. Well, let's change the collar off our headings. Let's go over to style. Head in color here is going to be white And there's some other things I'm gonna change right here. Like the line height all come down here to advanced topography, Flush the line heights in here. And we're gonna go all the way to 64 pixels so that there is some space between the individual headings. So 64 pixels. And now let's go over to the advanced text block. What's coming on here to style for the title? We're going to disable the title because we don't need a title. So let's close that now for the text itself and when a typing white color for the text and then let's activated topography so we can also add a fun size off 18 pixels. Not too big, not too small. Ah, 10 pixels. Awesome. And, um, that is ever gonna add now a button as well in here. So I'm gonna come right here, and then you can see I do have the option of adding a block. So I'm gonna click on Adblock. And of course, we'll add a button in here and or simply type in, uh, Lin more. Let's go over to the style. Let's align to the left in here for the well. This would normally go to your privacy and policy page, by the way, so we'll all just lived is on the hash tag. Let's go the outline design. Let's come down here to design change the text color over to White Barnacle, a two white as well. Okay, let's go ahead update and let's see how this would look like Let's go ahead and view the page and let's see if we need to make any more changes and OK, it's not bad at all. It's actually looking pretty good, although I would like to add some extra padding make. This will actually be tall. It's kind of short right now as it is, so let's go back in here. Make sure, but edit in the low. Let's go over to advanced and okay, right now, you can see we've got some pad in 70. 70. Let's make this 75. OK, so let's just add split the extra updates and Okay, that should look good. Now, for the final section, we're gonna add a contact form. Okay, so let's go ahead again. Will add. Ah, ro. And then this time was going to simply add a single column when the company right now and the first I'm gonna add in here would be the heading. So right here, I'm going to say, Ah, it's a need to get in touch. Question mark. For this style, we can align this to the center. Let's increase this size to 30 pixels, make it really big, and then the next we're going to do is to add the contact forms. I'm gonna click on the plus button just underneath the header right here. And then we're going to go over to Cuba. Lee and Cuba. He also has a contact form, and we're going to choose it. This is it, right here. Contact form. Let's add that. So over here on the right, where we have style, I'm gonna go with material Instead, I think material looks a bit better and ah, that's that. Let's go ahead and change the design off the button. So I'm gonna come down here to button and we'll stick with Phil. This time let's align to the center. Ah, for the size, we're gonna go with large size for the design. Let's change the text Coehlo over here to let's go with white and then fill Calo will be Ah black. I think that would look, uh, good 000 Enter and ah! Okay, well, let's go ahead now and updates and let's see how this looks like it's coming here. But first a page and look at that. Not bad at all. This is looking pretty good. Ah, living is I'm gonna add some space between the need to get in touch on the actual form. So let's go back in here and our from here in order to create space, I'm gonna click on this button right here, the spacer. So click in there and I can say we have top and bottom self a bottom. I'm going to increase this. Let's go all the way to 30 pixels and I think that should be fine update, and we are very nearly done. Let's go back and see what we have. Okay, that looks a bit better than we originally had. So that's pretty much what we've come to the end off building the home page, Although they all wanted Teoh little touches I need to apply right now. As it is, you can see that Discover, a best selling product, is a bit too close to the model. So we need to create some space there, and we can also create some space between the newest arrivals and these section. Continue the model in the summer sales, and then the texting here for the same ourselves is a bit too big as well. So let's make those changes really quickly. I'm going to go back to the back end and let's start over here. I'm going to click on the roll. Now let's go over to advance. So margin from the top, I'm going to increase this old away to Let's go to 40 pixels. All right, we'll do the same thing here was well, click on the row over to advanced increases to 40 pixels and then the text right here What did we have? The size 24 picks? Soldiers bring this down to 20 pixels. Let's go ahead updates. And I think we should be fine. Now, is this little kind of changes that make a huge difference, actually, in the way your site looks like. And let all see now, okay. Looking a bit better now to be better. Okay, This also looks a bit more presentable right now. No. So I have always looks a bit Klina and Ah, there you go. Okay. I'm happy with what we currently have. Off course. You can always create a bit more space that space them out to your heart's content or whatever you feel is appropriate. In all honesty, we could still add a bit more space between the titles and then in the images themselves that something could be done in here as well. But are Phil for to do that on your own? So that's it. We've come to the end of building our home page. Not to better, though. And I hope you've enjoyed this ahjumma unveilings. Video available. Continue building out the rest off the website. 36. Building the Clothing for Men Page: the next page I want us to build is going to be the page for the shop for him where ideally , if anyone clicks on this link, it should take them to a page displaying all the products specifically for men. So let's do this around. I'm gonna go to the back end, and I'm going to add on new page those pages add new, and I am going to call this clothing for men. Okay, so let's go ahead ad our role. Go with the one column. Now check this out. I'm going to click on Adblock and we'll go over to woo calm us down here. And then I'm gonna come in here right now and choose products by tag. I'm gonna click in there and then I'm simply going to choose the tag called a man Salt happening here, man, take that click. Done. And there you go. Over here, right now. Where we have the design. I'm going to switch over from three columns. Gonna come down here where we have one go. I'm gonna go with our three rows. I think I've got seven products in total for men, so I think three rules with records should be enough to show them all. And ah, well, that's pretty much it. Let's go ahead. Hit, Publish published again. And there you go. Let's go ahead. Don't view the page and voila as simple as that. Now our men can come to this particular page and by putting specifically for them now, in a situation where you haven't tagged all your products with men or women and looking for a different way to display this well, what you can do is you can also display products based on categories. Right. So from here, I can come down here. Let's go to the plus button at a new block. Let's go back to welcome us. And then over here you have the where is it productive by category. This is the block right here can click in there and then all you need to do white hairs to simply choose the categories for the mail. So this goes right now I've got blazers of God who these after the T shirts, I've got this sneakers and I've got the watch is all right so I can put them right there. I can hit done. And there you go, So right now this will display all the products by that categories. Seconded, exact same thing again. Make it three rows and ah, there you go. You're just basically getting the exact same result in a different way and defend manner. That's basically what that is. So let's just go ahead and remove this block and updates the page. And there you go. So good. That exact same thing for the women's pages were clothing for women are warmth, and we could also do is to go back to the home page and to know, added the link to this particular shop for him. Buttons. I'm gonna go back to edit page, and while we're at it in this particular section holding the buttons, I'm gonna come over here to the row and let's quickly add some more margin. So let's make this. Ah, let's go all the way to 50 pixels for the margin. All right, for the top. All right. So for the shop for him, I'm gonna click on the button right there, and I'm going to go over to style we have bought in your Well, I'm simply gonna had the Ford Slash and then clothing Dash four Dash men. That's the link right there. Let's go ahead updates and let's see how the page is gonna look like, Okay, shut for him. Click in there. And of course, that exempts traits. You the closing formations page. Pretty awesome. One more thing you could do is you could also come in here where you have the main menu. And then instead of using the custom link that Limoges quickly show you isn't of using the custom link that we are created powerful men and women. You can simply come back in here right now and then add the clothing for men. You could add that So imaginative for the menu. Two main menu instead, Not the full time. And you Okay, so for me right now, you can add clothing for men, add to the menu. All right. And then from here, you could just simply click on the job. Done. I will in here and then simply changed the navigational able to just men. Okay, let me click like here, and then just come back in here right now and switch. Make men the main I. Tim, Let's remove the cost tumbling for the men would move that one and then we just come in here. We arrange the categories and that you go safe menu and voila, we don't. So now, anytime anybody clicks on the men bottom right here, it will take them streets of inclusion for men's page. So that's that. You can do the exact same thing for the woman's our page as well. Thank you, Fortune. I will see in the next class. 37. Customizing the WooCommerce Pages: Okay, let's now take a look at the remaining welcome us page A starting off with the single product page. And just like with shopping page, we do have the side bar to the left, and I don't like that. Let's go ahead now and hit the customized buttons. You change the way our single puts look like. And, as usual, I'm gonna come down here to welcome us. We're gonna go over now to single products. Let's go over here and I'm gonna suited layout over to fool with and ah, voila. There you go. Right in here. We're gonna We're gonna make a few more changes. You do have the enable Ajax to add to cart button, which I will check to improve theatrical button. And then down here, you have the up cells and related items. You definitely want to display this to try to improve our conversions. And then down here you do have the display floating box set to Yes. What this for Tim Bar is this notice that if I begin to school down, we now have this bar show up showing the brother with selected as well as the price and nd out to cut bottom light day. So this psychologically helps to improve conversions. And I would have a recommend you keep this set to Yes. This, of course, would only work if it did. You do really have an item in your cart. And of course, in here you can change the design off the floating bar. Okay, that's it for the single product. Over here. We have general in here. You could decide to walk with the costume. Are woke Hamas side by if you wanted to, but I'm not walking with side buzz. If you go over to your widgets section, you will see lots of rigid specifically for welcome us. You can work with them if you want to, but like I said, personally, I'm not gonna walk without a side buff in here. I know we haven't walked with the products on sale stuff like that, but if you set a put on sale in here, you can change the design of high would look like so you can add a badge. It s square or circle. And then, for the actual content itself, you could either say they're insults. Exit which would say are on sale Or you could go with percentage where it could be something like 75% off or you know something along those lines. Okay, let's go back down here to your menu. Caught. Now, you don't have the option of hiding if it's empty. So if you check the box right here, no one will see the shopping cart on teal. They actually add an item. I think it's a good idea over here. You do have the display. So you've got currently right naked. So here we have the icon and then the account. Secret chains don't want you something else like, say, can't account and then total. So this would actually show you the, uh Well, it's not. It's not even showing us the price. I thought it was gonna show us the full price. Why did, anyway, My important down here, you do have to cut icon that you can switch to you know something else. And of course, you can change the design colors and so on. Let's go back. We've talked about Al Qaeda's with their logistical product and not for the card itself. Over here you do have a distraction free card. I will know a command. You do that. And I'm gonna tell you why in just a second, let's go back. Let's go to check out. Now, I'm gonna go. Gonna check out page right here. And to be honest, you don't need the company name, field. I think that's it's not necessary. So I'm gonna remove this. All said this to hidden, Addressed, lying to as well. In fact, I have never field they had just lying to before. But who knows? Maybe he said 10 people in setting countries do have a line to for the address are just leave that optional. And over here for the phone field, I'm going to hide this one as well. Customers should not need to provide you with their phone number. I think that's a bit too evasive. Invasive? Other are Paris and policy pages without supervision policy. If you have your terms and conditions Pedro told, recommend that you create you simply come in here and said that page to, uh, it right here. Let's come down here. Over here. You've also got the distraction free check out now. There isn't why I don't recommend these is because if you check this right now, you check the destruction free, check out what's gonna happen right now is that on the check out page, the customer can no longer exit this page. You can see the menu items have been hidden. There is no back to previous page or back to the car page. And it's like that. This is what the destruction free check out babies like. And I don't think it's a good idea. So I'm going to uncheck that and that. Is that all right? Let's go ahead and take a look at the advanced styling. So in here, you can change again. D on sale background. Our colorants came out of stalk your stars and so on our product entry as well. You can change also. Of course, in here I'm not gonna go into that. And then finally, you've got to put images. Now, I would only recommend that you make some changes in here if you don't like the way your images are currently being cropped so you can experiment that come in here to unclog, to control and corrupt. First of all, I can go with custom, or you can simply come in here and set a particular said with main image with and then a thumbnail with for your images. So feel free to play around with this options If you don't like the way your images are currently been corrupt Last but not list, you've got the stone notice which isn't too effective, because if I come in here right now and I enable this, basically, this information will be displayed at the bottom off your screen. And ideally, you want to display notices at the top off your website in case you're running maybe Mitchell sales or stuff like that. I'm going to show you Hey, can do that a bit later. So go ahead and he's able they're still notes is And of course, of course, publish my changes. And while lot there you go Awesome! So that's it. Have successfully designed our worksite German of endings video bearable. Take a look at the responsive design 38. Responsive Design: Okay, let's take a look at a responsive design, and you should never, ever forget about responsive design because almost 50% of people now spend more time on their phones than they do on the deck. Stop. So you really want to make sure that you said looks great on all mobile devices? Now the good news is by default. Ocean WP theme is very responsive. Let's take a look at what we currently have. If I minimize my website right now, minimize the screen, you can see that he had a looks fantastic. I mean the menu. This is awesome. This looks beautiful. There is no need to change anything in here at all. Unfortunately, though, the buttons they shop for him shop for her out of placement to fix those. Let's stroll down here and let's see what else we have over here. We no longer see the model in the background, but that's because the background image itself the model was not centralized shows more towards the right. So personally, I don't care about that. But if you're interested in showing your models and the center, make sure you have an image. Red model is in the center over the image. The rest of this, that looks pretty good. There is no need to change anything else in here. Even at the smallest our screen size, the photo looks fantastic. Everything else looks pretty good. I like I like what I'm saying. There's really no need to change anything except the shot for him and then shot for her buttons. So how do we fix this? Alright, what I'm gonna do is I'm gonna go back to the back end and then from here, let's go ahead now and take a look at the buttons s. I've clicked on shop for him. I'm going to go over to style. All right. And now over here, where you have the alignment, make sure this is set to the phone, and for this element, I'm gonna choose center. We'll do this engine for shop for her as well. Make sure this is set to center for the phone. Let's go ahead. Update. And we could do the same thing for the table as well. I'm sorry. Let's do the exact same thing for table it for both of them. Okay, updates. And now let's go back. Let's refresh the page, and now they should look much better. So there you go. Now shut for him. Shop for her and now align perfectly at the centre at all. Screen sizes from table. It's down to the mobile phone. Okay, this looks better, but in a lot of steep. This isn't exactly the most effective design, because, ideally, ideally, you'd want to display the male model and then maybe shut for him on the Nathi, the image, or maybe even inside of the image, like a centralized button as well as the same thing for our shop, for her as well. So we could do that. But I'm going to show you something that we could ah executed really quickly. Okay, let's go back to the back end. And what I'm gonna do is for this particular our column holding. I'm gonna come down here, click on column, so for to call him holding our buttons. I'm going to come down here now. Let's go to advanced. And then down here you have the option of hiding on tablets. I can say highlands. A little highland phone. I will say Highland phone for now. Okay. And then let go ahead updates. Now let's see how this looks like right now. Let's refresh the page and then minimize again. All right, so shut for him is gone. But we also needed to something for shop for her as well. So let's go to shop for her. Go to advanced and then also ah, hide on the phone updates. Let's go back in here with fresh minimize the page and they go so that both buttons are now gone. But we need to make this two images clickable. Okay, so to do that very, very simple, we'll go and click on the image. And now down here you now have the u. R L. But you can add the link for the image. So inhale Principal Now, added the shop. I would say clothing. Ah, full men. Okay, and then you could do the exact same thing for the clothing for women as well. So I go ahead now and updates go back in. Here were first page. Let's minimize the screen, and then I click on the male model. It's going to go straight to the clothing for men's page, so that's exactly how you could fix that. So there you go. We've been able to fix the buttons. We've actually hitting them. But now we've made the images of the models clickable, and that is pretty much it for the responsive design. Other pages, all responsive by default after really check them with the Ocean WP theme And you can see, for example, the shopping pigeon hair looks very, very, very good. No need to change anything at all. And that is pretty much about all the comment, of course, that you take a look at your entire site on a mobile phone and fix any issues that might that you might see. So that's it for the responsive design thinking fortune. I will see you in the next class. 39. Final Thoughts on Design: All right, so that's it. We've come to the end of this section where we've designed the stall and before I go on to the next section I just wanted to give you are a few more tips. Feel free to check out although designer websites or their stores that sell clothing and so on. For example, with Kevin Kline, where I got the inspiration for the shop for man ship win buttons in here, for example. If they click on shop men, you can see it takes them over to you. This very, really awesome looking page where you now have, like, images of all the man's our products listed out. And it's similar to what we currently have, except for the fact that these have, ah, lot off products, many of them. And, of course, these are professional photographs, professional photographs off the models and the Kevin client, you know, products. Basically, so that's one of the major differences, and it goes in here you can see the books have on sale prices, regular prices and so on. So the problem's gonna make here is that feel free to take a look at all those sites and try to get some inspiration from there. And you are, Look at this and you do have the on the remodel for the woman's page so you can see how the woman's clothing page is designed. It's not like what we have in here for the shot for him, where you basically have all the products for the men listed out Very, very, very simply in here, you know have, like the categories been listed. Also in here you have the underwear, which I will take a look at was once I'm done with this video, you've got the on the way category right there. But you also have the apparel category. You come down in here and you can see different designs and so on so you could get some expression in his So, for example, for your men's clothing page of the women's clothing page. Rather than displaying all duplex at once, you could simply use thedc. You believe Ole, And then you could add like, uh, a background image and an added button specifically for the Let's say the Blazers products . And then when I click on a button, it will take them to a page specifically for Blazers. And, of course, you will do create a page the same way you could have, including for man a clinic for women. Simply choose, put us by tag and then choose please as a truce, put us back category and then choose blazers. So that's basically how you would create something like this. So feel free to check out what they have on the other pages. The home page, the sales page, take a look all they have and get some inspiration. Gutenberg is not the perfect. It's not the best page bill that out there for what press, but it has come a long way, and with the help of Cuba Lee, you can create some really good looking our pages. That's all I wanted to say. Um, Phil, free to experiment with different kloten schemes, although they don't get to colorful stick with black or white. If you notice most of this ah shoppin websites, the designer websites they typically have lots of black and white, essentially, so don't go gung ho with colorants came. You could try different fund families if you wanted to defend fun sizes, but also remember to keep your pages are clean and treasure. Advertise your products. Ah, whenever possible. So that's pretty much it for the designing off. Cool stop German Vanek section Will will now begin to enhance the functionality of our store. 40. Section 4 WooCommerce Functionality Preview: I hope you enjoyed the Beaver section on design. Now let's move on to the final section where we will be enhancing the functionality off our store. Now as it is right now, we do have ourselves a complete store. We have our products. We have a payment gateways. We have shipping. We have coupons we have to design. But there were still some extra functional we can add to really make a welcome a store, a world class stop. So coming up in this section are walking you through a few plug ins that we can use to enhance the functionality of. We'll talk about how you can manage refunds, how you can allow your customers to be able to choose the delivery dates, how the contract, the orders and so much more. So with these extra functionalities, your store would really be a complete want. So without wasting any time, let's get started 41. Managing WooCommerce Refunds: Let's look about how you can enable your customers to ask for refunds and also how you can process those refunds. Now, as a business owner, you don't pray for reforms. You don't want customers asking for refunds, but it's inevitable. Eventually, you're going to have one or two customers who would not like what the but from you and they would like a refund, and you need to have a process in place where you can take care of such requests. Now the plug in I'm going to produce you to hear is the youth advanced. We phone system for woo commas. There is a paid version, but there is also a free version. I'm gonna show you exactly how both work. So I have already gone ahead to install the free version off the plug in. And if I go to the back end as a result of me installing the plug in, you will know, see youth right here and then if I hover on that, you will not see the advanced re phone system. Plug it. I'm gonna click in there, and basically, with the free version, you have access to our very basic settings off course, you can allow refunds. That's the whole point to keep this enabled. Don't in here. You can set the number of days that your customers would have for them to ask for a refund from the day they actually bought the product. So the default is usually 50 days, but this will depend on you. And then, of course, you can also enable taxes in this case if you want to. We formed the taxes that customers may have paid. I think it's a good idea, so you can keep this checked as well. With the premium version, which, unfortunately I don't have access to. I'll show you what you can do with the Eurovision a bit later. Let's just stick with the free vision for now. Linda, save my changes. So right now as it is, if I go over to my account, if any customer goes to their my account page, they would now see down here my refund requests. Okay, So if I click in there because I haven't made any reforms myself, you will see this message. But in a situation where they've made refund request, they were city requests right here. Now let me switch over to customers my account page and show you what they will now be able to do with the plug in. All rights are switched over to you, the customer, Dick Jones. And now our Mr Jones can come down here to the orders that has made from the cool store. And when he clicks on orders right now, he will have the ability to click view for the orders that he's made. And then from here, he will now be able to refund he's entire order. That's the R button like a sick and clicking there. We found my entire order. This bubble books will have will appear asking full reason a them just say I don't like them. Just say that submits and OK, so the refund request has been submitted. Now, if Mr Jones comes down here to my refund requests Ah, he will now see that we found a requester he's just made now switching back to the admin view. If I come down here to youth refund requests and I click in there now, you can see the refund request made by Jones so I can simply go ahead and edit the request . I can basically view it. And then over here I can now choose to. We stopped the selected amounts. I can choose to reject the request. Maybe. Can we phoned by PayPal, which was the system he used to make the payment, or I can reform manually. I can also write an answer to them in response to the reason they gave for requesting for the refund. So that's how the entire process walks. It's very, very, very cool. However, the major downside of reason it's the free version is that customers can only make a refund request for the entire order. So in this case right now, Mr Jones did not have the option off selectively choosing which product he wanted to ask for a refund. So maybe out of this three, maybe he didn't like the locks. Wished, walked right. Ideally, he should be able to specifically request for a refund for the looks of his torch while keeping the blazer and the sneakers with a free vision. Unfortunately, you don't have that luxury, and that's where the paid version off the are. Plugging comes into play. So with the paid version, your customers will be able to specifically ask for which products they want to get for a refund, and in addition to that, let me show you. In addition to that, you can. You can choose to accept all requests automatically, although I would not recommend that you might wanna manually review every request for a refund. You can also offer a coupon in exchange to them, and then you can also choose to automatically restart the products once the reform has been processed, and then over here, you can allow reforms based on the order total. You can also allow a file upload. This would be very, very, very good if your customers need to upload proof off why they need to ask you if I may be the put it came damaged from shipping. They can take pictures, upload to them that would be very cool. So in all honesty, if you're building a real store out hand over command, you check out the paid vision of this particular plugging because reforms on essential part of any Yokohama store and it's not that expensive. I mean, for one single site, I can get it about 60 euros. So that's it for managing the refunds. Think of Fortune I will see in the next last 42. Adding Product Sharing: the next functionality where Adan is a very simple functionality, but one that's also very important. And I'm talking about the functionality fall are sharing products. You want your customers still able to share your products with their friends online? I mean, imagine if a customer comes to your side. They see this particular product. Maybe it's a sure it or something else, and they really like it and they want to tell their friends or their family members about it. You want to make sure that they can share those products with them, So we're gonna make use off this plug in will come us public page social share by Sajjad Hussain Sir Gore. I may have butchered that pronunciation, but anyways, I have a really gonna hit to download, install and activate the plug in. And as a result, down here, you can see the social sharing link right there. So I'm gonna click in the first of all and take a look at what we have for the options. So ever hear. First of all, you want to make sure that you can show the puck sharing buttons that we're gonna turn this on now for the position. There was quite a few places where you can place the our position of the Social Aikens. I would recommend either before the product title or are after the odd to cut bottom. So I'll go with the art to cut button. But no feel free to choose your own preferred position for the button style. I'm gonna go with the circular like those Now, over here, we need to add the social services I'm gonna add Facebook, Twitter, Pinterest. Ah, what else do we have? Your fears with missing Joe. And, um Yeah, I think that's okay. I'm gonna go ahead, save my changes and how finally you have the option of going with icons only, or text with icons. I'm gonna go with Aikens only. Let's go ahead now, save the changes and let's see the effect this is going to have. Okay, let's not go over to view one of our products. Then go ahead and take a look at the law Rex wristwatch and ah, the au go. So down here right now, you can see the Aikens Ah, for sharing this particular our product. So very, very simple Plug in very simple settings. But very, very effective. And hopefully you will make lots of cells with this. Plug it and I will see the next class. 43. Adding Order Delivery Dates: Let's take a look at the youth woke Lemus delivery date plug in. And the advantage off this plug in is that it allows your customers to choose a specific day when they would like to have their orders delivered. This is a fantastic addition to any woke almost store and let me show you exactly how this works. I have already gone ahead to install, download and activate the plug in and down here. You will see the order delivery date. We all walking with the free version, by the way. But there's also a paid version will talk about that a bit later. But if I click on the link for the plug in, it's gonna bring me to this page. And by the way, if you're watching this tutorial and, um you know, and this will have this particular promo running, this is until April for 14th 2020. You can get it for for the 9 50 but the chances are you probably gonna watch this a bit after this particular date. But anyway, let's just move on. So over here, I'm gonna go ahead and enable the delivery date capital on the check out page very, very important. Now, over here, you do have the option of true's in what days you actually do delivery. So you have Monday to Sunday basically, by default minimum delivery time. Now, this is important because whatever you put in here, world will represent the l E est date from which customers can begin to ask for our delivery. So you want to be very, very, very careful here. I'm gonna go with 72 hours, which is three days. I'm just going to assume that within three days, no matter location off, the customer will be able to deliver the product to them. But again, like I said, to be very, very careful what you put in here. Number of deaths to choose default is 30 days. So basically they can choose 30 days or 30 different dates for the delivery. That's cool for the down in here. You can make it a mandatory Phil, but I don't think you want to do that. Are maximum order deliveries per day, which is also based on per order. I'm gonna go with warm, Okay? We can only do one delivery per day. No more than that. Sort on willkommen orders page. You can enable the full certain of orders, but this is not necessary. I'll just I'll just leave this oil unchecked. Auto public, first available delivery date. So this again is optional. It's relative. You want to do that. By all means, I'll just stick with that. There's no point on chicken that now. Over here, you've got the apply minimum delivery time for non walking weekdays. This is important if you're not the living every single day. If you are delivered every single day, this doesn't matter. But he delivered only monitor Fridays, for example, Are you want to come in here and check this box? So in here you have an example of how it works. It stays. If the minimum delivery time in hours set to 48 minus 72 and Saturday is disabled for delivery. Now, if a customer visits the website on a Friday, then the first available date will be Monday and then not Sunday. So like I said, this is important. If you're not delivering our every single day and ah OK, that's it for the basic settings on. Go ahead and save this and let's go over to the appearance now you can also customize the way it looks like nothing much to change in here. I'll just leave the defaults. Aldo, over here. You've got the fill placement on the check out page, or where would you like customers to be able to see the auction off? Choosing their delivery dates in billions section is the default, but you can, you know, customizes if you want to delivery date field on the court page. Not necessary. I don't think so. And then over here you've got the themes there are. There's a whole range of different themes that you can choose from. So choose the one that matches the theme that you're using in this case for Ocean WP, this is perfectly fine now. If you're selling virtual products, then you don't need a delivery dates because the delivery should be instant light. They buy the virtual product. They get a download link so you can disable that for your virtual our products. Let's go ahead, save the settings and ah, okay, now holidays in here. You can also create holidays. Maybe it's the holidays. Christmas holidays. You can put the name the dates and then you can also choose to allow this to call our every year. And then you can save your settings. And basically you will not be or providing any deliveries on that particular date. Oh, OK. Lets go of our to the stole and see how this would work. So I'm gonna go over to my cart. Let's go ahead and proceed to check out. Basically, let's proceed to check out and ah, over here right now. Let's come down here. Over here. You can now see the delivery date option. Right now, it's set to sixth of April because today's date is third of April and I said the minimum delivery time to be 72 hours. So six of April is the next available date. And of course, they can choose from sixth off. April old mate Ill. Fifth off May, because we said today's as a number of gets they can choose from. So that's basically how this would work. Now, when a customer chooses a date and then makes the payment ah, you will receive the email. You know that from McComas telling you that a new product has been purchased, you will see the delivery data noted. There as well. So don't worry about you not seen the delivery date your our customers have chosen. Now, here's the example of the kind of email that you as the story when I would receive. Once a customer has made a purchase and they've chosen the delivery date over here, you can see right now that Mr Dick Jones chose Mr John Jones this time the brother off Dick Jones. He chose the delivery date of 16th off April. So you as the shipowner, you would see this and also Mr John Jones, their customers, they will see the exact same thing in the receipt that they get as well. So that's basically how the plug it works. Now, with the pain vision of the plug in its far more robust, you have far more options available, and the quite a lot. And it could take me the entire day just to tell you what else you can do with the paid fishing of the plug in. But you can see it right here. There are so many options you can show these available for delivery increased the shipping fees as well for specific days are some before weekends. You can enable became delivers, but that will cost more. As an example, You can split delivers into time slots as well. Very, very, very cool. So rather than your customers telling you that you can deliver on a particular day, they can even more specific and tell you a particular time during that day that they can get their delivery is very, very, very cool. And you can see the other options in there much, much, much more. Our options available with the paid version off the plug and so I'll be sure to check it out. If you are interested, think a fortune. I will see you in the next class. 44. Adding Notification Bars: Ideally, every once in a while, you might want to make a major announcement or a major promotion on your side and the best way to capture the attention of your customers so that they see that notice is by creating in notification bar. And the best bargain for doing so is the custom notifications. And let's plug in for what press by my theme shop. I love those guys. They make awesome themes and plug ins. Now they do have a paid vision of the plug in which I'll show you how to walk with. But they also have the free vision, which I have already gone ahead to install, and I have also activated the plug in. Now, when you do the same down here, you will see the notification boss. Just go to add new and let's add the new notification. So let's imagine it is the best time of the year caressed minutes. I'll love Christmas, so Christmas Sale there's just used it as the title of another big notification bar. So on the general, you can choose the hideout, close button, toggle button or close. But I'm gonna go with the Tuggle so they can open and close. The content with is 9 60 but the sisters position that sets it fixed. So this doesn't really matter. And I'll recommend that you just keep these as they are now for the content itself. It can go with Edda a link or button. I'm gonna go with button and then any You've got the text, which I'm gonna go ahead. And, um oops. Sorry. Long pasting the text is going to be Christmas sale, and I'll say 75% off all products. Okay. And then the button text now was going to be a shop. Now I'm gonna say shop now and then the UML, I'll just come in here and simply add the fourth slash and then shop. Okay, Now, over here, you've got custom. You can add custom shut codes, but these are not really I've never actually walked to these before, to be honest with you. But hey, do you do have that option? Hanaway? Let's go over to style. So in here you've got the bag. One call all the text collar, the link color as well. I could change this to something else, but I'll just leave that as it is the phone sizes. Goethe, 18 pixels. And then finally, you've got the conditions. Do you want to display them on specific locations? Yes. I'm gonna go with the home page. And then you could also choose to not show how customers who come from Ah, from from Google. I'm sorry. You can show the bar if the customer has arrived from Google, or you can choose to not show the bar if they came from Google. So hide it. And then the same thing that plays to our freeze book as well. Gosh, I got a bit confused over the art. Let's go ahead and hit. Publish and let me show you how this is gonna look like you Do. You have the preview bar right there. But let's just go over to the fun and end. There you go. So right now, when the customer gets to the home page of your site, they will see this notice that Oh, my gosh, it's 75% off all products shop. Now let's go to the shopping page and little start shopping. That's the whole idea behind creating the notification bar now with up a division of the plug in You have access to so much more awesome features and I have already activated the premium version. So let me show you what you can do with it down here. Right now, you will see we now have access to settings. So on my sentence page, you can now choose to support specifics. Both steps like your products, for example So you can now choose to display the notification specifically on put pages. That would be awesome. You also have the import export options where you can choose to export your already created information bars to other our websites. Basically. So for the actual design off a notification bars, you now have access to so much more features. Lemon, quickly show you what you can do. So on the general, for example, you now have access to choosing our Aikens for your buttons or your links. Are you confusing? It shows that to be opened or closed if you prefer. But I think opened I would make a lot more sense. You can also add animations as well for your bars, which would be pretty awesome. And you can also add the admission for the content as well. That's available and now, for the content itself are over here. You can choose to open up the link in a new tab once they've clicked on the link or the button. And then over here on the left, you can choose the different types of content you actually want to use as your notification . As an example, you've got newsletter so you could create intensification bottled up here urging your customers are encouraging, of course, must have signed up to your news letter. So you choose newsletter. You can add a text in here saying Santa for newsletter and receive exclusive deals and or something like that. And then you consider choose the service they're going to go with and then add the necessary information and you are done pretty awesome. You know, also have the pop up video where you can use videos as you notification are bars instead, which would be again incredible before the sliding option, where you now have, like a slide that would slide in. And then, of course, you've got the countdown timer, which, in fact, I am going to use. So let's now say that's uses like I'm going to say basically, it pays the exact same thing again. Ah, so I will say Christmas. Ah Sil, All right. And then all six and 5% off all products. So the countdown right now would be from, let's say, the third of April until let me just choose, not sort of a bomb. So until the fifth of April, letter and at the time here would be Let's go with till nine until 9:30 a.m. 9 30 a. M. Done right now. And it's all having a Christmas ill doing April. But, you know, these are strange times that we live in a way. I've got the call to action button which will be shop now and then the euro will basically be shop. So basically, we're week. We could recreate in the text and link button with the countdown time. Our content. So what I'm gonna do is in here. I'm going to simply remove this because we no longer are going to use this one. We're going to use the countdown timer instead. Let's go ahead and update and let's see how this new improvement of fishing boat would look like and check that out Christmas l 70% of all production. And so the countdown timer counting down and you've got the shop now bottom there as well. Pretty dope. I pretty awesome. You even have the enable split test where you can test how to two different types of notifications that's a bit more advanced. And maybe in its another point in time, I will create a separate our video on that one style. As usual, you have access to most and options you can add front. Wade's line hides a langur text and then conditions. Oh, boy, you have a lot more options. You cannot just to show not only on the home page of pages opposed, but also on your product's pages as well, which I will go ahead and choose that one for specific products. So, for example, if you wanted to display a particular promotion for one product, you can create a promotion and come down here and shoes that product by the lead by the products. I d. Simply typing the idea right here and that bowel Onley show for that specific product. Incredible. And that's it. Over here, you've got the Joyner's show, the bar. If the mysteries locked in If the Visto is not logged in maybe only on mobile devices and so on. You also have the show from one specific timeto another. So many more options, so much more powerful than the free vision off course. And that's basically it. So if you're interested on halibut coming to check out the are paid vision of this plug in for three said, it's only $29. It's not that expensive. Oh, actually, for one site you can get it for on $19 So it's really not that expensive at all. And hello encourage you to check it out. And if you're serious about building really cool, awesome stole, do get the pay division of the plug and think of Fortune I will see you in the next class. 45. Adding Order Tracking: Let's take a look at an awesome functionality you can provide to your customers, and that's going to be their ability to track their orders. And this is a fantastic feature which I believe you should provide your customers in your store. So the plan we're gonna be walking with is the Chief Wu Commas order tracking. There's free version and is a paid version. Let's work with the free version. First of all, end right now if I go over to my site I have installed I have activated the plug in and you will see it over here We have yet you can see I've got the order tracking. So what if we version? You have access to very basic settings in here. I have set my default carrying him to be DHL. This provided only one option. I guess you would go with the carrier that you use the most for shipping your product so it can be DHL, American Express, Alibaba where every wherever you live, you know, whatever curry is available over there. So I used DHL and this is the default text that your customers would see on the orders page or she that in just a second. And then you've got the position available to like to display the track, encoded the information. Sure. On top is the default. I'll leave that as it s so not much to play around with over here. What I'm gonna do right now is I'm going to go ahead and simulate what would happen with the customer and you as a store owner. All right? Right now, I have just made an order for the Copa bracelet. That's Dick Jones. So let me go back right now and act as a store owner. I'm going to go over to woo commas and orders. Okay, so limits opening so you can see right now from Doug Jones, three minutes ago. Okay, I'm gonna go ahead now and take a look. So for me right now, you can see and now have access to the order tracking section second company right now and add code which I came up with 45679 police. That's a very, very interesting code. The career name in this case would be DHL. But the thing is, if I used or if you use a different Kamiya for a particular product. You can always come in here and change that name. So it's not like you have to stick with one career the entire time. The detail would just be the default. So that's how this works. So pick up dates. Let me say they will pick this up. Let's say they're gonna pick this up on Sunday. Okay? 25th. I'm so 1/5 of April 2020 and all those Go ahead now and complete this transaction. Let's go ahead now and update. And there you go. All right. So I've provided the tracking code and have told Mr Dick Jones that Sunday, Fifth of April is when the product will be picked up. So let's go back to Mr Dick Jones. And that's refresh this page when I got to say anything over here yet, but if Mr Jones goes to is my account page and then he goes over to the orders page and then he takes a look at the order he just made for the bracelets, which was sort of April. He can click on view now from here. All he sees is that okay. The order has been placed and it's currently completed all right, that's all. He says nothing about the shipping. But if I go back to the site and now over here, I say order has now been picked up, and I go ahead now and updates. Guess what's gonna happen now. If Mr Jones goes back to use my account page to the order details for the bracelet, Let's go first. This page. Now, you can see that information is now over here, and it's known saves Your order has been picked up by DHL. This is the track in Cote. So now Mr Jones can now begin to truck with DHL. The status off they plugged that he bought from also. That's how the provision off this plug in works with the free version of this plug in your naturally going to have access to a lot Mawr features. So it here I have already installed and activated the premium version. So the Mitchell differences is that unlike the free vision where you can just choose one single career over here, you will have the carry as tab and you can choose from all the carriers in the entire walled. Choose which ones you walk with. I have chosen Ellie Express. I chose detail and I chose FedEx. So they have that been selected. If I go over to the general tab right here now, I can choose the default career. In this case, I'm still gonna stick with DHL. But then you now have a lot more options. You can choose to automatically said the order status two completed. Once a order has been picked up. So I can say, OK, let's do that one. And then, of course, just like the deprivation, you can edit the message on the orders page and in here you can also choose to have the track and in four in the order list really, really important. I'll show you how this would look like. And then you can also change the e mails that will be sent ones. The order has been picked up. This is not available with the free version, but with a paid version. Your customers will be notified by email once the order has been picked up. Very, very, very important. So let me go ahead and just show you how this would not look like from the perspective off the customer. So the major difference here now is that the Jones will build now see the life, track your order link. And if they click on the Link waiter, it will take them straight to the carrier and the page where they can track their order off course. There is an ever here because the 4569456789 police tracking court is not a real tracking code. So and that's what you get, basically, with the paid vision off the plug in, and as of now it is available for 60 year old. So if you're interested, I will definitely recommend that you check out the paid vision off the plug and I'll see you in the next class. 46. OceanWP Premium Extensions: all right. Before we round up this section on enhancing the functionality off. Welcome a store. I wanted to spend a few minutes to walk you through some off the premium extensions that you can get with Ocean WP. Now, you can either decide to buy any of these adults separately, or you can go with the are bundle. Oh, and and then you get all of these extensions at the bundle. Is that $1 for one particular site? So what I want to do right now is to walk you through three of this extensions and show you what you can do with them. And the 1st 1 here is going to be the Wu Ocean will pop up. Adult is the one down here I have already installed and I have activated the plug in. And to customize the way it works, I'm going to go over to the customized page and then down here, you can see and now have the Wu pop up. What exactly those this I don't do. I'm going to show you in just a second by clicking here right now. What's gonna happen is that whenever anyone adds a product to their cart. This pop up is going to appear, providing them with some information. So right now as it is that the full design is this, if I click on show right here, this is exactly how it works. So once a customer adds that put up to the cut, this will appear saying, OK, two items are in your car to the amount, and then you can either continue shopping or go to cut. The idea here is that psychologically, this can help boost sills. It adds some animation. It add some activity to your side. It makes your site more are engaging. So over here you can customize the information Albee displayed down here you have the title text and then you have the content cell to really make this exciting. You can say something like, Let's say, you know, we are, uh, you know, you you have added an item. You know something like that, make it exciting, make it fun. And then, of course, in here for the content, you can customize that down in here. You can customize their text for the go to call to continue shopping, and of course, you have access to change the styling. You can make it wide are the hide border radius. You have access to change the colorants scheme as well. So all that is available for you with the Wu pop up ad on Let's just let me demonstrate this life so that changes have been published. Let me close this. And now let me go over to the front end. So let's have example, I'm going to add the ball CI bag So right here, Arctic art. And there you go and you can see the pop up in action. So that's exactly how the pop up ad on works. The next Adam is going to be the ocean cookie. Notice Adam, where you can inform your customers that you use cookies on your site. So this is very, very important in Erfurt to comply with the GDP, our laws. So I have already activated the add on and by default. Now you can see I do have this message popping up at the bottom saying by continue to use this website, you consent to the use of cookies. So to customize this down here, you have our customized You will see cookie notice just above the will pop up. So over here, this is way. Of course, you can customize the text of the content will be displayed to your customers. You do have the close target. We can't hit a button or close. I can. And then you have the button texts. Except all you can say this consistent like continue. You've got the style that can fly in. Or it can come a floating bar and then you cook, experiment. We one month you could change that. But one month is kind of ideal if you need to add scripts, you have those in here. You can head to the body to the head as well. And then over here, reloading all strongly suggest you keep this on. No, you don't want to constantly display this message. If the user has said it once that they've accepted find there is no need to display the message all over again. If they are reloaded the page. And then, of course, finally, you have the customization options, the style, and you can change the with of it, change the text call or the background color and so on and so forth. So very, very, very important. A very useful add on to protect your website and ensure that you complain complain with the GDP All laws are the final Adam I'm going to talk about would be the ocean Instagram Adam. And this could be quite useful for your store. You want to get on instagram and of course, advertise your products and a good way to hook your instagram account to Europe said would be to use these Adam So I have already installed have activated the add on and now down here you will see Instagram. The first you won't do is go over to settings and you're gonna need to add the access talking they do. We have a link rated that you can click on. And this will show you how you can get your access took. Inform Instagram It's not difficult, Don't worry. But I do have my access talking right here. So with a talking active, I can come down now to short codes and I can create once I'm gonna click on add new to create my shut code. And now over here I can just say for the title Instagram feed would be the title of the shot code. I've got the style in here Default. We just I'm going to stick with default number of images. I'm gonna go with nine images and let's say three columns. All right? The number of likes I will display I will not display them all. Not display the comments or the caption either for the user information display. Avatar on user name on full of button. Yes. Ah, Display post and full of us. Yes. Biography. No. Offer the styling again. You can add some style in. Let's add three pixels of space between the images. Border Raiders weaken. Go. Let's go. 10 over. Lake passed a text. I'm not going to change any of that. And it for the table device. You can also customize this for responsiveness. I'm gonna go ahead now and publish this feed, and I'm going to grab this short code because we want to displayed and a good place to display the instagram feed. You could either have like a separate page for that, or you can simply display that on your home page. But how would you actually display the field? Well, let's do this like I'm gonna go ahead and it hit the edit page. And what we're gonna do is we're gonna make use off a new block which we haven't walked with yet. Let me come down in here. First of all, add the low one column, and then I'm gonna add the shut code. It's on the widgets. I'm gonna add short code right there. Gonna add the code and Ah, voila. Let's go ahead and, ah, make some changes as usual to the vote. But don't you remove over. But we're going to reduce the padding. Let's go between five pixels, 25 pixels in him as well. And, ah, let's look for ah, decent place to display the instagram feed. I think we can do that just after the newest our rivals. OK, let's just go ahead and a plate. That and let's see. Well, we have Let's view the page. All right, Let's Okay, I'm just gonna go ahead and accept this. Let's come down here and there you go. So? Well, as you can see right now, I don't have on instagram feed for my work a monster because I don't own walk in the store . But I do have an actual account. It's called Travels Off Alexander. So shameless plug. If you're interested in my travels around the world and you know I trouble put a lot, you can follow me out. Appreciate it. But basically, this is how it works. You can I don't see the instagram feed on the home page. So this is a great addition that you can have with the ocean WP extension. So again you can choose to either purchase any of these Adam separately or you can just get bundled. Getting the bundle is way cheaper and other commend that. But in addition to this, three have just talked about you have so much more adults full screen, full to call out, you got hooks you can set your foot has to be sticky. You're headed to be sticky as well. Add white labels and so much more. So think about it. And, ah, think of watching. And of course I will see you in the next class 47. Adding Customer Wish Lists: one awesome plug in. You might want to add to your welcome. A store would be the youth woke Hamas. Wish list. Plug in. Now the the idea behind this program is that it will allow your customers to create wish lists, which can increase conversions tremendously. So there's a free version. There's a pay division. I'm gonna walk you through the free vision and how you can use it. I have already installed and have activated the plug in. I'm gonna come down here two years and of course I do have wish list White Damn. Let me click on the link and let's see what we have. All right in here. You could enable the Ajax loading, which I will do so over here you have the actual wish list options, which I'm gonna click on and now in here it says when put out this ad it to the wish list, what would you let you do? The default is show view, wish list link, which is fine. Every other thing in here I am not going to change anything in here. You do have the loop settings. We would like to display the toe wish list after at a cat, it's just fine. You have other options in here. And of course, you can customize Ah, the text. You can also customize this style and color off the wish list. You have all the available now for the wish list page options by default. When you activate a plug in, it will create a new page called Wish List. However, I would recommend at in the wish list as a short code to the my accounts page. I'm gonna share exactly how to do that. Let me go heading. Remove this and I will copy this shut code. I'm just copy that, and I'll show you how you can display that late up. Now over here, where you have the actual wish list detail page of going to use a page in here you can choose to show the productive aviation's they put applies to put up stock. So let's go with put a price and then also add to cat option for each product. Now, over here, you do have the option of redirect into the cart. Once the user as added the item to their car to the car and now recommended do that And of course, we movies. Editor cut is on That makes sense. Share wish list. You want your customers too old to share their wish list on social media. So maybe they can get their own friends or family members to buy them at what they want by default. You do have these five options available Facebook, Twitter, Pinterest email. And what's up? Over here, you can change the default title thes social text, which would be sent when your customers share the A wish list on Pinterest and Twitter. You can also add a image your bill if you wanted to. And then in here you have the same old text, customization style and color customization and so on and so forth. I'm gonna go ahead and save my changes over here, and Ah, there you go. So how would we actually display this? Well, I'm gonna go over to the front page first of all, and I'm gonna go to my account. All right, So here, I'm gonna go ahead now and edit the my account page. And just as usual, I'm just gonna go ahead now and add the low one column and we're gonna add the shut code. And of course, we're going to display that you could display the shot. Go directly underneath this short code that you have for the welcome as my account. But it's gonna look distorted are you can test it out for yourself and you'll see what I'm talking about. All right, there you go. I'm gonna go ahead now and update and let's see how this works. All right? So let's just go ahead and let's say I want to add the looks Wristwatch to my wish list. So now down here, you'll now Cosmos will now have access to the link right here where they can add to wish list. I'm gonna go ahead and and it looks resource to my wish list. And now, to view the wish list, I can go over to my account and then over here Now you can see we now have the my wish list on the cool store. And then, of course, the item. And of course, the unit price. And then if the customer clicks on off to court, they will now be redirected to cut Page Reddick and now by the items. So that's exactly how the plug it works now. The paid version is very, very powerful because with the paid version of the plug in, not only because must be able to create our poet wish lists share the wish list with specific people. You, as the shop owner, will be able to keep track off the wish lists off your customers. You have that option in here? I'm just quickly show you. So, like, over here, for example, you can monitor your customers wish list and the popular products. So I hear you will see the wish list count next to the products. Nowhere. You know which books are in high demand, and as a result, you can decide to launch a special promotion where you offer maybe 15% off the are very, very popular product on the wish lists. So you could also send. Like I said, you can send promotional emails for production and wishes to push customers to buy and the hope Excuse me. I do have notice here. Sorry about that. So, like I was saying, you can push customers to buy items on the wish list by saying out customized promotional announcements with coupon messages in them. And so on, and even you can allow your customers to ask for an estimate directly from the wish list page. So this is really a powerful plug in for increasing your confessions, and it's no surprise that is a bit more expensive than the other plug ins. This is 89 years, practically 90 use, but I think it's definitely a plug in that you might want to get for yourself. That's it. Thank you for watching. I will see you in the next class. 48. WooCommerce SEO Section Preview: welcome to this very special section. Where will be taking a look at woke Hamas s E O. If we don't talk about the design, the functionality. But we should also talk about S e o. How would you get your website or your store on the first page of Google and other major search engines? Now, to do these, I'm gonna walk you through thebe major plug ins. The 1st 1 is going to be ranked math. Now, bank math is very similar to yours, SC Oh, but I prefer rank math. Don't worry if you are using Yoast Seo, many of the principles all talk about using rank math. They are available with your so you can apply the exact same settings in there as well. I will show you how you can optimize your images by making use off the optimal plug in its fantastic one of the very best in my humble opinion and then also how you can make use off the youth. Welcome us fissured audio, any video content plugging to enhance conversions on your side by adding video descriptions off your products there a few other points I will make as we progress in this section. So sit back, relax. And I hope you find this section very informative. 49. Working with Rankmath: Celeste it off this s e o section by talking about my favorite s you plug in and that's going to be rank math. Now I know there's my beer. Surprised to you because Yost s CEO is very popular. I've used both, but I personally prefer embankment. I think rank math is a much better plugging than Yost s CEO. More than I should say is that just like with the Yost rank, math is suited more towards blog's articles, posts and not necessarily will commerce or products. With that being said, there are still a lot of features with then rank math that you can use to promote your store on Google and other search engines. So let me show you how you can use rank math to help your store. I have already installed and I've activated the plug in, and literally the very first page you're going to see once you activate the plug in will be this. You will be redirected to this page where you'll be act to connect your website to a free account with bank math. I'm going to skip this, but please go ahead and do this all you need to do is to go to rank math at home. Critton account, Click this button right here and you will be You'll automatically be activated. So it's very, very simple. First read for you, but I'm going to, you know, that I'm going to go to Skip now and moving to the next page. All right? So basically, we're gonna sell off the we said. So click on Start. Hui said, And the first part of the biz, that is, you provide some basic information. So in here, your cool store is, and now you have the options. Of course. Mine is a Web shop. And then in here, you fill out the necessary information. I'm gonna go ahead and save and continue. All right? The next big here is going to be the Google such console again. If you let connect to search console, you can come in here at your code and then choose a profile. But for the purposes of this video, I'm gonna go ahead and simply skip this step. All right? In here. You don't need to change anything in here at all. Make sure everything is as it is, except down here where you have the public taxonomy is it's a good idea to enable put it categories down here as well. So don't forget about that. Let's go ahead, save and continue to the next stage. All right, in here again, there isn't anything that you need to change in here per se. You can keep everything in here as it is. I'm gonna grab, click on save and continue. And that is it a light. You do have the option off automatically enabling and auto updates for this plug in. From a security perspective, it goes both ways. It's nice if you're plugging updates automatically, but in at the same time, there is a possibility that an update can break your website. You can put the plug in so personally, I would not recommend you do this, but make sure that whenever an orbit is available, do on that update. All right, I'm gonna go and I'll click on set up advanced options. You can join the free Facebook. Good. By the way, this is another reason why bank math is awesome. They have this free Facebook group that you can join and the answer all questions there. Anyway, I'm gonna click on set up advanced options. All right, in here. You do have the four for monitor, which I encourage it on on. This will monitor if there were any broken links on your site. Broken links can really, really are effectual CEO score, and you don't want them. So attorney for four minutes on and also tunnelling directions, I'll show you how to walk with this in just a minute. Click on save and continue. All right, in here, you do have the schema markup, nothing. You don't need to change anything in here. Just make sure that your schema type for products is set to product important save and continue and all case. And now we have come to the back end off rank math proper. So over here, you do have the additional features that you can enable, but we're keeping this strictly related to woo commerce. So what I'm gonna do right now is to just jump down street here to general settings and let's see what we can do for although calm us down here, you have the welcome I stab. So I'm going to click on the tab and now in here very, very, very important very useful stuff. You can clean up the U RL's off your products right now. As it is, Let me just open up one of the products on the website. So let's if example. I go to cool blaze up now up here, you can see we have products, we have blazers and then we have the cool blazer. Fine. It's descriptive. It helps. But the truth of the matter is that you can decide to clean all this trouble and make it much simpler. So coming in here right now, you can just had to remove the base. So I think you have the examples like a It says, put up accessories action figures, and then the name of the product will go straight to just accessories, action figures and then the name of the product. So I'm gonna turn this on to remove the base. You can also choose to remove the category base, which I will do so as well. And then you can remove the prints, logs or basically the parent categories. I'll do that one as well. We live generator tag. Keep down on remove scare Mac up. Keep down on as well, then go ahead. Now save my changes. And let's see the impact off this. If I go back to my Corp. Liza, look at the, um Well, if I go back t cool blazer and I refresh this page now you can see just simply say, is blazers and then cool blazer. Veii. Very simple. It tells you that put a category and then the name off the product. Very, very, very simple. Love it, By the way, in relation to this, let me go over to the prima links tab. It's important you do this. Let me come down here to it was right now appearance. I'm sorry settings and then prima links. Make sure Dow down in here you have this custom base set and then it say's product. Put a category. You can pause the video and make sure this is what you have any custom base that would really help to clean up and make your your roles very, very simple and easy for such engines to our optimize. So please take off that. Let's go back over to the back end and we're pretty much don't over here. I'm just go ahead, save my changes and then from here. I'm gonna come down here to the re directions. All right. So in here, we can state what will happen if they used us. Some stumbles across a broken link on our side. The fallback behavior is a default. 44 But you can choose to redirect users to the home page. Or you could go with a customer direction, and then we direct them to a particular page. Maybe you're shopping page or something like that. So you can set this one in here. I'll just go with the home page redirection type. You have several options in here. I'll recommend to keep thin. Simple. Just go with the trivial one. Permanent move. Let's go ahead. Save changes. And Ah, there you go. All right, I'm gonna come down here to the Thai tools and Meda, And over here on this page, I'm going to ignore all of this and just come straight down to the products. A tab right here on the post types. Now, this is where you can add the default values for your put up titles, descriptions and so on, so that if you don't go to your products manually and then add their own descriptions. Their own titles rank math will simply use whatever fellas you've set up in here as an example, under the single player description, you have this excerpt code. So basically, if I did not write a manual description for the cool blazer, then blank meth will simply use the except that I have full the cool blazer to simply use that one in place off the actual political and I should have written. That's how this works. The truth here is you don't want to be doing this because ideally, you want to go to each individual product and write out very detailed descriptions for them . It is one thing to light your regula. Put a description on your website, but it's another to write a description for search engines. Keep that in mind. It's possible, very possible for two lights, one description for the website, but then also white. A separate description specifically for search engines. I'm gonna show you how you can write for search engines specifically, but that's why, over here it's yes, it's good to have these values in place, but like I said, if you're serious about ranking up your products on Google. You want to manually invite really specific descriptions for them that such engines will love. But nevertheless, just make sure you have the values in here for like the Singapore, the title you have title, you've got the separation tag and then the site name. That's fine. Although you come in here right now, you do have, ah, the options, but you can add in if you want to. But all recommend you don't change anything in here. I think these fine asses they are all right, let's come down here to product and then you've got put of categories on then in here it's pretty much the exact same. Thin as well. You're better off writing actual put out descriptions for your categories, as opposed to simply relying on the default values in here. That stuff has come down here toothy site map settings. Very, very, very important. Over here, you do have images inside maps. Make sure this one is turned on. That will be very, very, very nice. Does the only thing need to mention are in here and then where you have products you want include plugs in your site map as well, so make sure this when it's turned on for further categories, the exact same thing as well. Make sure you put the categories are also included in your site maps. Let's come down here to do four for monitor in. Here is where you would find broken links that have been recorded by the plug in. So keep track off that Andy Reid evictions the exact same thing. If you've created any re directions, you will find all the information in here. All right, That's pretty much it for the back end of rank math, Lemon. Now go over to products and show you how to use rank math for them. So let's go ahead and edit the cool blazer product. I'm just open it and Okay, so the same old page Fine. Now, down here. Like I said, this is where you can write the production description for the website and then in here this actual main page right here. This is where you would write the full description for your products. Okay, but further down, this is where you now have access to Jovanka Math SC old section on the General. You will see the snippet when you click on this pan. This is where and out down here. This is where you can invite the actual description. Four search engines. What you have inside his box is going to be different from what you have in here. If you don't like anything in here, remember, with the meta information, thank meth will simply use whatever you've added inside your box in here. That's what Van Path would use. So like I said, that's not ideal. You want you light specific descriptions for search engines. So in here, for example, right now, this is where all begin to add the keywords that I want to rank for. So, for example, let's say I wanted to rank full ACLU cool blazer, full middle aged man. As an example, I would come in here right now and begin to type in a cool blazer for middle aged, middle aged men and invite some other descriptions in there as well. It is important also that over here, where you have the focus key would please come in here and typing the keywords you want to rank for. So in this case right now, I want to rank for cool blazer just as an example, I call Blazer. You put in the keyword and then rank muscle begin to score. Your keywords are based on how much information you actually put in. The point here, though, is that don't get caught up with trying to achieve 100%. Remember, that s CEO of Bank Matt s CEO is suited more towards articles, block posts and not products. The most important thing is to just keep in mind is that in here where you have the snippets for your title coming here and white a very descriptive title for your product. If you can add a keywords in your title, please go ahead and do so for the U. R L as well. Try to include the keywords in your U. R L, although that is not compulsory. But it definitely helps. And, of course, in here where you have the description, bang out your keywords in here. Don't go going. Ho, though it's not good to become cured, obsessed instead, including a cures every time. But make sure your keywords all included decision books. And make sure description is also the kind of description that will make a customer want to click on for example, make it favorite, exciting, informative, but also have the key words in there. Down here you will find the additional scoring parameters that bank Matthews is to rank your efforts. And you can see right now you have the focus killers and appear in the content kind of the 16 words long. It doesn't appear the begin of the content again. All these I gave more towards articles and block posts and not product. So again, don't get obsessed with trying to get 100% in your scores. One more than old mentioned in here is, however, you have the schema. Make sure this, of course, that's to product and then on the social tab, very, very important. In here, you can customize war information people will see when they share your content on their social media problems. So, for example, with Facebook right now, you can add a specific image for this product so that when a customer shares this book on their Facebook, feed their friends from them, as they will see this image that you add in here. So make sure you have a really, really nice image that has old right angles. Really shows your product in the best possible way. And, of course, make sure it satisfies the requirements, the image size requirements. And then you can also add a title specifically for Facebook as well as a description specifically for Facebook. Same thing that place to Twitter as well. You could do that one over there. So that's how you would use rank math to improve the S E O scores off your wall comin. Stop how you can use rank math to also optimize our your products. That's pretty much it for the rank math, think fortune and I will see in the next class. 50. Adding Product Videos: one way to improve the CEO of your walk, Omar stop would be to actually add videos for your products. Studies have shown that this can really help it conversions and can also help with traffic quite a lot. So what you want to do is, if possible, you can make videos describing the products that you sell and then display those videos on the products page. The plug we're gonna use here would be youth work, almost featured video. There is, of course, the paid version. But I'm gonna show I'm gonna work with the free version and show you how that works. So I do have it installed and active and with different vision. You don't have access to many options. In fact, you have access to only one where you can choose the aspect ratio between 16. Richard nine and and four away show three. I'm gonna stick with the 16 to 9, and that's pretty much it to add the videos. What you want to do is now is to go over to your products, and I'm just gonna pick one productive to demonstrate how this would work. So let's go with the cool, please. All right. I'm gonna click on edit right there. And now with the plug in active, you will see this new section right here on the the general settings. The featured video you are l So you can add you are girls from your media library. Although I'll recommend that you host your videos on Vimeo Or maybe even on YouTube. YouTube is maybe not as official is very old. Recommend you go with video. So just as an example, I'm just gonna grab this You will from this random Ah, fashion video. I Googled Something's going to use that as an example. I'm gonna come in here. I'm gonna paste that link right there. And ah, that's it. I'm gonna go ahead now and old dates and let's see how this would work. All right, let's go over to you the home page and, ah, let's go back to the cool plays a page and ah, there you go. So right now you can see we do now have the fissured video describing these awesome blazer . That's basically how that is, basically how the plug in work. So if you do have the ability to make videos for your products demonstrating how they work or how your customers can use them. I would highly recommend that you do so with the paid version. You off course have access to way more options you can even in bed tracks. Um, Soundcloud. You can enable Lupien automatic plays, show player controls volumes and so one. So it is something to take a look at if you're interested, but has basically one way how you can improve the CEO and conversions off your store thinking fortune, I will see you in the next class. 51. Adding Image ALT Text: one effective way to optimize your images, which would be the bulk of your content on your work in my store, would be to add alternative texts to them. Now. Alternative text are awesome because search engines love them. And if you can provide alternative text for all your images, that would be great. As an example. If I clicked on my image in here over here, you can see it's empty. There is no alternative text for this particular image, so this is bad. You want to make sure all your images do have alternative text, and if you can include the key words that you want to target for that specific image of that specific product, that images attacks, too. This would be a great place to add those keywords. But make sure that the alternative text is also descriptive because keep in mind if in case you don't know, the alternative text is used by software that blind people use to read contents on a site so the blind person cannot see the image so they would rely on the screen reader to read what the alternative text off the image is. So please keep in mind there. Blind people would also want to know what the image represents. So far, alternative text have the key words, but also make sure it is descriptive enough. Now, if you have a lot of images and you don't have time to manually add the alternative texts which rank Matthew can actually do something. You can come down here to rank math, go to general sit ins, and then you're gonna find the images tab just underneath the links you click in there and now in here, you can choose to turn on the ad, missing old attributes or turn it on. And now in here, you can choose the format. If you look on the job done, our in here, you have access to all the code that you can use to provide the alternative text for your images. As an example. In here you will have something called the file name so and I can choose to add the file name. So right now, as it is, if any of my images do not have the old text, blank meth will simply use the name off the image in place off the old text. But again, this will depend on whether or not my images actually have good titles, So keep that in mind. You can come in here, you have access to other codes as well. But you can include maybe the title off your website or things like that, the product tag and so on. You can include them in here and come up with some really nice our formats for your alternative text. Same applies to the title attributes as well. The tattle isn't quite as important as the alternative text, but nevertheless, all your images should have titles as well. And just like with the old text, you can come in here right now and choose a former a default format that rank Matt would use to at titles. Two images. Ah, two images that don't have titles weather so was coming here, said My changes, and that's pretty much it. So that's one very quickly to improve the S E o off your website by simply adding alternative text to your images 52. Image Optimization by Optimole: one of the best ways to improve your CEO and by optimizing your images is to simply convert them to the Web API format and also compress them. Now. What is this with P format, you say? Well, the weapon is a new image from a created by the developers at Google. The idea here is that it will p format of an image would be smaller in size. And will this load faster than your J pegs or your P and G's? So it's a great way to improve the speed of your website and also improve your S e O. The best plugging, in my humble opinion for doing this is going to be image optimization by optimal. It optimizes your images and even stores them in the cloud. They do have paid versions off the plug in, but in actuality, it's not really that much off difference between the free and the pay divisions. The only thing is that, but if revision, you're limited to only about 5000 visits monthly. So if you do have a lot of customers, which is of course good. If it gets lots of traffic, then you might want to upgrade to the starter or the business plans. But if you're just starting out, you have free account and you can get 48 hours email support. But you also get the autos killed, images smart, laser load in and ah, old unnecessary our features to optimize your images. So go with the fruit version is perfectly fine for a stud I have already installed and have activated the plug in. This is the first page of going to see You'll have to get an A P I key. Interconnect your websites to these service. Now all you need to do is just click on register and email epi I keep So you click on the button right here. You add your email, you click register, and then you'll get yourself the key via email. Ah, very good in mind. So limit is coming here and add the key right there and Alan according to the optimal service, and this might take a few more seconds. It's usually much faster than this, but for some reason, the Internet service in my area hasn't been to in my house. Whether hasn't been too good are lately. All right, which is gonna wait looks like it's going to finish. So the idea here is that once it finishes connecting, it will begin to optimize the images automatically. Right now, you can see it's connected and it stays. Image optimization is currently running. Now, over here, you can see it's loading all day optimized images and then it will start. You optimize them in the back end by the way out with the free version, you also limited to a particular quarter. I did not mention that initially, but you are limited to a particular quarter, which makes sense because it's using the free account, by the way, all right, so right now it says we're currently optimizing your images and there you go. So in the meantime, if you come down here to settings over here, you want to make sure that this scale images and Liza load is enabled the enable image replacement as well. This can go either way to be honest accident, that much experimentation. But I will commend you live this on enabled and then on the advanced. You can come in here and enable nettle based optimization so that if you have customers trying to view your side view the images on your site, and they are using slower networks. Optimal will downgrade the image quality so that they can lord faster on such network. Solve a committee. Do that one. If you're using gifts, you can enable and convert them to video conversion if you want to. But I'm not using any gifts now. In here, you have the image quality. You do have the option off. Father downgraded the quarter of images in exchange for faster Lord times. Since images are going to be the selling point on your site, I would recommend you tread carefully in here. You want to make sure that your customers can actually see the images of your products clearly so you could experiment in here and try to see what's gonna look like. For example, if I bring this down to 85 you can come in here. You will sit guzzling. That saves a few simple image and clicking there, and right now you will see a preview off the image before the downgrade. And now the image after the dangling. So I tell you can see not that much of a difference maybe 85 would be fine. but again, all recommend you tread Careful in here. Don't go overboard with downgrading the quality off your image. Under here, you have resize. You can enable smell coping as well, and you can. You size your large images you can enable. That's no images as well, but ideally, you want to crop your images before you actually upload them to Media Library. So it's much better that way. If you yourself in manually copy images, make sure they're not too big, not too small, and then you can upload them. But nevertheless, you do have the options in here to enable smoke open so you could do that for Spark Coppin . And they can also choose to resize images that go beyond a certain dimension. In this case, when when are the default is 2000 by our 1500 laser load off course? Make sure Liselotte for background images is on, and then finally, if for any reason their particular images that you don't want to optimize, you don't want to These load. You can comedy right now and add the names off those images. You can go either with the image file name over the extension or the Ural off that page, just simply coming here and add the necessary words and then click on add filter. And there you go. So you will notice that once rank man, I'm so once optimal has finished optimizing the images when you try to load it, Okay, Right now you can see kind of like the blower you fit. Let me refresh the page again. Okay, You might We might not see it again. But maybe you said the first time when I have refreshed the page you a sense of, like, a blurry effect and then deem it would appear that is the optimum plug in walking behind the sense. So now the images are gonna start load in much fast that they go crazy and see what you can see. Why did the blowing effect? But then the images now begin to pop out more faster. That's the optimal plug in working behind the scenes. So that's how to optimize your images and also how to convert them to a Web api format and also how you can compress them by using the optimum plug in banking fortune. I will see you in the next class 53. Website Design for SEO: one lost in elect you recommend in regards to S E O would be to make sure that you have a very clean design on your site. This helps because when customers come over to your side, the longer they spend on your site, the less off a bounce, which you'll have a bounce. What basically determines how quickly or how late, how much time people actually spent on your site. So if you have a high balance late that will tell Google that people don't spend that much time on your side. If you have a low bounce way, that's good, because that will tell Google that people actually spending more time on your site and there will reward you for that. So how do you keep people on your side? Well, it's been making sure that design is very clean. It's very simple in here right now. Like with the homepage, for example, in here is very, very, very clean. Straight to the point, people know exactly what they're looking at, and I've chosen three other sites for multi 1,000,000,000 deliverance. To also demonstrate this, we have Calvin Klein, for example, the home page, which will looked at already in this course, but he can see how simple it is. You've got three images, a few buttons, and that's that. You have a subscription form, and that's pretty much it. Prada has a video on the home page. They have two images in here advertising some products and then in Haiti, have section for ready to wear bags, shoes, A few more images in here. And that's it. Tommy Hilfiger almost the exact same thing as well. In fact, on the homepage of Tomato Figure, all they have is this big image. They have the menu, and then in here they have a selection form Fota, and that's it. If you click on like the individual products, for example, now let's go to Let's if example Shop Girls shoes as an example, Let's pick this one. It's a male figure in here again. Very, very simple. They have the men image. They have the gallery images in here and then in here. They have, like the prize, the signs and so on. Favor is simple, very straight to the point. They also have, like the I related for Look section, just like what we have over here as well, so again, the point I'm trying to make here is that keep your design simple, clean. Straight to the point, many designers out there like to add sidebars. They'll have extra information on extra content. No, you don't need that. Keep the information clean, simple and straight to the point. Water. Never mentioned, though, is that if there is any part off your site where you can go gong hole with the content, it's going to be in your main navigational menu. Now all we have here on the site is very, very simple. We have two main poor in categories men and women, and then on the men we simply have who these T shirts, blazers and that, and then for woman. We simply have bags, jeans, blouses and so on of a very simple right. But take a look at what you have with Tommy Hilfiger. For example, if you go over to women, this is basically a mega menu. You have an image, and then for the woman you now have, like the main categories, features explore clothing, shoes and accessories adaptive. And then under these men categories, you now have sub categories, like swimwear, jeans, sweat has something with the keys home. I'm sorry. Kids, woman and then men is, well, the exact same style. So if you cannot fool to get yourself it, make a menu designed. You can build a mega money first of the old really, really be helpful, but that will depend on the amount of product you're selling. If you're selling a lot of products and you can and you feel it makes sense to have a mega and the empowerment, I recommend you go with a mega. Many make it as easy as possible for your customers to find the product that they want to buy. That's basically it. Thank you so much for watching if you have any questions about one of this course in here. But more than happy to answer them, just reach out to me and I will do so Thank you for watching. I will see the next last 54. Conclusion: Well, there you have it with come to the end off this material here on skill share where I should you have to build yourself. It will come our store and from the bottom of my heart I hope you've enjoyed the course and that you've learned a thing or two. So if you did, be sure to leave a review. Reviews really do help me a lot. But don't forget, I do have other courses here on school. Shit from what press to cybersecurity. So be sure to check out my other forces and involving them if you're interested. And of course, I do have a page on Facebook as well. It's called the Web Monkey line. We should follow me there on face book. That's it. Thank you so much for taking this course, and I really hope you found it beneficial. Thank you so much. I wish you all the very best in your online store and I'll see you again soon. Bye bye.