How to Design a Website From Scratch With Wix: The Only Wix Web Design Course You'll Ever Need | Caleb Jost | Skillshare

Playback Speed


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

How to Design a Website From Scratch With Wix: The Only Wix Web Design Course You'll Ever Need

teacher avatar Caleb Jost, Web Designer + Digital Marketer

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

45 Lessons (4h 11m)
    • 1. Welcome to the Course!

      1:40
    • 2. 04 Planning Your Website

      7:56
    • 3. BONUS - Use Coolors.co to Create Eye-catching Color Palettes

      2:32
    • 4. Wix Premium Plans

      2:10
    • 5. Designing with the Wix ADI

      4:56
    • 6. Creating a New Site and Website Templates

      3:37
    • 7. A Tour of the Wix Dashboard

      8:32
    • 8. Wix Website Settings

      6:47
    • 9. Adding Pages and Design Elements

      8:58
    • 10. Uploading Files and Images to the Media Library

      2:31
    • 11. Wix Theme Manager

      5:36
    • 12. Strips

      5:42
    • 13. Adding and Editing Text

      4:10
    • 14. Creating a Navigation Menu

      8:44
    • 15. Building Your Footer

      7:33
    • 16. Designing Buttons

      4:50
    • 17. Finishing out the Home Page

      14:55
    • 18. Creating an Email Subscription Pop Up

      6:26
    • 19. Setting Up the Blog Page

      4:46
    • 20. Setting Up the Video Page

      3:14
    • 21. Setting Up the Forum

      4:52
    • 22. Designing Your About Page

      5:51
    • 23. Designing the Contact Page

      2:03
    • 24. Customizing Forms

      11:21
    • 25. Adding Google Maps to Your Contact Page

      1:46
    • 26. Sell Online: Setting Up a Wix E commerce Store

      16:05
    • 27. Adding Animation to Your Site

      3:47
    • 28. A Tour of the Site So Far

      2:03
    • 29. Optimizing for Mobile

      6:10
    • 30. A Tour of the Mobile Site

      1:44
    • 31. Blogging with Wix

      8:31
    • 32. Content Manager Tutorial

      19:01
    • 33. Optimizing Your Website for Search Engines

      5:18
    • 34. Setting Alt Tags

      1:36
    • 35. Connect Your Premium Plan and Domain Name

      6:28
    • 36. Set Up Google Analytics

      3:13
    • 37. Congratulations! What's Next?

      1:08
    • 38. Extra - Check Your Analytics

      3:23
    • 39. Extra - Check Your Site Speed

      2:56
    • 40. Extra - Email Marketing

      7:34
    • 41. Extra - Importing Contacts into Wix

      4:41
    • 42. Extra - Wix Automations

      7:47
    • 43. Extra - Set Your Social Share Image

      1:14
    • 44. Extra - Wix Photo Editor

      3:07
    • 45. Extra - Wix Video Maker

      3:50
  • --
  • Beginner level
  • Intermediate level
  • Advanced level
  • All levels
  • Beg/Int level
  • Int/Adv level

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.

148

Students

--

Projects

About This Class

What You'll Learn in This Course

  • You'll learn to design exciting, mobile-optimized websites with Wix.
  • You'll also learn to optimize websites for mobile devices, launch them with your domain name, and submit them to Google.
  • More advanced concepts will be covered as well, like e-commerce, search engine optimization, and automation.
  • By the end of the course, you'll be able to build your own website or start a freelance web design career.

Hi there, my name is Caleb Jost. I'm a successful professional web designer making 6 figures a year designing websites with Wix.

Are you having trouble learning to use Wix and design websites on your own? This course will show you how to design websites on Wix at a professional level. You'll be able to add web design to your resume and start getting paid for your new Wix website design skills.

In this course I will teach you everything you need to know to build unique, attractive websites with Wix. You'll learn how to use Wix to create blogs, e-commerce websites, forums, vlogs, and more. As we go through the course, you'll build your own website that you can use for your business and add to your portfolio.

This course is for beginners. You don't need to have any prior experience in web design, graphic design, or digital marketing. We'll start from the beginning and progressively build on our skills and knowledge.

Web design is an extremely useful and lucrative skillset in every industry. Employment of web designers is growing much faster than most occupations. It's also fun, dynamic, and exciting. There's always more to learn and new projects to pursue.

I can't wait to see the awesome website you design. Let's go!

Meet Your Teacher

Teacher Profile Image

Caleb Jost

Web Designer + Digital Marketer

Teacher

Hey, I'm Caleb Jost. I'm an award-winning web designer in Austin, TX. I run a six-figure digital studio and have taught digital marketing at the university level. I am passionate about empowering entrepreneurs and small business owners to build prosperous businesses through compelling web design and digital marketing. I'm from a family of small business owners, so I'm well aware of the unique challenges SMBs face.

I've worked in tech for startups, Fortune 100 companies, and as a self-employed business owner. I'm a Wix Legend Partner and am certified in Google Ads, Inbound Marketing, and SEO.

In my free time, I like to play music (bass, guitar, ukulele, and keyboard), read, hike, spend time with friends and family, explore new skills and hobbies, learn languages (... See full profile

Class Ratings

Expectations Met?
  • Exceeded!
    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.

Transcripts

1. Welcome to the Course!: Hey, I'm Caleb, just around award-winning web design studio called paired digital. And in this course, I'm a teacher, I do what I do, create awesome websites like this in works. Is it even worth learning to design websites to what's the? Well? With works, you can do an e-commerce store like Wayfair or Amazon. You create a media publication like the Huffington Post. You could use your skills to design websites professionally, the way I do. And that can be lucrative to there's so many different kinds of websites that you could build that would enrich your life and other people's lives. By the time you're done with this course, you'll be able to create gorgeous websites that look great on all screen sizes and have unique functionality like custom contact farms, blogs, forums, blogs, e-commerce and so much more. We'll also cover some more advanced technical concepts like the Web Content Manager. Once your site is built, we'll discuss optimizing your site for search engines like Google and bang, and connecting your own domain name to your website. There's some great freebies included with this course as well. If you need help during or after the course, I'll be available to you. And I'm also open to feedback. So if you have suggestion to make the course better or you think that I miss something or need to add some videos, please let me know so I can do so. I want us all to succeed together and I'm so excited to see the website that you build. Let's get started. 2. 04 Planning Your Website: So you decided to build a website that's awesome and it's very exciting. But before you start, you need to actually plan your website out. You can't just jump in blind. You're gonna make a lot of mistakes and have to do a lot of things two or three times. So that's actually planner website. Before we start building it, you need to remember that your website is the digital face of your business. People are going to be able to access this all the time, every day no matter what you're done, no matter where you are, whether you're working or not, it is going to be selling for you, right? And you can make sales from your main website at two AM on Tuesday night. That's awesome, but with great power comes great responsibility, right? It's important that you get your website right, so that you're able to fully take advantage of those opportunities. So first, let's be clear about what kind of website you want to build. There's a lot of different kinds of websites. There's brochure websites which are purely informational. There's blogs where you're adding content information and talking and writing about a particular topic. And e-commerce stores where you're selling products, whether they're physical or digital. There's forums where you're creating a platform for people to interact and chat with each other about the topic they're interested in. There's portfolios where you might be some kind of designer or a creative person. You want to show your work to the world. There's also more advanced applications that have some kind of interactivity built-in. Think of things like Facebook or Twitter, those are web applications. And there's all kinds of websites you can build. But this is a good starting point. And these are all kinds of websites that are possible with Wix actually, even web applications. Once you know what kind of website you're building, you need to ask yourself a few questions to determine what direction to take things. So first off, why do you want or need a website? And every business needs a website, almost every business does as a professional designer, I do think that every business needs a website and they almost definitely can't hurt if you have a good website. Actually let me take that back. A bad website can really harm the credibility and respectability for business. But why do you want a website? Who will be using the site? The site you build for a group of 85-year-old senior citizens who aren't very familiar with technology and just need to get some information quickly is different than the kind of website you build for a 13-year-old who's really into Minecraft and is looking for entertainment. So your users, when a form that will look and the feel and the functionality of the site. Why would they choose my website? And by extension, your service or business? There's a lot out there. There's a lot of blogs, there's a lot of e-commerce stores. What makes you different? Why would people choose you over somebody else? How are they going to find that once your marketing plan, just because you've built a website, doesn't mean that there's going to be thousands and millions of people flocking to it to hear from you and buyer products, they define it somehow, right? You have to lead them to your website. So you need to market whether that's posting on social media or creating YouTube videos for running ads, or working on search engine optimization. You need to decide ahead of time how you plan to help people find your website. What features will your website needed? Does it need a form? Doesn't need a blog, will, there's an ED commerce and shipping on those features, how bivalent to find them. Yeah, they'll find it from the menu hopefully. But there's a need to be a block on the homepage. People interact with your website and its features in a way that's easy for them. Well, human else being involved in the building process, do you need to talk to a business partner about planning and strategy and content? Do are you going to hire a designer? And if so, what information do you need to give the designer to make sure that they can do a good job. Additionally, what websites do you like? That'll help you get a good idea of the design and the functionality that you're trying to achieve. What do you like about them? What makes them attractive to you? Why do you want your website to look like there's websites do you hate? There's a website that you hate. Identify what it is you don't like about that website, so you can avoid incorporating that in your own. In that vein. What's wrong with them? How much will this cost me? There are absolutely going to be costs associated with creating a website. The hope is that the website returns you a lot more than it costs. Website is almost always an investment. And if it's a good website that does its job, it's going to be an excellent investment. You're gonna get a huge return on your investment. So how much will it cost me? A professional designer, depending where you find who could have anywhere from 500 to 5000 dollars, you're also going to need to pay for a domain name which is going to be somewhere between 10, $20 a year. And you're going to need to pay for a wigs hosting plan. That's going to be anywhere from 12 to $40 a year. And then finally, how you market this website? How are you going to get people to find your website? Okay, you also need to choose a domain name. You don't have to do this before you get started. You could actually do this later on, but let's just talk about it now. Ideally, your domain name is going to be short and simple, something like google.com, not, hey, this is a really good search engine and its name is Google.com dotnet, write short and simple and memorable is ideal. Now a lot of domain names have been purchased already. You're not going to get blog.com, but just try to make it as short and simple as possible. You go to GoDaddy and check if your domain name is available. And generally.com is going to be the easiest for people to remember. Before you actually build your website. You also need to know what your branding is because this is going to inform the design of the whole website. So you need to have a logo figured out. You can see up in the top right corner, I've got my logo right here. And our colors from blue to shades of blue and red. Need to have a font for your heading in your body texts. Sometimes we'll have one font and it's just bigger and bolder for the heading. That's fine. And figure out what fonts you want to use. Figure out the colors. Again. For us, it's blue and red. It can be whatever you want, but it's trying to have something, have a few colors that match. You don't even 20 colors and you probably need two or three colors. And you determined the feel. I feel. I mean, what kind of feeling does your brand evoke in the customer? Do you look professional and do you look fun? Do you have cool? How do you want your brand to be portrayed? What do you want the customer to think about you when they see your brand? A great way to put all these together to create a mood board. You can do that on Pinterest. You can create a brand kit, particular document of some kind that up you get a feel for your brand. Here's an example of a brand kit that I created for the website that we're going to build in this course. So we're going to be creating a travel blog. And so I created this dramatic Caleb logo with a cool little backpack. And I've got my heading font and my body font picked out. I've got a color scheme, a color palette picked out. And then the general feel for a travel blog, I think should be adventurous and happy and fun and just kind of evoking this good time feeling. This is a one-page brand kit. Some larger companies had much more complicated, complex grandkids. I've got customer persona's and brand voice and all this kind of thing. For a small business or a startup, we can start here with a one-page brand kit and work from there. Once you have your brand set, it's time to actually plan out the structure of your website. What, what's the flow going to be? The pages where the page is going to look like. I did this with pen and paper. I just draw what I want the website to look like. Very generally, very loosely. This is all completely subjective and open to change. But against it gives me an idea of how things are going to look. So this is kind of how I want my website to load. Now here's some really awesome tools. You can use a planner on your website, place it done that has a logo generator. There's also some other logo generators around on the internet. Weeks, depending on the plan you buy has a logo generator. This website coolers dot CEO has a color palette generator. They use all the time. I'll walk you through some of these cool services in a different video that I'll put in the bonus video section. So everything we talked about in this video should help you create a killer website that helps you succeed. All right, I hope that helped you plan out your website. See you next video. 3. BONUS - Use Coolors.co to Create Eye-catching Color Palettes: Alright, in this video, I'm going to show you how to use coolers dot CEO to create color schemes super-fast. So you can spend less time playing with colors and you get to designing your website much faster. So if you go to colors that SEO, you'll see this blue button that says Start the generator. Let's click that. One way that I like to generate new color palettes is to click the space bar on this color palette generator to flip through colors until I started to see colors I like. So say I'm working on a lawn mowing company. I might say I like this green. So I'll hover over this and lock a lock that color. Now when I click Space-bar, the new color palettes will be generated with this color in mind. So remember I'm making a long ongoing company's website. So maybe it looks kinda fun. So maybe I want to use this blue. And it will just keep gone. Narrowing it down until I've got some colors I like. Okay, so Bill Mann, I use those five colors. And then I can save this color palette. Make sure that you have an account. And it will save this as lawn mowing company. And we can tag it if you want lawns. Once that's saved, we can click the hamburger menu and there's your palette and color palette right there, so we can grab it and use it later. Oftentimes for my clients, I'll just take a screenshot of all of these colors and send them a few different color palettes for them to pick from. And where they can see the names in the hex colors and see more information for themselves. What other cool part of colors is the Explore feature. And here you can see a bunch of really cool color palettes, really well made one sum. You can see how popular they are. And so it's fine, just look through these with your project in mind and see if any of these might fit the project you're working on so far, London Company, We could have used a bigger color palette like this with a ton of different colors. Maybe this one. You can also search by keyword so far along one company maybe we could search long and get a bunch of we get a bunch of color palettes that might work for that kind of project. So that's cause in a nutshell is super-useful. Allow that it was made by one guy, which is very impressive. So if you need to call it, but quick colors is the way to go. 4. Wix Premium Plans: All right, Let's talk about Wix pricing plans. They have four different basic website plans and then another four or five business plans. So the most popular is the combo plan. It's also the cheapest at $14 a month comes with a free domain. There won't be any at Wix ads on your website of an SSL. And an SSL is just a security feature that all websites need. It's what causes this little lock here show up enough storage space to get you started. Some some video storage as well. These other these other things that come on, some of the other plans you don't necessarily need the Get Started add vouchers from Google and Bing. And site booster is an SEO App, and it submits your website to be different directories, 20 different online directories. Visitor analytics is what it sounds like. It's an analytics app. And then you have the events calendar, which is the calendar app, the logo maker that comes to the VIP and prose, pretty cool. It will essentially generate a logo for you based on the answers to a couple of questions and your choice between a few different logos. And it comes all the files you would need for all kinds of different uses if you want to use it on Facebook and Instagram and all of these different spots. It'll give you the right file sizes. So that's the standard plans. There's also e-commerce plans. So the most common is the business unlimited plan. And that's where we offer our class, hosting and maintaining their sites with us. So somewhat helpful features are the bits of limited over Business Basic are that you get subscriptions, subscription services. You can have multiple currencies. The automated sales tax is pretty helpful. Advanced shipping, you can connect to different marketplaces and you also have a few other little add-ons. So I would recommend a business unlimited. The business basics though would be plenty to get you up and running. You still have online payments. You saw payment plans, and you still get that free domain and storage space and everything. So I think if you are brand new and ready to just dip your toes into building a website, I would start with the combo. Wanted to open an e-commerce store. I would go with the business on and let it go. So that pretty much covers Wix premium plans. 5. Designing with the Wix ADI: So you're ready to create your site. And you create your site, you're gonna have two options you can create with the regular Wix editor or Editor X. Editor X is which says more advanced editor for typically used by more skilled professional designers. I definitely recommend to start you build with the Wix editor. So we can click there and this comes up. So the reason I'm asking this question is because they want to show you a bunch of templates related to your website. So let's pretend I want to build a, a travel blog for a digital nomad. Okay, So we're gonna click blog and then presents us with two options. Now there's the Wix ADI, actual editor. Let's actually work through both of these. So with the Wix ADI, click Start. Now, let's call it Caleb's travel blog. And then click Next. It's going to give you some options of things we want to automatically add to the side. And I'll think I need a chat, but let's have a subscribe form so people can sign up for my newsletter. And maybe also some digital products, PDFs or something like that. Maybe I wanted to have a YouTube video gallery show off and let his travels on Instagram. And maybe I want to chat about travel to the forum. So we've got a few different things like the term. And the name of our blog is Caleb's travel blog. And they will think of a better name for that later. We don't have an existing website. This is pretty cool though. The other website on Squarespace or WordPress or whatever platform you can put your website right in here and pull all the information or as much information as their algorithm can grab. Pull it in here. Same with Google places. If you were to have Google, My Business setup, I just made up a logo real quick for us to use for this pretend website. One must industry. Okay? It also automatically create your social links if social media for your business or yourself and ulna. All right, Now we're going to pick a couple of teams we like to give the, the week say ion idea of the kind of look you're looking for, for your website. So I think this one's okay. Yeah, Let's use my level to create the color palette. These two colors together. Alright, now, created a homepage first for my new travel blog. Let's take a look. Bad. It's got all the pieces we talked about, right? So it's got the blog, it's got videos, it's kind of Instagram. And she's with the contact form as a social media link up there. They all look pretty all right, let's use this design. Do I want more pages? Probably want to adopt page maybe a contact page two. Alright, I think that's it, said Edit Site. Great. So our site is built. Let's check out the preview. So we've got a nice opening header here. Kinda blog posts, subscribe form, videos, instagram, contact. It's got all the basics of a real website. And it took us what? Filling out a form for three minutes and get at products and spin about information at a picture of me. Add a contact form. You've got a forum so people can talk to each other while even wrote some information about the travel form. So it's pretty crazy how easy it is if you actually wanted to build out a Wix ADI side. And here you can add sections, the page's contents with the colors, all these options on these pieces of their website or editable. So we can click on here and write whatever we want. So in short, the Wix ADI is super easy to use. I really recommend it. If you need a website up tonight, you just got off work and you have a pitched next day about your business. And so you don't have a website showing the business off by tomorrow morning. And this is a great option, but it's also going to restrict you a lot. And you're not gonna be able to create the kind of more elaborate designs that really sets you apart as a business or even as an individual. So I recommend you use the Wix editor and we'll get into that in the next video. Thanks. 6. Creating a New Site and Website Templates: So I've gone back and now instead of using Wix ADI, we're going to use the Wix editor. So again, we're making a blog. We're calling it nomadic, Caleb, It's going to be a travel blog. Let's create the website with the editor. So any editor, There's a ton of different templates to checkout. And a lot of them are pretty well-named. Some of them are older and some of them look pretty bad. So I would recommend you look through templates related to your business, but don't be restricted to those because we're going to customize everything anyway, read. So you don't have, if you're creating a blog, travel blogger doesn't have to be a travel blog template that can be a different kind of blog. Let's look at this one. It's for a travel blog. She got the full dinner. Okay. Different sections of the Blom where they're featured. Latest blog posts. Looks like their Instagram here. Social media. So I think this is a pretty solid, pretty solid template. If I wanted to use a template, I would probably use this one. It looks great to me. You can even check it out on mobile. Yeah. Look, salary would be great starting point. But we're actually not going to use templates. We are going to build a site from scratch. This is important because if you're going to build more than one site, you're gonna be able to build that it exactly the way you want. And these way to do that is to start from scratch. So up here at the top that all templates and then blank templates. There's a few with some simple layout, sorry, setup for us. We're going to start completely from scratch. Edit. Alright, that brings us into the Wix editor, a completely blank slate. We can make whatever website we can possibly imagine. Right here on the side. Just to give you a little inspiration, let's check out some science that we've built all completely from scratch in the Wix editor. Here's a personal chef side, tailored chef. Here's a site for a consultant, Courtney Branson. Here's a site for a workforce consulting business, for local pressure washer, classic small business website, and the site for a beef and capital company. So I think based on those few sides, you get the idea that you can make almost anything in the Wix editor. The question is, where do you start? And you get this blank slate. You've got all these options and other stuff going on. So where do you start building your site? We're going to do that in the next video. 7. A Tour of the Wix Dashboard: Before we start actually building our website and take a quick tour of the Whigs dashboard. The books dashboard is where all kinds of different settings live. It's where your CRM, customer relationship management database lives, your settings, your store products. You're gonna spend a lot of time in the works dashboard. So in other words, dashboard at the very top, you can see a quick preview of your site, the title of your site, your URL. Right now this says Digital, that website.com slash ellipse at 18 because we haven't connected a domain and it will get into connecting domains later. There's a variety of set actions you can take, including previewing the say, duplicating it, transforming it to somebody else and other owner adding people are kinda stuff. Here you can see your site role and we'll look at site roles in a bit, but there's different site roles with different permissions. On every website. You can see your site plan from works. So a business plan or just a regular premium plan. You can see whether you've connected an email inbox and you can see your Wix ascend plan. We'll also talk about ascend later. But looks a sin is the marketing. Them all the marketing tools that works offers right below here, since we added as a store weeks gives us this little helper box. And they suggest adding your first part product or setting up payment methods, shipping regions. And then this part here is also important. It helps you publish your site. It tells you how to connect the domain, helps you submit your site to Google Search Console. So this is just a quick little tutorial that will help walk you through some key steps towards getting your site online. And we scroll down a little bit. There's some more suggestions. Below that. There's a bunch of quick links to various tools. And over here you can see some analytics. So once your sites online, you might see a few 107 sessions this month. I propose to you is you've been done $10 thousand and sales. That would be great. Okay, So now here on the left-hand side bar, there's a ton of options, right? We're going to walk through each one of these so that you have a strong foundation in you'll feel comfortable navigating the web dashboard. So right below here, we have the video library, and that's because I added a video app to my website. We click in here. We'll go further into the video library it later. But we can upload files or we can embed playlist from various services like YouTube, Vimeo, Facebook. Also actually live stream, which is a very cool feature that we'll also get into later. And you can set up channels similar to YouTube. If you've ever had a YouTube account. Below that we have all our store products will have a whole long section on e-commerce. But you can see real quickly that there's already all these products added in. You can click into each one of these to edit this information. You can manage your inventory right from the dashboard. You can set up collections and collections or just product categories. And there's even this interesting tab, find products to sell and they'll connect you to various drop shippers and help you source products to sell on your online store. Okay, below that you can have store orders. And so you can see a list of all the orders that have come into your store. Blow that abandoned carts. So there's going to be a list of people who put a bunch of stuff in your car, the shopping cart, and then didn't purchase. So you can reach out to these people and ask them why they didn't purchase. You can send them a coupon. You can set up an automation to send them coupons, which I highly recommend. And I'll also talk about setting up a website automations later on in the course. Okay, below that, since we added the format, you can see there's a variety of different posts. And each one of these you can click into to see more information about it. And there's also the categories. So typically Santa travel form, maybe you will have a section for budget travel ideas. My other section for traveling Asia, something like that. Okay, below that, we have our blog. Again, we'll have a whole video on adding post to your blog, but it's very straightforward. And you essentially just click Create a New Post, fill out the information and you're good to go. And so eventually you'll see, once you have some blog posts, will see a list of all your black cross here, drafts that you're working on. I highly suggest in the future that you schedule outposts because Google ecstasy that you're publishing on a regular schedule. So you can write. And also so you can batch your work. So you could write 10 posts over a weekend and then schedule and out over the next couple of months. Some of the posts in the trash. And then again, you can categories either blows your blog posts. So maybe you'll have a category for like the forum posts. People have a category for China and some for Europe and something like that. Okay, below that, you have the sin by Wix marketing tools. So there's a lot of really cool tools in here. We're just going to breeze over that some of these real quick and we'll go deeper into them later. So to start, if customer management, and this is your CRM customer relationship management database, think of it as a giant spreadsheet with all the information that you would need about your customers. So here's me, here's an example, contact. Then let's just look at it real quick, just so you know what we're talking about. So as you get, as people fill out forms on your website, as people purchase products, you're gonna see all the information about that contact in here in your CRM. And this is a great feature because generally you have to pay a third party software provider to have a CRM. But works provides you the CRM with your website plan. It's actually a great value because theorems can be very expensive. So you'll see an overview. You can have tasks. There's all kinds of stuff to look at in here. We'll get into this later. But just know your CRM is a database for all of your contacts in your that interact with your website. That we've got marketing SEO. This is where you can connect all kinds of marketing tools like Google Analytics, Facebook Pixel, Google ads. You can also create social media posts to publish to your social media channels. You can connect Google, My Business, which is very important for getting reviews for your company. You can send out e-mail newsletters. You can get found on Google. So submit, again, optimize your website for SEO and submit it to Google. You can actually get waxes helped to set up some automated Facebook and Instagram ads, and these can actually be quite effective. There's also a little video maker which is pretty handy. This is great for social media posts. You can set up coupons for your store. So there's a lot of really cool tools in the marketing and sales and marketing suite. And I really recommend just clicking in here and playing around and seeing what you can come up with. Okay, below marketing and SEO, we have analytics and reports. This is where you can track all of the visitor information or the visitor interaction with your website. So you'll see how many people are visiting, what pages they're visiting, where they're coming from in terms of what site, but also where they live. Geographically. You can see how many people are coming back month over month, which is important. You can see your sales analytics. So how much you're selling month to month? You can see how your site's performing. From a speed perspective. It's very important to regularly check your analytics because you need to know how your site's performing so that she can improve it. Okay, Now the finances tab right here is also pretty handy. You can see a list of all the payments customers have sent to you can generate price quotes. So if you have a service-based business, say you're a plumber, say you're a web designer. You can put together a price quote for your clients. You get even invoice them and use the payment method set up in the settings. And there's a host of other financial integrations. Most people, most fun businesses use QuickBooks. Freshbooks could use QuickBooks. You can integrate it here. You can add your payroll. So there's a lot of ways that wakes helps you run your business. It's extremely helpful to have price quotes and invoices that you can send Shae from your website. Because again, this is another feature like the CRM that typically you would have to pay for to some third party software provider. Okay, now let's get into settings. 8. Wix Website Settings: Right, let's go through all of the settings for your website. So remember where in the dashboard on left-hand side, we're here at settings. Okay? So in general settings you've got website settings, business info, language and region, roles and permissions, video settings. So let's go through each one of these one by one websites settings. You can set your sights name, the URL. Let's go ahead and change this to nomadic, Caleb, since that's the upsampling. Favicon is this little icon right here at the top. So you need a premium plan to change that. We will change this later. Your general social image is what's going to be shared when you share your website on a social network like Facebook. It's also what's going to come up when you text somebody, your website, anytime you put in your URL and a little box pops up with an image, that's this image. You can also add your personal Facebook account. Here. You don't really need to and used often. Okay, and then inside history, you can view and restore a previous versions of your site. We talked about this a little earlier. This is extremely helpful. If something goes wrong on your website, you try to design it and you mess something up terribly. You can't fair what you did wrong or say you give somebody else permission to your site and they mess something up and delete something important. You can always just roll it back to a previous saved version of your site, which says a bunch of versions of your site. So you should be able to restore your site to working on it. Don't forget about this is extremely helpful if something goes wrong in your site. Okay, so that's website settings. Let's head back to settings. Okay, under settings, we've got business info. So this subs is going to show up on those invoices and price quotes that we just saw in the finances tool. And you can set your business name, your address through logo, a description of your business, what kind of business it is, set it to food and travel, the location. And we're going to say that it's an Austin. Austin, Texas. That's why I love I'm not going to give up my real address them. Okay. And then you can say your contact info, email, your phone, your facts that this stuff is going to show up on your invoices and your price quotes, spend and save that back. Okay, below that, you can set your language n-region. So we're going to set all of this to English. Central time zone. That's the time that awesomes on American dollars. But say you're, you end up becoming a web designer and you are designing for somebody in Germany. We actually recently had a client who was in the Netherlands. So you would need to change all these different settings to, in our case, Dutch, right? And the Dutch time zone. So this can be helpful. Okay, below that, roles and permissions where you can add people to your site, whether they are an employee who just needs to look at price quotes, or they are somebody who's designing a website for you, or you design a website and you want to add your client to this item. So there's a variety of different roles and you can create custom roles. But in here, you can click, Invite people and you just type in their email and just like that. Now here's some custom roles that I've created. But generally you probably won't need customers. There's a lot of different preset roles that w's. So, so you design a website with somebody, you'd want to add them as a co-owner. Say if you are an employee who's taking care of the side and doing everything for you, you might want to add them as website manager. Or if you have somebody designing a website for you, you could add them as Website design. The back office manager can edit settings, change settings in the dashboard. Basically they have access to the dashboard, but they're not going to be able to change the visual look of the site. Down here, billing manager would be somebody who's dealing with purchases, subscriptions, Pam methods, but they're not going to be actually changing the website itself. Domain manager is just connecting, managing the domains. So it's a pretty limited role. Store manager might be if you have an e-commerce company and you have somebody who's looking at all the orders and changing products and managing the store. That would be this row. Down here. If you have a team of writers working on your blog, you could have add them as blog writers and then add somebody else's of how editor to edit all of those blog posts. Down here. Payment manager, again, it's pretty self-explanatory. They can manage customer payments. So those are some of the custom roles available. And I'll just go ahead and add myself as a co-owner. When you add somebody, that'll ask you what kind of relationship you have with this new, this new user. So I'm going to say that this is an agency, hopefully both sides. Okay, so that's roles and permissions. Below that, we have video settings. We haven't gotten into yet. But you can actually sell individual videos. So you can set the standard price, the kind of currency you're selling it and choose which channel your videos are being uploaded to. E-mail settings when you make a salad, a video. And I would actually recommend turning that on. You're going to have a video channel. You can add your logo to these videos. And this is important if you're going to have a lot of video content. So on Wix premium plans, I think it's set to a handful of hours. You'll need a upgraded plan to have to have a lot of video content on your website. Now there's a long list of e-commerce settings and we're gonna get into that later in the e-commerce section of this course. Below that, you've got your communications. So setting up your e-mail inbox, setting up your business phone number, editing your notifications, editing the notifications that you get, including on your phone. And then some advanced stuff that I, that is beyond the scope of this course. Things like custom code, your cookies, privacy policy. These two are the only ones you'd actually use, which is looking at past versions of your site and rolling it back because you made a mistake or somebody else did. Okay, so that's a quick overview of waxes website settings. 9. Adding Pages and Design Elements: Here we are back at the beginning of the dashboard. And now we're gonna go back to the frontend editor. So we're gonna click Site Actions appear, blue button at the top right, and then edit side. So we still have this Wix ADI sign. We're going to convert this site now into a Wix editor site. So under site at the top, at the bottom of the menu that pops up that says one more design options. Go to editor. We're going to do that. We're going to switch to the editor. And here just tells you a little bit about the editing and have a lot more control and a lot more design power in the books editor. Alright, we're in business, we're in the Wix editor. Now, I'm going to remove all of this stuff because I build my sites from scratch. And I think all the best sets are built from scratch and they don't rely on templates like this. So we're gonna go ahead and just start getting rid of everything. So we can start with a blank slate. Alright, now we've removed everything we have a nice blank slate to work with. Before we get into actually designing the site, we have one more tour to do, and we're so close, we're about to actually start the fun part which is designing the site. But let's go through a few more options and settings here so that you're set up for success. Okay? So on the left hand sidebar here, you've got all these options. The first one is a list of your pages. So under main pages we can see we've already got home shop about contact forum members. And let's actually go ahead and add a couple pages so you can see how this works. And because we are going to need it more pages. So I think we're going to need a page for videos. Let's go and type in videos. And we'll also need blog page. So what I actually just did, because the blog was tied to the homepage, was at elite, the blog app. And now we're going to re-add the block app. That's because of the way or Wix ADI set per cell. You wouldn't have to do like this if you had started from scratch. So we're gonna go down to the pin icon, my blog. I'm going to click it and click Add now. So now we have a unique page for our blog. We're also gonna be able to add a feed of our latest blog posts to our homepage. So now we have all these pages ready to go. You remember this is the top-left icon. You can also navigate between pages right here. By clicking page, maybe all these blank pages now, four different pages we will be designing. The next bubble underneath pages is for your page background. So you can set a color, an image or video, and its background is going to apply to the entire page. Now after you set one, you can apply these backgrounds to other pages as well. So if we wanted to sort of Dr. Black Theme site, choose black. And then we can apply it to other pages right here with this blue button. Now all of our page backgrounds are black. So I think we'll leave it white for now. But you can see how useful that would be. Okay, below this, this is plus icon is we're going to add all your design elements. Things like your strips, right? Your rows that you'll be designing. A lot of your website and text boxes, images, buttons, galleries, decorative items like lines and shapes, that kind of thing. Interactive stuff, slide shows, lightbox, lightbox or like pop-ups. And we will have the whole video on how to create light boxes. Boxes you can add other elements into. So say you want to add some text and image into a box and move it around, you'll be able to do that listen grids. So these are called repeaters, and it's essentially a design element that's repeated over and over and over. So in this example right here, it would be for a travel agency. Here's some of their here's some of the locations and some information about those locations with a button that links there. So repeaters are very helpful if you have a lot of repetitive information, save a lot of different services. You've got 10 services. You could add a repeater and then just list out those services. And you only have to design one element and all the other elements after, we'll have the identical design. So it's very useful. Video and music. We'll be adding these elements to our video page. And you can add videos individually or you can add a video feed. You can also link to audio players. So if you're a musician, you can link to your Spotify account or your SoundCloud. You've got Wix own music apps. So this is a pretty handy feature as well. Okay, below that you've got menus and we'll be building our menu for header very soon. But you can see we've got some pre-designed menus of alkynes. We're going to be working with our theme of menus. Below that, you have what's called anchors. Anchors are like quick links to different to a specific part of the page. So you can have anchors, the retro homepage. And it would, if you click the link for that anchor, it would jump you down to that. Pete, that section that's anchored to say at the bottom of your page, you had your Instagram feed, right? Then you could have a link that says Instagram and we click it and maybe straight down into that part of the page. So hopefully that made sense. We'll build anchor menus as well. Okay, below that, you get your social icons, buttons, and you'll set up your links to your social profiles. You also got some cool stuff. You can embed a Facebook feed. You can add Twitter follow buttons. So we'll do some of this stuff as well. In contact and forums, you can add exactly what it sounds like. You can add your contact ones. You can do Payment like custom payment forms, multi-step forms, Java applications. So you can make these pretty complex. I think by default Wix, you don't have an upgraded looks a sin plan looks limb exceeded 10 fields. With the sin, you could do even more. So you can make some pretty complex forums and gather a lot of information from people who'd been shouldn't doing business with you, blow that. Google Maps, you can add a little box with a pin on your location or locations. If you're, maybe you're a franchise and you have a bunch of different locations. You get at that here in Wix chat is live chat, and you can connect this to your mobile phone so that anytime somebody wants to interact with your business, they can do that directly with you. It's essentially like they're texting with you through your website. Below that is embed. So a lot of third party services will allow you to embed their features and functionality on your website. And they'll give you some HTML code, will give you a bit old block of code. All you have to do is copy and paste it using this embed widget. You can also embed single videos from YouTube and all this kind of stuff. A lot of this information that will be founded, videos, music, get a content manager is a little bit more advanced of a website concept. With the content manager does, is create a lot of different pages with the identical layout but different content. So the way you might use this, say you are a real estate agent and you want to list out your all your listings. You can have a 100 pages that I'll look exactly the same, but the pictures, the name, and address are different, but the actual layout is the same. Maybe you're a home builder, show some of your portfolio projects. Anything that needs to be very repetitive in look, but with different content, you'd use a content manager form. Below that, we've got some block options, so we can use this soon. You can list out some of your posts, chosen recent posts, category, menu, and store. You could add a product gallery, slider gallery. I really like to add related products to the product page or pages, especially you can add an individual product length your shopping cart. So we'll definitely be adding the shopping cart link to a menu. Below that, you can take online bookings and that's an entire app on its own that we'll get into later. You could add events. Again. That's another app that we'll get into later. You can set up your membership profiles here for your website members, perform members. And then finally, you can have these designs that you say across Iowa websites. If you can reuse things frequently. 10. Uploading Files and Images to the Media Library: The Wix Media Library is where all your files live. So in your Wix dashboard, on the left-hand side is this little photo icon. If you hover over it, it says media. That's your media library. So there's a few different ways to add or upload files here. So 99 percent of the time I upload files with the blue Upload Media button. You click there and you upload them directly from your computer. But you could also upload some from Facebook by connecting your Facebook account. Though it really I think only apply if you are creating some kind of personal website. You can upload them from Instagram account. You can connect your Google Drive and navigate. And within the file structure there, you can connect your Google Photos. There's actually quite a few different other ways you can upload files. You click on these icons, you can see all the ones on the left here. So I'm going to upload some files directly to the media library. But before I do that, I'm actually going to create a few folders so we can stay organized. As you have more and more pictures, videos, logos, others kind of content on your website. It's going to be very helpful if you stay organized by using folders. So it's name1 logos. Let's name another stock images, stock video content. All right, and now I will upload these local clean. I found all of these images on a website called free pick. I'll show you it in just one sec. It's super useful website. I use it constantly. Stock images and the subscriptions only 999 a month. So I really recommend you get a subscription to a stock library like this. If you end up becoming professional web designer or you just need a lot of stock images for whatever it is. So unprepared 3 Peg, I didn't search, travel and found a ton of great vector images, stock images, Anything that you could possibly need free picked probably has it. Back on our website. Our pictures are uploading six out of 40. You can upload multiple files at a time. And you can also exit out of the media library and come back and it will continue to upload. We've got our logos in there. That's pretty much it. It's really easy to upload images and videos in a kind of files to website. I don't think you'll have any problem. 11. Wix Theme Manager: In this video, we're going to do something very, very important to make creating your website as easy and quick as possible. We're going to set the theme, That's the global site, colors and fonts. So in the left-hand corner, we've got our menu. And the third option is the manager. Here we can set our colors and our text. The way this works is you set five colors that inform your color scheme. And then whenever you add, add strips, add boxes, add really any element to your website. You can set them to be one of your theme colors. When it, if you change your color scheme, I'll have to do is change the color here and it'll change globally across the entire site. So that means that if you make serious changes to your brand or use your whole website and decide you want a little bit of a different color scheme. You can make that change extremely easily in five seconds, as opposed to going down the entire site and making that change to every different element on the side. And it taking you hours. And the same thing is true of the text. You say your global fonts. And then if you decide you don't like Courier New, you'd like Times New Roman for your heading. All you have to do is change the text theme here, and it'll change across the entire website. Instead of going to each individual textbook and heading blog and making that change manually, you're going to save you a ton of time. It's going to make killing the host site way easier because you can drag and drop already stylized text and already stylized elements into the website. I promise you do not skip this part. You need to set your theme, your global colors, integral texts. So I'm gonna do that right now. To actually change these colors, all you have to do is click on the little teardrop icon. And then you can put on the hex code, made this brand kit for the website. And you can see on here we have some colors picked out for the website. So we're gonna grab these hex codes, these codes that tell the browser what color to select. And we're going to add those into the theme manager and wax. So we're going to do that real quick. So we're here. All right, so we have our theme colors selected and now we're going to select the text. Back on the brand kit. We have a heading font selected, done business as an all capital font. Males have a body font here, sands. So we're going to set those in here, even put directly on these themes to change them. So if you click here, it's pops up. And then we need to actually upload the font. Because the fonts we've chosen our third-party fonts, they don't come with Wix. So down here there's an upload button, click there. And then the orange Upload button. And then we'll grab our fonts. Usually one of the fonts that come with Wix would be fine. David kind of fonts. I decide to use custom fonts that you can find free. Oliver, the Internet, just cool search Free Fonts. There's something specific you could search. Script fonts. All kinds of things will pop out. The 1000 and prescript pons. So you can always find a ton of free fonts. I have to do is download them and then upload them here and you're the manager. It took a minute, but they're all loaded. So we can click Done, and now we can select the new font. So Dalton's going to be our new font for headings. And let's set the font size for your heading fonts. You went through a pretty big in your heading. You're heading 1 is going to be essentially the page title, the main title, the main heading for every page. So let's set this to 50. And we're gonna go ahead and switch all of our headings to end. Each have six heading fonts. Each one's going to be a little smaller than before. So this one, H2 to 40, 38. You don't need another strand now, but these headings correspond with HTML, HTML elements. So this tells the browser how to display these pieces of text. So we have all our headings, and then we're going to set our paragraphs. We have three of those. And you can use these interchangeably. For most of your texts. You can use paragraph one, but for subtext or some small elements, you can use paragraph 2 and 3. So usually set those a little smaller. And so we're gonna use fear, a sense for that. Pure sounds. And to use fear saying, she's fairly Sans extra light. And we'll set all these comparisons extra line at descending sizes. Okay, So all our headings are set, all our paragraphs are set out, our colors reset, so our theme is ready to go and actually finally, start building our website in the next video. 12. Strips: All right, The fun part. Starting now, we're going to actually build our website. The first thing that we're gonna do is create the opening header. If you remember, we created a quick sketch of the way you want this website homepage to look. In. The first thing we're gonna do is the big picture at the beginning of the website. An example from my own website would be this. So usually it's a picture, some heading text, maybe some subtext. And I'm buttons some kind of call to action. And there's me. So to do that in Wix, other design elements, remember, live under this Add button, you're going to click here and we're going to add a strip. Now these prenatal trips, including a welcome strips that you could use if you wanted, but it's so much work to edit somebody else's work that out. It's almost always easier just to use a classic on design strip and do it yourself. So let's drag one of these in here. It was to the Y1. So this is a strip, a shrimps like a row. And your, every page on your website when legs ideally is going to be a series of strips. So you're gonna keep adding strips for every new section on the website. And it's gonna make it really easy for you to reorder things on your website to move things around and change them around. And shrimps have some great features to one of them being that you can turn them into multiscale column strips. So on the website you see these black and white lines. This is your safe zone. This is where it's safe to design within. You want to keep all of your texts, all your content within these two black and white dotted lines. That's because everything within those lines is responsive on different screen sizes. So if we had a bigger screen or a smaller screen, everything in here, it will still show up. But if we added, remember we had our custom heading and a paragraph texts. Now, if we added some texts that we had it sticking out like this, outside of the black and white lines. It looks okay right now on the screen size. But if we zoomed in and we had say, a smaller screen, denote start getting cut off. Whereas the keep it within the black and white line on the edge. And we zoom in. It still says within the frame, within the viewport. Okay. So let's zoom back out and get rid of those. And let's learn a little bit about scripts before he built this. So you can change the strip background and it can be a solid color. And here's your theme colors, right way to set those as well. It could be an image, and that's what we're gonna do here. So meet me from Wix is free images from lakes. We have all of those documentaries we loaded in earlier. You're going to pick one of those. Then you can also choose a video that was gonna be really cool as well. It's up to you. What you choose. The design of your website's going to be very dependent on your goals and content you have. But for this website, we're going to choose a image. Before we put the image in there. Let me show you a little bit about columns though. So if you click Layout, third option, when you have the strips selected, you can add columns. And so are those black and white lines now live, now they're dependent on the column instead of the whole strip. We can use more of the screen itself, more of this green screen real estate, and depict more information in a more pleasant way. So if you click the third option, it says layout and click Add column to add another column. You can have a few columns. And so this is a great way. Oftentimes to split up some information and an image. So you might have an image on this column and add in some text and maybe a call to action button I in this column. You can change the background independently for each column, like this. And then you can also align the content left, right, or center. So if you want your content of the column to be further to the left, from there to the right, you can align it in that way. You can also change the size of the column, which is pretty cool. So under that same option management, I mean, under layouts, you can adjust the size of the columns. So maybe you want to have smaller image on the left and a lot more texts over here or something like that. You know, some preset icon proportions. That's a interesting way to make your layout a little bit more dynamic. So let's get rid of this column. We're going to manage column and just delete one of those columns. And now we're going to make this strip background and image. Let's make it a little bigger. So oftentimes it'll take up for your hero image, your main image on the homepage. Oftentimes it'll take up the entire screen except for the header, which we'll get to soon. So we made that a little bigger by dragging these little handles. Now we're going to change the strip background. So go to Image site files. But remember this is where all my files live in. Then we're going to choose one of these stock images. And I think this first one looks pretty good for a travel blog. So just like that, we have this hero image started and it looks pretty good, but we need some coffee, a text, and I think we need a button as well. So let's go ahead and get into that in the next video. 13. Adding and Editing Text: Alright, so let's add a heading to our main hero image. Back in the plus. We have these lists. Remember, that's what a text, and choose some of our theme texts, it's already styled to be coherent with the rest of our theme. Such choose that one, the heading 1, that's 4, specifically page in section titles. And put it in here. Now, when we drag and drop, and now we can just click and move this around. So I think we're going to put this sort of to the right. And if we double-click, we can edit the text. You can also get there by clicking Edit Text. Let's double-click and write something like come travel with us. Okay? So we have some text now, but it doesn't really look good. You can't read it. I mean, this isn't going to work right? So if we click edit text, we have all these options. So the theme and the fonts already said, because we set those earlier in our theme manager, remember? But let's center this text, something like this. Let's make this a little bigger, so it's all on one line. And to do that we're just dragging here and this little white dot. You can drag the text box to make it bigger. And then let's click edit text and make it white. Now sends out a little more. But what else could we do to make this really stand out? We can change the strip background by clicking change your background, and then go into settings. We can add a color overlay to this image. So we're going to make this image a color overlay black. And then we're going to reduce the image opacity so that this picture is darker, the white text shows up better. And so you're trying to create this con, it's higher contrast between the image and the text. So the text is legible. So we have that text. And let's add some paragraph text now. Poisson text, the text. While this first one, paragraph one. Let's drag that under, become travel with us. Make it a little bigger. Do the same thing. We double-clicking or changing the color right here to white. And our theme colors not in our custom colored in our theme colors. Because when we want to change the theme colors across the website, if we wanted to, we can do that easily by changing the theme colors over here, and it will change here on the page as well. So choose white again. And then we'll center it again, the line them. And then let's delete this and rewrite something like find out the easiest ways to travel on a shoestring budget. Okay, So a little hard to read. Maybe we can make this strip just a little darker. And then let's add a button. So in the plus, maybe buttons here. So we can drag one of these buttons right here, center below the text. And you can see this purple line that lets you know that it's centered under the text. Then we can double-click it and write, rewrite the button text. Hey, something like read the blog. Spot looks okay. We're going to restyle this later, but that'll do for now. And then over here on the left side, we're going to have an image. Just to make this a little more interesting, little more compelling. We're going to add this PNG, this image file of this woman, happy with her camera. A lot of travelers are in photography. So this makes sense. Okay. So that's starting to look okay, now, we'll clean this up more later. But now let's build our header. Now that you're aware of how strips work, how to add text, how to add an image. We're ready to build that header. 14. Creating a Navigation Menu: So in building our header, we need a few key elements. We're going to need our logo. We're going to need our menu. Probably went on button that has some kind of call to action. And we're going to want some links to our social media. And remember we planned all that out on our little piece of paper earlier. So we're actually going to add a strip to our menu so that we can have multiple columns and make better use of the space. So let's move this rebel away just for now, dragon and new strip. And then we're going to move this up to the header. So to do that, and we're gonna make this trip smaller. And we're gonna make it page width. Once we've made a page width, we're going to make it a little smaller so it can fit in the header, drag it up, it will glow orange in it. It'll say attach the header, but say, you know, it's actually being attached to the header and not being moved behind the header. So if you don't see this orange boxes is attached a header, you're not in the header, need to probably make your strip smaller so it'll fit within that header or you need to stretch it. Okay, so our ships back in the header. We can stretch it again to make it, excuse me, we can make the header smaller to make it the width of the strip. And then we can click the stretch and shrink it back to the full screen. Okay, so now you have a strip in our header. It's a great start. And now let's make this two columns. One column will hold our logo, delay column will hold our menu and our button and our social dealings. So we click Add Column. Now we have these two big columns. Not change the layout. The logo is only going to be in the left corner, right. So we can make that probably something like 25 percent of the strip. Okay, so now we've got two columns. And if we click again on, on column 1, we can click Layout and we can align the content to the left. That when we add the logo directly in the left corner. And then I'm calling to we couldn't same thing. Click the Column, click Layout and align it to the right. And now all of our contents cannot fit in here with the nice black and white dotted lines. Okay, so now we're going to drag our logo and our levels is going to be an image that we have looked at earlier. We're going to drag our logo to the header. We've got a folder for that. Cool. So it's attached to a header, so that's good. We're going to make sure it's within those guidelines. Not so attached to column. Okay? Now our logos in the header, and we're going to link this as well, the homepage. Most people know that if you click on the logo, you can go back to the homepage. You have to do this manually and Wix. So now our logos in there, clicking the chain link icon and then clicking page home. Okay. Now we're going to drag our menu into this column. So we hit the Plus button. You go to Menu and then theme and menu's. We're going to drag this first one in here and says attached to column. Cool. Now we have a menu in here, but this isn't the right order of pages and solid pages we want to have. So we click Manage menu and we can change the order of the menu and add menu items. So we're going to add some menu items and reorder this blue button and menu item. And then cite pages. These are all pages that exist on this website. The order I want is blocked first, then our videos, then our than our shop because actually going to be a button. So we're going to remove that, the three dots we're going to click and say hide from, then you are just going to hide it from the menu, not the whole website. And we're going to move the forearm up after the videos. So your blog videos forum about contact. I think that'll work. So we can click out of that. And now we want a button for our shop. Know what links for social media. So button will do that. The new button again, just to the right. It's another button will say shop in where it says what does it link to? We'll click there and go to Page and most liked the shop page. Okay, so now I have a button that says shop. It's linked to our shop to make it really obvious that people who click to a shop and go shopping, how many times can I say shop? Okay, and so now we're going to add social media buttons above the menu and the shock button. So we'll click Plus in and under social. Right here, we have the bars. Let's do black buttons for now. And now we have all of these links to social media and just put it to the right, aligned on the right with the shop button. Those are really big, right? So if we click Layout, you can make those smaller, maybe like 20 years back down. Let's make this button a little bit smaller. So we can drag on the corner to make that a little smaller. So now we have a header and let's drag our backup now. Okay, so we have the start of a website already. They were menu, we have a logo, labor hero image and a button to click at the shop. Social icons. We are moving. Now to set your social links. You can click Set social links. And then I have to do is click what social pages I can link to you. Click there and you just type it in. So ours is digital. Okay? Also, if you don't like these icons, you can click the replace icon. And she's a new icon. So typically you can just search Facebook and then they have a bunch of different icons for Facebook. You do a circle. You can do this, the actual brand colors of Facebook and keep it black the way it is for now. Now, one thing you might have noticed is that our menu font isn't the same as our other fonts. I think we want this menu font to be our heading fun, just because it's a nice style I like the way it looks. So we're going to click the menu and then click Design. This pops up and then we're going to customize the design. At the bottom is blue button. So we click there. We have all these options. And so under regular, we can click Text and then choose a theme. Remember we said our themes earlier. So we can choose our, I chose the H6 for Dalton. And since 2006, and I think that's a little big. So let's make it maybe 20. And that's a good size, maybe even 18 because it's capital fun. Thing 19, that seems like a happy medium. Okay, now we have regular hover and clicked. So the way each one of these menu items appears is going to be different depending on how you're interacting with it, whether you're hovering over it, whether it's the page you're on because you've clicked that link. Or if it's just sitting there. So if you hover over it, maybe we want it to be red, like our brand colors. And you can see an example of what that would look like. And we want it to be blue because our shop button is red. And that's a nice contrast. I think maybe let's keep it as blue. I think that looks great. And then if it's clicked, we can, it can be read. A lot of design is like this. You really just sort of feel out what you think looks best to you. As you do it more and more, you get a better idea of what looks good and what works and what doesn't. A lot of it is just practice and repetition. Okay, so now we have our full menu ready to go. In the next video, let's talk about styling our buttons. 15. Building Your Footer: Alright, websites coming together and get a menu here we've got our opening hero image. It's starting to look good. Now we're going to make our footer. I usually make the header, the footer and the hero image first because it gives me a good idea of the feel and the look of the site, how the colors are all going to come together. The header and the footer will be on every page. And so we need to make sure that as we design those pages, everything looks good with the header and the footer. So if you hover over the footer, we'll see that it turns orange. But just know that that's the footer. So similar to the header, we're going to add a strip to it and use the strip to design different columns. So the plus sign strip, classic, let's drag a white one in here and make it much smaller. So it'll fit it in the footer, the footer bigger. So the Gaza Strip and move it to the bottom. You'll see this button shows up that says Moodle twitter, going to click that. And now our, our trip is in the footer. So make it a little bigger again to make it fit within the footer. Footer a little smaller than that strip together. Well, this is just kind of deadline to get it just right. We're gonna make it little bigger size and make that strip. There. Usually there's a lot of fiddling to get this trip and footer to be right-sized for each other. And the same thing happens with the menu. That's okay. No big deal. It's just part of web design. So we've got the strip in here and now I think I'm going to change this to a background. Check out some images we've got, I think maybe could use one of these vectors to have a cool textured background. All right, Now let's put it background. That's kinda cool. And now let's add an overlay to make it match the rest of the site. Maybe red, lower the opacity. So that's kind of cool. Blue thing. The shade of blue works better for me. Reds kind of garish, kinda bright and already using it on our buttons. So let's use it. Let's use this blue. And let's add some columns. I just realized I made a mistake, but that's okay because this is an important lesson to learn. So I turned this trip into three columns. But if you look closely, you can see the separations between each column. That's because each column has its own background and the strip isn't sharing a single background. I want the ship to have just one background. So there's all these breaks between the columns. So to achieve that, well, we actually do is slight the column, change that column background to color. It, set the opacity to 0 and do that for each column. And once we've done that, we then select and change the entire strip background. And it will select that background that we were just using and apply that color. Lower the opacity like 28 and 10. Yeah, I think it looks cool. And by the way, you can always right-click if you have overlapping atoms. And for example, right now we have a strip over our footer. We want to select the footer, right-click and then go to overlapping atoms. And then further constructs that down a little bit because I want this to be a little bit. Okay? So now I have three columns and our footer. Now we can put whatever we want in our footer. And a lot of people put different things. Usually in the left-hand column that's in contact information. Maybe your logo. You might have a column for your social media links. You might have a column for our newsletter sign-up. You can put a lot of different things in the footer. It's really up to you and it's sort of depends on how you want people to interact with your website. Remember that people are going to see this footer on every page. So if there's any content or links or information that people need to find easily on every page. And at the bottom when they're scrolling on their phone, then the footer is a good place to put it. So I'm gonna put some contact information and strip. I'm gonna put a Facebook feed and the middle column. And in the right-hand column, I'm going to put a menu. That way when people are scrolling down and they finished looking at the side, there's a bunch more links and they can they can keep on prisoners. I so let's add all that stuff. And I'm just gonna go ahead and do this and probably speed up the video. So you don't have to watch me do this in real time, will make it fast. All right. We gotta put a put together. So we have get in touch column, contact, calm at that e-mail and upon number and our address, you're making a travel bug. Maybe you have an address, your addresses the world. And then in the middle column, etc, we're going to make, put a Facebook feed them, but it was be too long. I wanted to keep the footer a little shorter. So instead I put social links there. And then in the third column, I just put a vertical navigation. We also have the small text right here. Copyright. And so I built by me and my company, there's not great. So we have our footer, we've got our hero image, we've got our menu. We are making a ton of great progress. In the next video, we're going to finish out the entire homepage. See that. 16. Designing Buttons: Let's talk about customizing buttons in WebEx. So we have this read the blog button on our hero image here. Let's walk through all of these different settings and then I'll customize the button my way to make it look a little more interesting. So we could change the text icon and to add an icon would click here and then do texting icon and click two arrows to take an icon or I can do that right now, it's going to be text-only. This is also where you can link it. You can also click this link to link a, link it right now to our blog. Blog. It's important to remember to test all your buttons before you launch your site. It's very easy to forget to link your buttons or to link up with the wrong place because you're still building something out. So just make sure when you're wrapping up your site and you feel like it's for you. Yeah, we wanted to be continue your customer or user and test everything, passed, all the buttons, test the farms, do everything that you do on the website so you can be confident that everything is working the way it's supposed to. Okay? Next, you can change the layout of the button. When things are they adding, padding, changing the alignment. We're going to keep it center line or he bothers, change the color to exporters corner Shadow Layer icon. You also change the hover color. This button is for animations. We'll do animations in a later video until we built a lot more insight. Because usually we do that step last once you've designed most of its site and you're just adding some finishing touches. So now I'm gonna go ahead and make this look a little better to me. Now, let's make the text a little bigger. Maybe we should even use one of the heading fonts, so we think we can do that and make that smaller italics now. Okay? So we're not gonna have any borders. We're going to run out the corners by pixels h. That gives it just a slightly rounded corner. This can go all way up to a 100 pixels if you want it to be a round button. Actually, I kind of like the oval button. We're going to, we're going to use that. And then in shadows, this is a box-shadow. So this is the shadow is going to appear underneath into the side of the button. We're going to add a shadow. And the angle is the direction the shadow is coming from. So you see if the angles at 315 and the shadows going to be on the opposite side of this circle. So you can just kind of think about it like that. And I'm sure that's two this C, but you can see how it's rotating around the the button. So we'll leave it up to 15. Distance a little closer. A lot of this for the distance blur in size. This is how blurry the shadow was. 0 would be like a hard shadow. Size is how far away in pixels the shadow is from the button. So one of this is just kinda tweaking and pointing and messing around and trying to figure out what looks good to you. Let's try that out. Read the blog. That does look better. I think the shadows a little dark. So I'm going to make that shadow instead of this dark black or dark gray. Pretty so. Yeah, maybe that's too subtle. Let's change it back to black. Those are two different types of shadow, and our outer, outer goes outside of the borders and it goes inside a button with an inner shadow type, sort of looks like it's inset into the website, whereas an outer shadow type looks like it's 3D on top of the website. Hopefully that makes sense. And was never doing it. I'm still always do outer. I just think it looks better. Okay, and then on the hover settings, right now if we hover over it, it turns kind of pinkish color and a lighter shade of the red color. And that's fine. But I think I want it to be we don't want it to be blue or inverse of the red. So red text on a white background. I like the blue with the blue lips. And then if you click this button, you can apply the same design from regular to hover. Okay, it looks a little better. So that's buttons and it's pretty straightforward. Just like a lot of design and just play with a little bit. And I'm sure you'll find a design that works for you. And you're like, all right, let's get into the next video. 17. Finishing out the Home Page: Alright, in this video, we're going to finish out the homepage. That includes adding a subscription sign up for our newsletter, adding our latest posts, adding our latest videos for a blog and your latest products for a store. A short About Me section, and it should be about it. So we're gonna do that in this video. We're probably gonna fast-forward through a few of the parts and I'll talk a little more about some of the sections just so you understand what I'm doing. Let's get started. So over here, we're gonna hit the plus sign again. And in contact and forms, we're going to pull one of these subscribe bars and it is, this subscription boxes are kinda form. We're going to go deeper into forums later in the course. But for now, I'll just show you a couple of things so we can customize this and finish out our homepage. So we want to add a strip. Remember, we're almost always going to build our pages in a series of strips and get a little smaller. And I'm going to resize a lot of this. Bear with me getting rid of the phone and move everything over. Look more like this. And then I'm holding down Control to select everything, moving it up to the top of that subscription box form. And once a resize that gets subscribers form, I'm going to put it in our strip. Remember it needs to change color so that we know it's actually being attached to that strip or element. Okay? Let me something sort of like that. Be even smaller. River we can align using the toolbar here. Strip smaller materials, shared background to read our theme red so it stands out. Okay, now when you click on the form, there's a few different options here. So we're gonna go deeper into the form settings later. For right now I'm just going to design the form to match the rest of our website. Let me do that real quick. Okay, So I've created this subscribed bar right underneath our opening hero image. It asks for name and email. The purpose is to collect emails for your blog so that you can automatically send your latest blog posts and blogs to email subscriber list of send out a newsletter. You can send a latest videos. It's building an audience, right? And so we want to collect as many e-mails as possible on any website really that we have in almost indicates. Okay, so next up, we're going to make another trip and we're going to add our latest posts from our blog. So this is really easy. And the plus, under blog, you can just click recent posts and they have this convenient little slider element. So we can decide, do we want it just to be like this? We want to stretch it to full width. Let's keep the constraint for now, but when my change it later. And let's add a little bit of heading text. Just so people know what they're looking at. Latest blog posts. Read my, I'm going to try to make it a little more personal. And so there's a personal travel blog. Alright, so it's centered this in on the page. And so what I'm doing right here, just to go back, I'm centering using the lambda here to center it on the page. And then I'm adding the text and centering the text within that element, within the text element. Right, so we're starting the whole block on the page and incentive string the text within its element. Okay, so now we have our latest blog posts. Strip, It's kinda huge. Okay. And that's how the next section, which is going to be the latest videos. So again, we can hit the little plus to add a strip of black background who probably I'll change the color. And then on the videos and music books video, I think we can do maybe a small slider like this. Let's move it. Oops. Let's move it into that strap. Remember if I needed to hover the shortening to turn blue and we'd say attach trip to know that you actually attaching to a stroke. All right, Now I'm going to set up this week's video element. So I found some random YouTube blogger and we're just going to use her channel. So in the Wix video settings, we're gonna manage, manage videos. Then I'm going to just copy and paste her channel URL, Aaron Krauss. I don't know anything about her. Hopefully, she's not a racist or something. She seems fine. So we can use her channel for this website and we're going to have to feed. And so what's happening is, is weeks is just pulling all the videos from YouTube into the channel and just, sorry, into the WhatsApp and displaying them here. Now Erin crosses YouTube feed dish being shown on our website as well. Along with some blog posts or subscribe, we have the hero image, the header, the footer, the ones that really started to come together. So it's closely. And let's just change up some of the designs a little bit. The titles ran a new heading, three, left two lines fine. And the buttons random. Now the text. Let's make it paragraph two. Okay. And I don't think we need this background. Let's recolor some of this might change the background color. I kinda like the dark. Let's see what other colors might look good. On a lot of red going on. Blues, okay, we might use that for now, but think about changing it. Okay? All right, the next trip is going to be our latest products. So we're going to add another strip. Then the plus sign. We've got store, we get slider product gallery. So on the entire store, on the main store paid, we might use a grid product gallery where you can see all the products. But for this homepage, we're just going to add a slider so you can quickly scroll through some of the products that we have, the offering. And I'm not sure if you realize yet, but this is basically my strategy for this entire homepage, is use it as sort of a one-page glance over everything that's on the website. So you can see the latest blog posts, deletes blogs, the latest products. You can get a feel of everything that's on offer on this website. I'm gonna products go. It seems to be confused about which strip is where which. Sometimes you'll get little bugs like that in works. Just be patient and try again. There we go. Okay, so we've got our slider product gallery in here. Right now we don't have any products, will add some Pig products later. But this is just a good way to show you how this is going to end up looking. Okay, we've got our books, videos, we've got our products, and our latest blog posts. Let's add this text here. And let's make this text say, check out my latest blogs. And we'll make this white stand out better and to match the rest of the element. Okay? So I'm going to write in, we'll call this strip best-selling products. Selling travel products. Again, I'm going to use the toolbar to align it to the center of the page and then edit text and align the text to the center as well. Okay. This a little bigger. One cool feature on Wix is you can hold down Control, select multiple objects, multiple elements, and then group the elements. And so now that their group, you can move them as a, move them as a group. You can also align them as a group, which is super, super helpful. Okay, so we've got our travel section, would see one more section which is going to be an About section. We could use one of these pre-made ones, but I never do. I'm just going to build another classic strip. And we're gonna make it two columns. We're going to make one column a little larger. Because that calms, can have text in it and the other smaller columns can have an image. And let's drag an image in. Let's see, who do we want on the face of our travel blog to be? One of that Aaron Krauss grow look like maybe like this so much. Lisa. All right, so we have the image selected. We're hovering over the column. It says attached to column. Okay, we're good. Now I don't really love this square layout, so we're going to click on Crop. We're going to click again on shape crop and turn it into a circle. And we can drag the image around within, within the crop square. So we're going to center that up a little bit. Okay, it looks a little better. We're going to make the image bigger by dragging on these endpoints. Okay? Let's say, I'll tell me. It might make sense since this is called nomadic, Caleb, the size is going to be called a Medicaid club. This V picture of somebody who looks like a Caleb minutes 12. But you know what, I'm this far. So we're going to roll with it and we're gonna keep using one. And I'm adding in some text. There's a fun site called Ipsum.com. And I'll give you some paragraphs that I have a bunch of hipster words, edges, something to make it a little more fun for your Lorem Ipsum text, your fake dummy text. So recoloring that, right, and we're going to group this and center in a column. And I center this in the column to alright, that looks all right. It's got a little border to this lady. There, this white border and weaker, little bigger. And we feel about that. Maybe let's change the background. So I'm going to change the whole strip background. We did this earlier. We're going to change the column backgrounds to 0% opacity. And now we can change. And we had to strip selected being changed. The entire strip background, like any of these, will rock a gray for now. Okay. So the whole homepage is done. How long did it take us? Ten minutes. So we're going to preview the site and show you what it looks like so far. Alright, so it's a little basic. We're probably going to add some more design elements. Maybe that's some cool backgrounds and icons and that kind of thing. But the functional structure of the homepage is complete now. And I think it looks pretty solid. It doesn't look terrible. So great start. I hope this video shows you how quick Lee you could build your own website on Wix. And I'll have ten minutes. We have the homepage. I will probably do work on the site for less than an hour. And we've already got all this. In the next video, I'm gonna show you how to create a pop up. So you can do things like offer coupons on e-commerce store, ask for people's emails and exchange, maybe for some kind of free content. We're going to make a pop-up box or in weeks it's called a lightbox. See in the next video. 18. Creating an Email Subscription Pop Up: Alright, let's make a lightbox and gather some emails. So in this lead box, we're going to offer them a free travel guide to Thailand in exchange for their email. That way, once we have their e-mail, we can contact with push out our latest posts and that kinda thing to us, to them. And in general, maintain a relationship with this visitor instead of them visiting the site once and then never hearing from you again. So click the plus sign. And then an interactive, there's a section called light boxes. Let's click, subscribe and leave a few different options in terms of where the light boxes appearing from. So it could be a pop-up directly in the middle of the site. It could be something that comes down from the top, from the side, from the bottom. Let's do a basic centered pop-up. Lab boxes and nicer name but their pop-ups. And so let's do something like download. Mai, Thailand travel guide. Usually if you just ask somebody for their email, then I'm going to give it to you. Why would they? But if you offer them some kind of content and exchange, they're much more likely to give you their e-mail because you're giving something for free, for something from them. So I really recommend creating some kind of content, whether that's a short course or a travel guide or whatever, and offering them that for their email. Okay, So we're just gonna do a little bit of designing. There's a few different elements within this pop-up. There's the actual lightbox itself with its own set of options. This one way in particular as a container box that we don't actually need. So what we're going to delete it and then we'd get subscribers formed. It's actually collecting the e-mails. So in this light box first off, I this marble background doesn't make sense. Let's change the background. So you can click the paintbrush for design. And then let's choose an image. We've got a ton of stock images and I think we have some that are of Thailand. Probably. Just search down. Let's use this one. This woman traveling in time. Okay, and let's make it lighter so that you can read the text. We've changed the form title to be our heading font. Let's change the fields to match our branding as well. There's different ways to do this. You can click directly on the field and change the settings for that specific particular field. But what's best, the best way to do it is to click the actual form and change the design settings there. Because then it'll change the form field settings for the entire form, not just one specific element, one specific field. So we'll click Design, customized design input fields and we're going to change the text for this first paragraph 2. We're doing the paragraph to me just so it'll be a little smaller. Saw a change there. Now let's check how it looks on hover the same. Let's change the text and the color of the Submit button. So let's make the button red so it really stands out. In then on hover here we can have that blue color. The text. Let's change to p two as well, paragraph two. Okay, the success message. Let's switch that to be our paragraph three. Let's make it a little smaller. And we can have it be, let's make it green. And doesn't really stand out though. It can be red, that's done. Okay. There is our new form. I think that's good enough. Okay, now let's set the triggers for light box. So we don't want this to display on all of our pages. We just wanted to display on our homepage. We could have it set to other pages. Which one makes sense? Say somebody navigates to your shop page, you show them a pop up for a free coupon if they don't go and free or something like that. We're going to choose just the homepage so people don't get notice. It's going to be delayed by two seconds. So it's not the very first thing they say. See when it hit the website. They have a couple of seconds to read the menu and the logo, check out the hero image. And then after those two seconds, this pop-up will show up. Okay, Has that been close the x icon? That's fine. Other Let's put it in the light box. It's a little more noticeable. And then the last thing, if you click off the lightbox itself, then you have this background overlay. Let's change it. It's, it's kinda weird gray color. So kind of a nice blue color and then set the opacity so you can see that website behind them said it's like 25 percent. Okay. So that's our lightbox done. It looks pretty decent. There's obviously a couple other ways we could do is we'd have a video background. We can set this to be the top bar, to be a top bar pop-up or bottom barbershop, our side. But I think this looks solid under the forum title, you could probably add a little description and what you get in the travel guide. Maybe something like 100 plus pages. Awesome Thailand content center. This a little bigger to fit everytime. Okay? Alright, that looks dope. Let's make this smaller. You realize a lot of the job design and design in general, just playing with things, tweaking them a little bit, just to get it just right. Okay. See you in the next video. 19. Setting Up the Blog Page: Okay, The rough draft of our homepage is done. Let's now design our other five pages. We have a page for our blog posts are blogs, a forum where people can chat with each other and about page that tells you a little bit about nomadic Caleb, or whoever the traveler as and a contact page people get in touch with us. So starting on the blog page, when as soon as you set up a blog on wigs, it auto generates this page for you. And honestly it looks pretty good, it looks fine. But let me show you some of the settings and let's make this page it's a little more interesting. First off, I like to add a title strips to all my pages so people know where they're at and what they've done. So we're going to add a strip, and let's change the strip background to a color. Maybe make an image with a color overlay. Or maybe we could do a background, sort of backgrounds. We got we could do what we did on the footer, which was this block in live travel background. And then overlay a color on top of it. That blue. And we go about that pretty bright world that for now. Now, since this is our page title would do a Heading. One. Can center it and say my travel blog. Stretch it out, center to center the text. Make this smaller even not like that. Okay. Bring this back up. Okay, Now here's our page for our travel blog. If you click the blog section, you can go straight to the blog manager and you're looking dashboard and manage posts. But let's click Settings and look through some of our blog options. So under Settings, blog main and create a poster manage posts again, this takes you to the books dashboard where you can do so. You can select what actually displays here on your blog feed. So for example, I don't really like that. There's this little crown next to my name and then get rid of that. Published a is okay, but I want people, maybe I'm publishing stuff from a long time ago. I don't want them to know that it was published while I'm just gonna take that off. I don't really like that little legs counter. So it's my blog is brand new. I'm not gonna have a comments counter or abuse counter because I don't want really want people to know that I only have seven to use in your comments. I think that's taking the LDAP for new blogs pretty common, so I wouldn't worry about it. So taking those off, you can decide how they want to show the blog menu, which it would be this up here. We need some categories to show you what that might look like and we can make those in a second. And we're not gonna have a login button. Actually not since we have the forum, let, let's do add a login button. And that's what this little circle is. People can login and leave comments as their user profile. Now there's a few different layouts. This is side-by-side editorials, more like squares, sort of like on our homepage. We could have just put a bunch of random tiles. Magazine style, just like kinda cool and medium maybe looks good for a travel blog actually because it makes the image is more important. You know, it the full posts. We could have a column. I think I'm going to Iraq the magazine layout for now. We change the image ratio. What the image ratio looks like. For this image. I wanted to be square or 4 by 3, 16 by 9. There's different options. We'll do four by three for now. Let's see. What I do is fine. You can change all these different settings for the layout, the size of the actual pose, space between the post, which maybe we'll do like 25 margins, text padding, all this. Okay, we can change the design of the blog menu pose, buttons, the margins via settings. Probably you're not going to change most of the stuff. It looks pretty decent out of the box based on need settings, you set your theme manager. So we're going to leave this for now. Maybe we'll change this title text to be white though. That's what we're gonna do for the actual blog page. Now this is on our video page. 20. Setting Up the Video Page: Alright, let's create our video page. So I'm going to copy and paste this heading strip. So we can put the strip right-click copy. And then we're going to use the page Navigator to jump over to videos. Now here we are going to right-click and paste that strip. And we're going to rename this page, my travel blog. And then like on the homepage, we can click the plus sign and add a video widget. But since this is our main video page, let's use a different widget then this small slider. Let's instead do something like this where it shows you a main video and then a couple of videos in there might be equated to sorry and drag it and drop it in here. And make it bigger. To fill that space between those two black and white dotted lines. Let us know the safe zone for our design. Do a little more space at the bottom. And then in settings, we're going to hook it up to our YouTube channel, which was Aaron Krauss. And I really hope this girl's cool and not terrible person. And now our blog is set up. Let's go through some of the settings of that week's video app. You can change the layout and this is what we just dragged in. Just a different way to see it. So we could do the slider like on the homepage, different ways. Videos in a row. Let's do four. And actually let's set up a few rows so you can see a bunch of her her latest videos. Maybe like six. Let's see how that looks. Yeah, really shows that she's got quite a bit of content, a little bit of text, like it underneath. It's all too short. It's going to leave it on the thumbnail. So when you hover over, the player, can be the channel cover. I think that looks good. And we want all this information. I think. Well, I've usually come out on the Israeli YouTube videos, so it won't exactly work like that. And then in the design, instead of the title, remember we're going to set it to our theme manager settings. I've got some links, red button colored red. Okay, so let's preview. Now this flag looks so you can see how this is all going to work together. Okay, here we are in the preview. Now if you play the video and morning everyone, today, I don't need the super tropical. Okay. So you can see that it's embedded from YouTube or YouTube settings over here. You could watch it on YouTube. You hover over these, you can see a little bit about the next blog posts. And if you click it comes to the top. It so we sent to say, Okay, that makes sense. That's everything we're gonna do for the video page as well. For now. We might not have background later on. Now let's move on to our next page. 21. Setting Up the Forum: Our next page is our forum, our travel forum. So by default, since we used a travel template, It's already said the subject kinda be a travel form. So let's make a couple changes though. We're going to click on the forum. Stretched out the full word. Saw this picture stretches out, it looks a little better. And then in our settings, let's change the text under design to match everything. Match the rest of our website. And our description and post should be fear sands, which is our paragraph text. And let's make our titles DOT and actually in our paragraphs here sounds okay Now that matches the rest of the site. Now let me show you how this forum works and it works like a standard form. So you have posts that by default anybody can create with the Create New Post button, button. Create New Post button. So you can start a discussion which would be like these, or you can ask a question and people can vote for answers. And you can say which one you think is your favorite as the four moderator. And when you click into these, Here's that looks like you can like people can like the topic, comment on it. And their comments here with videos, pictures, gifts. You can see some other posts. It's actually really cool how much you can do with just a standard format for any basic normal form needs. I think this is more than enough. Okay, let's go back to the editor and let me show you some of the forum settings in the actual dashboard. So when we click Settings under main and we can do manage posts and categories. And this opens up, this pop-up, that's the dashboard. And we'll just add a couple categories so we can see that it looks like we'll name our categories, things, travel categories, like Asia. All about traveling in Asia. And you're going to add images and colors and all the stuff for the header. That's because let me show you what that looks like. Okay, now we have Asia as a category. There's less where discussion topics were in the travel form section of the travel form. And then we also have this new section, Asia and we can have a bunch of posts within this too. So here's what it is, is going to look like to your visitors when they're creating a new post. Check out my new post. This is supposed to do is publish it. And now Pages section has their first post. Super straightforward and simple, right? We could have added an image here to, to have ended background just like this image. Okay, so that's the forum. It's really pretty straightforward and simple. You can click Manage posts to see all your posts and do things like delete them, move them to new category, edit them yourself. But if you don't like something about them, you the moderator, you can make some edits. Okay? Under posts you also have moderation settings. You can set a limit for new, for posters that it seems like somebody spamming or it is posting an inappropriate amount. You can set up posts on it. You can change the attachment size. And this keeps your storage space on your website down. Because as you have more, more files being stored in your site, your hosting costs are gonna go up. So if you don't want to blow up your storage space, you could restrict the attachment sites. People aren't uploading 20 gigabyte videos or something. And you can block some words if you were worried about something inappropriate. So now if people say stupid or dummy, he goes Postal, be flagged as spam. Okay? All right, so that's the form. It's pretty straightforward and simple. And it works very well out of the blot, out of the box. Let's move on to next page. 22. Designing Your About Page: Let's make our about page. Let's copy and paste our headings trip and add it to the about page. And let's say something nice, like nice to meet you. So usually in about page gives you a short overview of the person who owns the business. Me most websites are about businesses. It gives you some insight into the business. Maybe you'll have some reviews or some links where you can learn more about the person. I think we're going to have a couple of images of R, of nomadic Caleb. And then we'll have a little bit about text. And that'll be pretty much, it's pretty standard about pitch. So let's add a strip. Remember we go The classic and add the blank Strips. Let's make it a bit bigger. Oops. Okay, and let's make it two columns. And you can make this one maybe about 45, just a little smaller for our text. And then let's add a couple images of ostensibly me, but we're not doing that. We're going to add this guy and this girl. Okay? So what I wanna do here, just for fun, I'm going to add these two people to this column and do a little design. I'm gonna make these look like Polaroids. So these images. So I'm going to go to Design and then choose the square white one. And I mean to me that basically looks like a Polaroid. And that's all I have to do. So design and choosing again the square with the white border. They'll say I've got a couple of Polaroid shown off what I do. So let's make this the same size are pretty similar. By clicking this image, I can see that the width is 254 3p4 pixels. So I can just select this other image and input that. And by default these are set to scale evenly. So now we have two images that are about the same size. Just looks a little better. Now, select both of them and group them in and use my Alignment tool to align them well in the center of that column. And then we're going to drag in some texts h1, h2, because this is not the heading for our main page. It's a subheading. All about somatic, Caleb. And we'll add some paragraph text. Books being taxed paragraph text. Grab some more ipsum text. Biodiesel handshake and distillery ramps, man bun, the shrub, hoodie, mumble, Corbay, pokey. I hate looking at these because usually I'm, I'm well-represented in all this hipster stuff, like pork belly. Wish I had a trust fund. Le le le let go to John. Yeah, I'm well, what presented by me. Okay. Copy and paste the text in. Probably need a little more intact. Let's grab another paragraph. Then inside another column. And we're going to add this cool element that I stole off the Nomadic Matt website, which is also obviously, I came up with a name for nomadic Caleb. So I'm going to add an image and then upload it real quick. Now, right now, it looks like we know what we're talking about. We have this as Sinon element, which by the way, if you can get published in, in any publications, not just these huge one Linden New York tendency at CNN. I highly recommend you pursue those opportunities because people don't really do respect these kinds of publications as social signals of the quality and respectability, legitimacy of your business. So being having an as seen on section if you've been seen anywhere is definitely what happened. Okay, let's make this strip background white. So that looks right. And we'll add a little bit of texts. So this doesn't just makes a little more sense. But these logos are seen. And it will center the text like usual. Move it up a bit. Okay. Super simple and straightforward. About you page or about me. All right, That's our about page. Some pictures, some text as Sinon. We're good to go. Let's do the contact page. And the bones of a website will be complete. Pretty awesome now. 23. Designing the Contact Page: Okay, let's make our contact page. And so last standard page on our website, we'll get into the shop later. So let's copy and paste that heading strip into our contact page. And say something like contact me. There's different ways you can layer the contact page. One standard simple way to do it would be to have essentially two columns, one of the form and the other with all your contact information. So really simple, right? So we're going to add in a strip and then beta and two columns, but equal size. And I'm just going to copy and paste our contact information. I'm going to recolor it. And then we're also going to want to start social links. We're trying to make it easy for people to get in touch with us and find all the information so they can get in touch with us how they want to recolor these real quick. Alright, so we have our contact information there. And then let's drag in a form, 100 plus contact in the forums. And we'll just do a standard contact form. We can do one like this. And then let's get it to fit into that column. And we've got a glitch will attach this form to our column. In the next video, we'll go a lot deeper into creating a form, adding new fields, customizing it, and really helping you master Wix is formed functionality. See you there. 24. Customizing Forms: Let's design custom contact form with a few more fields and walk through all the settings included in what's his forms. First off, we're gonna make this a little bigger. So we have space for this form and all of its elements, say within the Whigs forms module. So we're going to need to make this module bigger so we have a space for more form fields. And then we're going to walk through all these different settings, okay, for simply a form settings, right off the bat on the Main tab, you can go check out your submissions if you've been clicking submissions. But also it's helpful. Here's a set of email notifications. When people submit this form, it'll send out notifications With that information to all the e-mails on the team under roles and permissions we worked for that earlier. You could select who on the team that's actually get those. Now say you built this website or somebody else. They're not managing the website themselves, you're managing for them, but they need to receive the emails when people contact them and their form, you could add a new email here. But if you don't have Woods is upgraded, its center plans, that's what this is. Then you can only have two in those here. So maybe yourself and the owner of that business. Okay. So we'll leave about onsite team. Now. Now, you can set up different functionality. When somebody submits the form, you could have a little message like thanks for submitting. You can take them to a new page, like a thank you page. And I like to do that. You can add a little thank you. Message a little thank you. Video or something like that on that Thank You page. And it's also helpful in the future if you're advertising to track your conversions. So I like to set up thank you pages. There's other ways you can do it though. You could link to a file download, right? If, for example, earlier on our pop-up, the deal was when they submit the form, they're supposed to get a travel guide to Thailand. So we would need to upgrade our lesson plan so that people, when they submitted that form, they would get that file download. You could also link to an external URL. It takes them to google.com or whatever. Okay, next thing is payment. So we're not gonna go into this because we're not going to create a lesson plan right now, but you can create a custom checkout form. So you have some kind of customer product that you need to collect information for. And you can't use Wix store options or maybe you're collecting donations. Though week's payment form would be the option for you, you know, sort of conditionals. So that would be a field that shows based on the answers to a previous field. So say you have a question that says, Have you ever been to this location before? If you check yes, then the next field that pops up is great. What's your name? Maybe you say no, then the answer might be, okay, when we'd like to visit, something like that, right? So it's a field that depends on the answers to another field. The next tab is contacts. You can label the people who are using this form. So this might be, you might leave them as general contact form or something like that. And for a different forum and might be newsletter subscribers right on our front page. Okay, the next tab is automations. Automations are super useful. I really recommend you look into automating some of your workflow. Automations are actions that happened. Was the visitor takes an action. So they'll submit this form and the MI automatically as soon him an email and then create a new task to call them directly or indirectly, or invoice them, or whatever functionality you need for your specific business automation. You're going to save you a lot of time and use a variety of different automations in my own business. So as you start scaling and you find that you're doing things over and over and over again, manually. Anything that's being done over and over and over again in the exact same way. You can probably find a way to automate it. And this is one of those, this is one of those places you can probably automate some of your work. E-mail marketing. I don't really know what this is linked in the forums, but you can set up email campaigns and we'll talk about that later on in the course. Okay, so that's what our settings, the next tab for Whigs formed itself is add new fields. You can add a bunch of different fields. And looking through here for almost any form you want, you're going to want to add a recapture them. That's these, I'm not a robot fields. And these keep you from getting a lot of spam. The Morris, the more popular and more traffic you get to your site, the more likely you're gonna start having spammers who are just really there to annoy you. So I really recommend you add recaptured to all your fields. Spam down. And let's just add a couple of different fields. So these are our standard conduct fields, but then the basic fields is custom fields we can make. So let's add a question that says something like, where would you like to travel to? And it gives them a drop-down. We're going to add that. And let's also add one more field. Like What's your travel budget? And we'll do radio buttons for that. Okay. Now I can click into that drop-down and manage choices. And so this is going to be, what do you want to travel to write? So let's put that into the placeholder text. And it will manage those choices. And you can just double-click on these to change the name of those choices. And then, and the radio buttons, we can do a similar thing. We can manage choices. And it's going to be our travel budget. So let's say 0 0 dollars to $5 thousand, $1000 to $20,000.20 thousand dollars plus some high rollers. And let's add that field to make it ask. What is your travel budget? For radio buttons, you can also select a pre pre-selected field. You'd also make any of these fields are required and recommend doing that for things that email. So under edit field, this field is required. Okay, so now let's reorganize little bit and then style it to match those two per site. So it's been the recapture billing bottom. We can put it across the way from the submit button. And I think the message should be the last thing. For this. For that, we're going to add 41 to travel there. What did you travel budgets? No, I like the way that looks. I might take the borders of these and we'll say, okay. So there's our form. We don't really need that form titled because it's right there. Let's delete that and we'll move all of our fields up. Now, actually need to make this a little smaller too, because it's not fitting correctly into our guidelines and our columns. Which means that it's some screen sizes. Some of the stuff might get cut off. So I'm going to click on each field and resize it. And the sizes over here, or sizes on a 225 pixels wide. And that's actually out a little bit of breathing room between each one of these fields like this. Just so they're not laying directly on top of each other. It's got a little tight to me. All right, so we've almost got everything resized. Thanks for submitting. My contact bond. Will be in touch soon. Don't forget about little touches like your success message is when you submit a form. It's all these little things that make, that humanize your business and make it interesting people. That's obviously not the best submission texts, but anything that makes things a little more personal and people are going to appreciate it. Okay, we made that a little tighter. Now it's fitting correctly. Now it's in the room is white background and change the design to make it fit a little better. Before I do that, let me just walk through all the fields so you're aware of what each one is. So there's the standard contact fields. But then it basically holds you have short texts which would be like firstname, a paragraph field, which should be like the message. So you can write multiple lines of text. Number field would mean that you can only put in numbers. Radio buttons is like a multiple choice like this. Checkbox is a single checkbox. So something like, do you wish to receive communications from this business? Multi checks checkboxes exactly what it sounds like. He can check multiple boxes. This would be something like What's happening is you want on your pizza and you can check pepperoni, hell, opinio, pineapple, ham, whatever. Maybe that's not a good pizza. Anyway, drop-down field would be like, what do you want to travel to? Reading fail, you could give them a star rating. Date field, you put an open date time, you only put into time URL. You are required to put in a link like, what's your website? Subscriber opt-in would really be something we would need on that newsletter sign up on the homepage. Subscriber opt-in is just asking for permission to send emails to people and then invest field. You need your vigorous and plan, but you can also request file upload and even have them sign the form if you need a signature for something. Okay. Next, we have layout. And we're going to keep this pretty much as is this article I wanted. Okay, and then design. We'll do what we did to the point earlier. I'll fast forward some of this, but we're going to make this match the rest of our brand. Alright, so are formed ready to go. We've removed the background, added a couple options, customize the customized our submission message. We added a recaptcha. This form is ready for us to use on our travel bug. All right, let's get to the next video. 25. Adding Google Maps to Your Contact Page: Okay, so I've added a couple small elements to the contact page. So we put these into a container box with little Boyer's, make it a little more interesting. We had at a gallery so that you can be a little and spiral or cannot form. The last thing I want to show you how to do is how to add a map using Google Maps. So we're going to outstrip, as usual, probably a little bigger. And then an a plus sign. We're gonna go to contact and poems, Google Maps, maps, and different designs. We're just going to roll with the standard highways map for now. Let's stretch it out to people would make it a little bigger. So this is a really common way to do a map on a contact page. By the way, it would be at the end of the page for wet like this. It's, I guess it's really just the design trend. It looks great. So now we're going to select our math and manage locations. Now enroll which is 1, and addressing the Austin taxes. And the title is going to be nomadic, Kayla, I don't live too far from their Pilloton. Try to find me. Okay. And recognize anything else. Maybe we're going to add a description. World's number one travel blog. One cool thing about the Google Maps feature in Next is that she can change this little icon. So you gotta design. You can go to InDesign and see whether their default. Let's have a little star for now. I thank you and let's change the color to red cone. So that said let's set up a custom Google Maps. Say the next video. 26. Sell Online: Setting Up a Wix E commerce Store: Let's set up our store. E-commerce is a huge opportunity. It allows you to make an income from anywhere in the world. It's really attracted to people like digital nomads, which I technically could classify myself as even though most the time I live in Austin. But it really is incredible that she can make make money from anywhere in the world selling products that you might not even be storing yourselves. So you should be pretty excited to learn a little bit more about e-commerce. And in this video, we're going to add some products to our store. I'll show you how that works. So let's get started. There's two ways to do so. From the frontend editor, we can click on our shop, in our shop page That's auto created when we add the shop app, which remember was an ad apps. And so we can click here and click Manage products. And it'll open up this pop-up dashboard. We can also just go to the dashboard and go to store products once our apps installed, remembered in solving app first. And so we're going to start from here. And these are all display sort of products to help you out and see what the store, which is going to look like, store element on your front, on the front end here. So we don't need these anymore. We're going to delete all these products. The elite, we're going to add some new products. There's two kinds of products you can add. There's digital files or physical. So they explain what this is. If you're selling, in this case for this website, maybe a travel guide, WE digital file because you can sell on the PDF download. So any kind of information products are almost always going to be digital files. Physical is what it sounds like. It's gonna be a T-shirt or a skateboard or an actual physical book and not the PDF copy. So let's click physical. And I've created a few mock-up products for us just so we can see what these are all going to look like. Loaded into the site. You get images and videos that use health conversion rates. So if you can take videos of your products, I recommend doing so. But so we've got a t-shirt and let me add those images them. Okay. Or pictures or uploaded. I mean, it's quick mock-ups or different products using a website called place it dotnet link in the description below. But it's a great website to create mockups like this. And so here's a picture of our t-shirt or the tank top. Let's walk through all these different fields for product info. We can name the product, we can add a rhythm in the corner that says something like bestseller. And these will be saved so you can reuse these ribbons. And again, the ribbon is just a little box in the corner of the product image that has some kind of description. We can price it at whatever we want to 99. We can offer a sale and discount or dollar amount. Let's do 10 percent off sale. And you can show price per unit if you have something that you're selling by the unit, if you're selling, you know what, by the square inch or something, we can describe our product here. Really great. T-shirt Slashdot. And we can add some custom tax if it's a product that's personalized. Next, we can add product options. So this is a t-shirt, so we're probably going to have sizes. Small, medium, large, XL, XX, XX sex cell. So that's one option that people pan choose. That's one customization people can make, the other for a teacher, it's really gonna be the colored red. So let's name this color. And I'll just put it on the colors. Red, black, blue, green, pink, orange, purple. That's probably not. You get the idea. They can choose the color and the size of the product. You can also manage the pricing and inventory for those variants. So if you select this button, then the manage variance. Many variants spreadsheet essentially will pop up. And so say you wanted all of your extra large shirts to be an extra dollar, then you can select all those variants up here. So click the drop-down and you click Excel. It's going to select all the cells, right? You're 42 variance because you have a bunch of different sizes of extreme and colors. And said, walking through each item and finding it manually, you can select them all together. Say in this case, all the actual largest together. And you get the charge and sad as it away, so cetera charge and the charges an extra dollar per actual Archer. And there you go. That's all you do to change the, change the prices for a certain variance of your primary product? Okay? You can also set up subscriptions. Say somebody wants to buy a t-shirt every month because I don't know they were at all month long and it just falls apart. You can create a subscription, call it monthly t-shirt. Subscribe and say, how much should they say 10 percent. And it can be monthly. Typically. It depends on the product, But a lot of times descriptions or does autumnal, it'll cancel. If the customer doesn't say anything, then I'll just keep getting that product or that service forever. And then maybe 10 percent discount. Great. Now people can, we'd have to upgrade, but people can purchase a subscription and get this product every month. That's really all you have to do to create a new product and works on. Now I'm going to go ahead and add in the rest of our products and we'll talk about collections. All right, all our products had been added. We've got four products, a dad hat, phone case, a tote bag in the t-shirt, and it's really picked up. Okay, now we can create a collection. Pleasures, product categories, some services column product categories, some column product collections. Don't get confused. It's just a group of products. So let's create a new one that's called branded merch because that's all these products. So we just added, so we can name it up top and then we can add our products here. I have to do is check the ones that you want to add m. And then you can add your collection image, which in this case, let's make it this picture of a hat. And that's it. It's pretty simple. That's all I have to do to create a private collection. Once you've finished creating a collection, is popups going to show up? And it's going to ask you to add the collection. Now if you want, Let's create a new page with a product grid that's connected to that collection. So let's do that so that you can see what that, what happens. Alright, so when we clicked Add, now it created this page that has only are branded merch collection on it. And it will also going to create a new page for us and then the page brand image. So we can add that as a category page. But then we could add a little title. Didn't merge, stretch this out center. It would have been done. Cool. So now we have a page specifically for granted marriage. Now, let's talk about customizing our shop and our product pages. So we've got this brand image page. I'm gonna leave this alone for now, go back to the main Shoppe page, which would have all of our product side if we had more than four products. And let's add a title real quick. Okay? And you can customize this shop widget center. And you can also customize the product pages. So if you click into Settings here, and you can choose which collections being displayed in the shop. For example, we have been merged. We have the collections, we can show them here. Again, choose the display. And so there's just determines how the products are displayed. You can see they're changing here. This one looks okay. The image ratio or images are being displayed well enough. But sometimes you don't need to change this depending on what product you're selling. Four columns and three rows. That works for me too. We only have four products right now. We go into the settings. We can select what's shown. Product name, product price, named price divider. And I think that her mood but divider, to get it a little simpler, cleaner looking. And then the View More button should be loaded, more pagination would be where there's little bubbles at the bottom it says 1, 2, 3, 4. And you can choose which page to navigate to load more as just you click a button and it loads told more products. Infinite scroll, but you keep rope, keep scrolling, and things keep showing up. Okay, let's add an add to cart button just to make it easy for people to check out. You see that? And when the button is clicked, let's open the mini card. I'll show you what the mini card is in a second. Let's also add this show product options button. Now people can choose the product options, what color and what size. And for the hat, what size? Okay. Tax for the buttons Add to cart. That's works. Design. Yeah, these all work for me to add to cart button. We want to be black. Let's sit with that for now. So filters are very useful. I almost always recommend adding filters. Filters allow people to navigate your site based on a few different, well based on all the parameters that you've said. So collections, price, colour, size. And if we had more options for our products, they would be shown here as well. You can also add sorting. Sorting is gonna show up here. This lesson is to sort by price or by name. So the point of adding sort and filter to your shop pages is to make it as easy as possible for people to find the product they want and purchase it. The easier you make it for your customers to buy your stuff, the more they're going to buy stuff, right? That makes sense. So quick view is the little pop-up will show you that in a second as well. And that's pretty much it. So let me show you a preview of this page now so you can see how all this works. So we hover over and there's the quick deal really quickly is the popup. And just shows us more information about the product. You click the More details it takes you to the actual shop page. Okay, It's good case. Okay. And if we go back to the shop, we can look at the filter and maybe we don't want to spend more than $19. Sounds filtered out a couple more and let's say we don't spend more than $13 filtered a little further. Okay. Maybe we're looking for something in red so you can choose Read. Only the t-shirt's available in red. So now we know. Alright, so you get that. You can add it to the cart and you click Add to Cart II, this pops up and we can select medium. So this is the mini card. I recommend keeping this on. It just makes it a little easier for people to get around on your site. All right, now next let's customize our product pages. So we go to pages and restore pages. We can customize your product page right here. So I don't really like this product page that they've given us. It doesn't seem like a very good use of the space. So I'm gonna go to Settings and choose a different layout for the product page. I like the classic one, works pretty good for me. Now we've got a bigger picture and size and quantity over here. Good half. Okay, so we're going to add one thing to a product page and I recommend you do this on most of you e-commerce sites. The little plus. And then to the store, you can add related products. And this will show people products related to this one. Very shopping, something like this, right? Say you had a bunch of different hats. It would show them similar hats in this gallery. Helps people. It'll help me someone, essentially, because people are going to have an easier time finding products related to something very like it's already on this page, dairy like the hat, right? And they can see products related to that. Hopefully that all made sense. But in short, I recommend you add related products to become a star. Okay, so now our store product pages looking good. Our shop page is looking good. Let's add a little bit of space down here. One thing that we forgot to add to our menu is a card. So let's add a cart icon, real quick. Store, shopping cart. Then we're just going to drag this into the side. Let's add it right next to the shop button. There we go, like a shopping bag. So we're gonna go to Settings. I'm going to change the look of that. Let me just circle something simple like that. It's still a little bit too big. I'm smaller. Okay, now we have a shopping cart. Finally, you can customize the look of your cart and your thank you page from the workspace navigator as well. So I'm gonna show you how to get there and it's page and then car and inpatient and thank you. Page. I like the way these look. I think they look just fine. I'll move it up a little bit. I don't think they really need any changes, so I'm going to leave this the way it is. Whether the thank you page. I think it's also looks sometime move it up a little bit. Now if you wanted to customize these, you can them. Alright, let's get it in the next video. 27. Adding Animation to Your Site: Okay, now let's animate some of our website. The reason that we've animated is just to make it feel a little more interesting, to make them upset, a little more compelling, to make it more exciting to be there. Animations can also lead the user to, towards an action. Say you have a button uploads are glides that or something like that. Animations can be great for a variety of reasons. So let's animate some of this website. But the first thing we're going to animate as this button, let's just have it sort of flowed in from the bottom. Like that. Looks good. So you see what I did. Pick an element and then you click the moving squares, and this menu shows up. And now there's different animations. Now let's actually check out some of these animations so you can see what they'll do. Bounce m comes in fast, glide M glides and fatten flow then expand in turn in, fly-in spent in Arkin, Puffin, Bolden, flip and reveal, slide n. Yeah, the budget of animations. So I pretty much only ever use float in, fade-in and glide. In my opinion, a lot of these other ones look pretty corny like this. This is just way too much, right? You don't want animation to take away from message that you're trying to communicate to your user. So that's why I prefer more subtle animations like flowed in, fading or gladdened. So let's do it. The float in and let's keep it from the bottom. Once you select an animation, you can change the direction that the animation is coming from, depending on the animation. You can also select the duration. So how long it takes. If we have like a 3 second flowed in and watch along mistakes. Way too slow. So 1.2 is usually fine. And you can also delay the animation if you want to give people a little bit of time before this pops up. And then it's nice to do only animate the first time to set these animations don't happen every time somebody comes to the website, that becomes kind of a lot. So we've got floating for that one. Let's leave that. Let's see what else we want to animate. Let's animate this as a group. So you can animate an entire group to group these two texts elements, this heading in this body. And so let's animate it and let's have it float in, similar to the last one from the right. The image float in from the left. Like that. Okay, Now let's check out what we've got so far. So the button kind of float them. We left these alone. And then the about BLOSUM. I think what we can do with the strips is to have the elements inside of them grouped and then just fade and together. Okay? And the reason that I decided to put a failing them is just to add a little bit of interests to the page as you scroll like that. Okay, so let me go ahead and go through and add some animation to the rest of the site. And then we will check out the entire side so far in the next video. 28. A Tour of the Site So Far: Alright, let's go ahead and to our site so far, I'm going to refresh the page so we can say everything. Ok. Button shouldn't be here. There it is. There's our pop-up for Thailand travel guide. You can submit, are you now? And I'll see what happens when I do that. Thanks for submitting. Okay. Better subscribe form here. Let us blog posts or latest videos, couple animations, bestselling travel products about me. That's not me, sorry. Yeah. And then I'll check out our blog page. It's got all our blog posts in there. Videos page and to the two-channel of air and grouse. Who again, I don't know, but I bet she's great. Looks like she's got some great videos. And then our next page is our form. We set up some basic groups, Asia Travel Forum. Got a picture here. Very straightforward. We have our about page, cool animations here, pictures short about coffee and then the Sinon, even though this is not actually been seeing because this is a fake site. And then in our contact page, we have a contact form. Contact information, short little gallery, and keep people interested in our Google Maps. And keep on going to a shop. And our shop we have all our travel products, so I've branded merch. We're going to add these to our cart and it opens a mini card. You are cart takes us here and then keep on going and check out at a no. Thanks for being a great travel blogger. Okay. So that's our site so far. Definitely served its purpose, which is to be a central point for a travel bloggers information, their blog, their blog. There are discussion forums and a shop where they can sell travel guides emerge and that kind of thing. Now our next step is to optimize the site for mobile. So see you next video. 29. Optimizing for Mobile: Okay, This is pretty exciting. Now we're going to be optimizing our site for mobile. So it looks good on all kinds of smart phones. Optimizing your site for mobile is super-important. At least half of your traffic is going to come from people on their smartphones. And if you have something targeted towards consumers like a B2C business, like a travel blog, then more than hackers, your traffic is probably going to come from what's probably be closer to 75 percent. So it's great that our desktop site looks solid. But now we need to get into the version that actually most people are gonna see, which is the mobile version. And so I put here at the top, the page selection. There's a little icon for desktop and for mobile. Let's click mobile because that is how we customize our mobile version. Okay, So we can already tell this looks kinda messed up, like this isn't going to work. So let's really make the header first. This header again is going to be on every page. So this is a big step towards our translators hypermobile because it's going to end every pitch. So first things first, let's make our logo a little bigger and add that menu up to the top. This is a pretty standard layout for a website to have the logo and a little hamburger menu for the menu. Now, click on the menu and click Edit menu. Our actual mobile menu pops up. So we don't want them to look like this. We can check layout and maybe we can have it on the right instead. And that's fine for now. Okay? So we have three columns. There's just a lot of information here. Do we need our, all of our social media to eat all this stuff in here. I don't know. Let's make some of this a little smaller. Okay. And that's an improvement, but I still don't love that. Let's go ahead and hide the social bar. And we'll keep the shop there. The shops important. It's the moneymaker. That's looking better, but I don't love it. Let's go ahead and add the card next to the menu in between that and the logo. Make this a little smaller. Move all three of these items up a bit. With the shop right below that shock button, right below that. In the smaller guys, little more concise. Here. We make the shop button smaller. One other option we can do is we can click this button, right-click it, and go to move to menu box. So now our shop, can we put in our menu? Now let's click off of that. Now we're talking now as is much more concise. Now, I feel comfortable with this menu. Let's make it smaller. We need this picture of this woman here for the mobile version. I don't know. Let's try to make this trip bigger. Make this bigger so we can see, read the blog. I'm a position in here because it looks like a path is leading into Republic. Now there's some dead space and you hover over some dead space like this, you can just click Delete space. And that's an easy way to do that. You get an increased size, font size. On your mobile version, I have to do is click the font, click the text, and then click these buttons. You can just click the Settings button and type it in or drag the font size. I'm just making this a little bigger. Subscribe to the blog that looks okay. Read my blog posts. That looks okay. They distribute little bigger, actually make that 28. Which means, which is 128 as well. And you can't even see this. So let's move this whole strip down. It could be strip the leaves, the drag handle to drag it on down. All right, here's our bestselling travel products. You can scroll through here. So it looks okay. In our About Me, like solid. Now let's fix the butter. We haven't navigation at the top. We can hide navigate. Which means we can hide this entire column. Let's just reposition some of this stuff. How does that look? Which we make these more centered? There we go. Okay, that'll work for our footer for now. Okay, so now we have optimized the homepage for mobile. It's looking a lot better. But now we need to go through and do the same thing to all of our pages. I'm going to do that now. All right, that's it. And I'll have ten minutes or site's been optimized for mobile and it'll look decent on your smart phone. Check it out. Yeah, it looks pretty good to me. So I will add a video of this side from my own phone. And now our next step is to start optimizing our site for search engines and then locked to the same Callaway. See you in the next video. 30. A Tour of the Mobile Site: Okay. Hello. 31. Blogging with Wix: In this video, I'm gonna show you how to add new blog post to your blog. If you start on your Wix dashboard, on the left-hand side, you'll see blog in click in there. You'll see a few different options. On the left-hand side, published drafts, scheduled trash categories, and he publishes all viewer blockbuster have already been published. You can see we have some example blog posts in here already with an image. The title and the published date under drafts are post-dates you're currently working on, but you had not published yet under scheduled. You can see post that completed and are scheduled for posting like this one about Washington DC, that's got it for December 15th. Finally trash. You can see blog posts that you've got rid of. The chair, the option in trash to restore your posts in case you change your mind and decided not to delete one of these posts. The last one, the last option on the left-hand side is categories. And there's your blog posts, categories, so it's groupings, posts. So for example, for a travel bug amount of Asia, Europe, US, a blogging. And it's really easy to add a new post. You can just click new category and we'll name this one Africa. You could add an image right here, wherever you want. And this will open up your media library and then just stick a image in there. Super-easy. Okay, so back under posts and then published, you can see listening posts. And this is where you can create a new post. So if you click Create new post, this blog post builder will show up. First thing you can do is add a title, something like a live squid in Korea. And then right underneath that is where you can put your blog text. So I just have this copied and pasted. We can stick all of this in here. And this is more of that hipster Ipsum that I mentioned earlier. So you can copy and paste. Usually they recommend writing out your post in a Word document or a Google Doc and editing it there and then moving it over that we have your own copy somewhere else. And you can set it up to people without having to link to your website if you didn't want to for some reason. Was he ever tags added in to the blog post? You can also add things like images. I have to do is click in here and then click Add. And you've got a few different options. You can add an image, gallery of images or video files, dividers, buttons. So you can do some light designing these posts sort of like your webpages, but far more simple. So in this case, let's just add an integer to throw out here to make this blog post team a little more interesting. I don't have any pictures of live squared, but we can do some general travel pictures like this. And so once you add an image, you'll have a few options here. You could do the actual size. You could do a smaller fit, best fit for width. And this is really common to alignment to left to right. So there's text on one of the sides of the, the image and these little white circles, you can drag these similar too on the Wix editor to resize your image. And then you can also edit the image using the same image editor as in the frontend editor. You can change the settings on your caption. All types we'll talk about a bit later. But this is an SEO feature that essentially describes your image to me, to search engines. So this would be a woman in yellow holding model airplane. Let's go ahead and name that. Will do that for the caption to. You can also link your images. And finally, you can replace them. If you select any of your text. You also have all these options similar to a Google Doc or a Word document. And you can change any of these settings whenever you'd like. So you can make these things bigger. You can add headings to your document. You can put things in quotes, which is kinda cool. Let me show you what that looks like and breaks it out. It's a pretty straightforward if you've used a, any kind of text editor before. Now let's talk about some of the settings on the left-hand side. So under the Add Elements button, There's settings. And so you can create, you can change your cover image, cover images with what's going to show on the front end of the website. It's this image right here. We'll keep this as the image that we've already added to the post for now. You can change the published date and so you can publish things retroactively. Say you wrote something on May 1st and you want it to say my first Indy ordered in that way. So after these, so you can publish things retroactively. You also change the author. You can have as many options as you want. So if you wanted and south are to be Stan, then you can just add an image from your media library. Maybe this guy's Stan. Guess blogger. You can change your SEO settings. So these are pretty important. This is what's going to show up on Google. For this post. You want your post to be optimized for search engines so that people who are looking for certain things, like, what's it like to eat live squid and Korea. I would show up. So you can rewrite the title and description is going to show on Google for this post, if you'd like something like, what's it like to be squared? I did it in Korea. Read my report. Okay, categories is what we talked about just a few minutes. Go into the categorization of your posts, will categorize this one as Asia, because upgrades in Asia, you can tag this and this is another way to categorize. But it's a little, it's taken on a smaller level. It's not a main category. People can click on the tags and see other posts have been categorized with the same things. So we cutters as Asia, Korea squared food, something like that. Monetize would be, you can offer subscriptions to your blog. These aren't, it's not that common to offer subscriptions or blog posts. So we're not gonna get into that too far. And you can also set up looks multilingual and we'll talk about looks multilingual in another video. But you can have a multilingual site. So maybe this post isn't English and Spanish and Korean or something. Okay, so once you have your posts looking the way you want it appear, and also it will be turned on a Mac and make sure you save your things, periodically them, and let's preview it. So here's what a pulse is going to look like. You can see that picture stand up here because I'm stands name. You can see other things he's written. Here's our title and our texts. Here's the image we added, and here's those tags. And if we click on that time, we would be able to see all the posts with that tag. Okay, So let's exit out of here. And now we can publish it. We can either publish the post immediately, save it as a draft, or we can schedule the post for the future. Google and other search engines like to see that you're publishing content periodically. So you could schedule your post, right? Five or ten articles are many articles. You're going right up ahead of time and then post them on some kinda preset schedule. And that's once a week or once a month, once every other week. It's up to you just to demonstrate this for you. I'm going to set this to publish on the 8th of July. Okay. Post scheduled for July. So that's worked. But actually, I'm going to go ahead and publish this now for you, real so you can see what it looks like on the front end. Refresh our blog page. And here it is. Stan. One minute long read, I live squid and Korea. There it is. So it's really that easy to publish a blog post. If you already have some written, you can get those published very quickly. And if you're running them regularly, the technology on wigs won't be an impediment to you. You should be able to have no problem navigating the blogging functionality and works. Alright, that's it for this video and I'll see you the next one. Thanks. 32. Content Manager Tutorial: Alright, in this video, we're gonna get into something a little more complicated, a little more advanced and wakes and that's the content manager. The manager is essentially a giant spreadsheet that can be used to dynamically create pages and category pages for information. So for example, say you're a home or modeler and you have a 100 different projects that you've done in your display. Those you can use the Content Manager to create a 100 identical layout, layout pages with, with customized information for each project, say the date of the project, and some guests from gallery images and a cover image. And it would also create a main page, a directory of all those pages, so that people could easily scroll through those. And let me show you a few examples of that. Here's two sides I built that are currently using the Content Manager to manage their portfolio, projects or properties. So kw is a general contractor and he's in Texas. And so we've set up the content manager on this page to display a lot of their projects. And so this is actually an image that we set in this spreadsheet that I'm about to show you. The title is, is set in that spreadsheet and it's linked to this portfolio page with a gallery, with a title. And that's pretty much it. And each one of these pages looks identical and is identical. It's using the same layout. That's all pulling from the content manager. And if this is a little confusing, it makes more sense in a bit. Okay, Here's another example. Jsp I properties. They rent properties in West Texas. And here you can see they have listings, homes for rent. You can see the address, the beds, bath, square footage, the price per month. And if you click into these, you can see more information about that particular property. You can see a little gallery. You can see probably description that they have on contact details, very location. And now let me show you what that looks like in the Azure Content Manager and the back-end of weeks. So here's the backend Content Manager for Kw general contractors. This one's pretty simple. We just had a few fields. And remember this is just a spreadsheet, right? Nothing you haven't seen before problem. And so you have a project names column, a product image which is the main cover image that we use on the directory page. And then we have the gallery of their different pictures of the project. And then here's one that's a little more complicated. As one as JASP I invest in properties. Here you can see we have a title of the property and number of bedrooms and bathrooms, the address, property type. How's duplex like that? The cover image description, if there is one, the price and square footage gallery. So this can be pretty complicated, right? And you can make these pretty extensive if you want to, but they don't have to be. So I think hopefully you can see from these two examples why having a content manager is useful if you have a lot of information that's repetitive that she'll need to display in some way. Some other examples might be if you have lot galleries because you're a photographer or you're any kind of designer or creative and you have a large portfolio you want to display, the content manager might be your best bet. So for our purposes, we're creating a travel blog. So let's use the Content Manager to create a group of 518 identical pages we can use to display some travel photography. So then we can have I photography page for all these different countries that this travel photographer might be going to. So we might have a page for pictures from Korea and it's much pictures from Korea. And we have the date the date range that they were in career for him. Okay. Let's get started. And the left-hand side under the plus, we're going to click Content Manager and get to this screen. And we're going to click Add decide. And so this is going to create two pages for us, the main directory page and then the custom page that shows each item in your spreadsheet, each piece of that database. So let's use, let's use this portfolio preset just to make it a little bit easier on ourselves. I'm going to click Add decide. Okay, so it's created a template content manager database for us. So the title of the portfolio piece, that description, the year, the gallery, and then the main product image. Let's have a client name. So we're going to be worth this a little bit. We're going to customize this for a travel photographer it so we can have, instead of a title, Let's rename this country name. We can keep it in the description and you will make this visited. Will have a gallery and main product image were moved the client name. Okay, now let's put in some country names. Now we've got our country names in here. Let's also add a field so you can see how that works. So if we scroll over to the end of the spreadsheet, the database, you can click the plus sign and you can add a field. There's a few different kinds of fields that we could create. A simple texts, one simple TextField, an image field with the main product image, a boolean, which is a yes or a no. Checkbox, sort of a number a day in time. Just the time. Rich texts, which is texts that can be designed with bold, Bolding, italics and the kind of thing, links, documents, PDF, download, video, a video, music, location, Tags, media gallery, some coding functions. So let's create a new field called country location. And we'll use that map field type address built that. And then these can be relocated in, they can be reordered. The fields can be reordered if that makes it easier for you. So now we have the country name. Then we can put in the country location to create a map that we can add to our website, help people out their geographic knowledge. And so now I'm going to go ahead and customize this spreadsheet so that you can see what this is going to look like on the front end. So I'm going to probably fast-forward to this part and we will reconvene in a second. Okay, now our content manager database has been completely thought out country name and your location description. They are visited the gallery and the main project dimension. And it's named this man country. It's actually rename this from portfolio too. Travel photography. Save that. And so to rename it, I just click the three dots and then click Edit Settings. By the way, you can also import items or export from a CSV. So if you have a actual spreadsheet with some similar content, some information you could upload that here, and you just need to make a spreadsheet with the same column headings. Okay, so now let's publish this and you hover over this, you'll see that we need to actually publish our website to see this information lives. Let's do that now. Let's exit out of this. It's going to auto saves and y. And we're going to click Publish. Let's be this side. If you've got a portfolio, this is the directory for all of that information that we just set up. So you can see that each line has its own item, China, Colombia, Morocco. And then if we click in to one of these, you can see that main cover image, the title, and then some of the images. So this works. Our information has been added and we have this directory that's been created with these directory pages. But obviously, we don't have a client. The year data's missing. The layouts kinda messed up. So now let's work on the actual layout of our pages and how everything connects on the page to the content manager. Okay, in this video, we're actually going to design and layout are pages that are being created from the content manager are going to connect some of those fields from that spreadsheet, that database and the content manager to these pages. And generally we'll finish these pages that have been created by the Content Manager. So starting on our home screen in the front end Wix editor, we can click Page Up here and scroll down in this listing to portfolio all our portfolio title. So let's click on portfolio all. And this is our main directory page, so it'll have all of our listings from our database. So you'll see a couple interesting things here. One, here, the sole have anything. This isn't gonna show up on the front end. This isn't gonna show up on the actual design of the website, but this is a quickly to manage our content and the content manager, which can also be found right here. And then if you hover over some of these elements, you'll see this little squiggly line. So this is your dataset connector. When you click this, you can connect different elements to the data in your content manager spreadsheet in your database. So if we click the Wix pro gallery, this guy right here. Click Continue the data. We can see that the dataset is a portfolio. That's, that's the spreadsheet. That's the name of the spreadsheet we're working on. We can see the image source for the Wexler Gallery is connected to the main country image. That field in that spreadsheet. The titles connect to the country name, which is also a spreadsheet. Descriptions here connected to. And now we can actually connect this ourselves. So scriptures connect to. We can click here and click the arrow and select where this, where this field is connected to. So let's add it to description text. We've shorter descriptions, remember for each of our countries. And so now everything is connected. This could be switched. But the only looks only allow you to connect two fields that match the field in the designer. So for example, in this gallery, the single image source for each picture in the gallery. Obviously we couldn't connect that to the full gallery in the spreadsheet in our database. We can connect to the texts will get a single image. And the only field in our database That's a single image is the main country image field. So we'll click that and it links, connect to the port for the title and before the title when it's in parentheses, tie like that. That means it's the specific page that's created for each line, each row in the database. Okay. So to stick with me if it's little confusing, just stick a stick with it. And it'll all make sense after you practice a little bit on your own and you walk through this a couple of times. I also recommend if you're a little confused, just watch the video again and you'll start to get in. Okay, so we can customize the ladder of these different items a little bit. We already have it set to stretch. Let's also click on settings layout. And we can affect the look of the actual layout. So for me, the items are really spaced out. I don't think when you nearly this much space. So I'm gonna go to Layout, customized layout, and reduce the spacing to like, let's do it. 50 looks like. That's a little tighter and so it looks a little better to me. Okay. And let's change the strip background, something more interesting. Maybe just a flat color for now. And we'll switch this to be white. Let's get rid of this extra strip here and tighten up the spacing. Okay, so now we have the basic portfolio directory page, and now let's customize our actual portfolio pages for each one of our travel locations. So this is the main image, the main country image that we set in our database. Let's make this a little smaller. Stretch it so everything stretches with it. You don't have a client. So where are we going to get rid of this? And then we have these two fields, year, which is a static field, it's not connected to it and say it. And this is the actual, this is actual field that's connected to a dataset, our dataset. So we'll click here. We deleted the year visited field and we replaced it with the are visited for a number field. So replace that and we'll see now the correct data can put being pulled in 2017 for China. And I'll just name the static field you're visited. Let's move our description text to be in line with this information. And let's make this whole bit smaller. And if we scroll down, we can see the gallery images that are that we added in our dataset. So if we click Manage Media, this is just the static, and these aren't the actual images that'll show them. These are just static place orders. You'll see if we actually see the correct images. And similar to that front page directory. And I think the spacings where it's on a fixed that. So Jenna, Yeah, that's better. For these Previous and Next buttons that are linked to the neck Previous and Next item in our dataset. So if you click the data will see its continued this IT portfolio. And click, click action. So clicking the button connects to the previous enact page. These are all dynamic pages. Dynamic because they change. It's a layout that changes based on the information in the dataset. Remember it dataset, just a big spreadsheet. So remember we have a field for address. So let's add a map that shows where in the world This place is on a map. We'll make it a little easier for our visitors. Let's get rid of this extra space. So in the strip, Let's add another column to give ourselves some more space to add a map. So we'll click there and we'll get rid of the duplicate information. And we space all of this. And we're going to add an, a map to this column. So if we put the plus under contact and forums, we can add a full width map or a map widget, little map square. Let's add that. Now we're going to make it fit within the column, so nothing gets chopped off. And it needs to hover. When you hover over, it needs to say turn blue and say attach the column. And so now it's in that column. And then we can connect it to the datasets. So if we connect a dataset, click that squiggly line to connect to the spreadsheet right database. And then the location connects to the country location. It's now it's added to China. And now let's just do one little thing. Let's zoom out quite a bit so we can see we're in a world that is Something like that. Okay, so our custom pages for our photo galleries, for our travel photography and are complete. Let's go to the menu real quick management. You can rename the portfolio, travel photography. And let's add all of our new pages. Dynamic pages. We've got China dynamic pages. No, I didn't already, so fast-forward and then I'll add them to the menu. Okay? Now, our menus created with all of our sub-menu items and our main data set page. Let's preview the site and show you how everything came together and put photography. And will take us that main page with each one of our travel photography locations. And if we click in, all of our pictures will be there. Remember, we didn't do anything specifically to Sweden page, right? We're customizing the China page, which you can see that the title is write the main image is right, the location on the map, and Sweden is correct. The years correct. Corruption or gallery images. So I'll have to do is customize one pages layout. It affects the look up all of the pages in the Content Manager. So hopefully you can see how powerful this is and how useful would be if you have a lot of information to display, like a lot of locations. If you've been to a 180 countries, you don't want to create a 192 separate pages. You'd use a content manager to show up as images. Okay? So that's the content manager in a nutshell, I know it's a complicated topic. It can be a little confusing. I would recommend just practicing with it, trying to set it up yourself. And if you need help, I'm here to help. Just leave a comment and we can discuss it further. All right. Thank you. 33. Optimizing Your Website for Search Engines: In this video, we're gonna talk about optimizing your Wix website research engines. This is called search engine optimization. This is a very deep topic and a lot of people have a lot to say I'm this. We're gonna go over just the basics to make sure that you're set up for success. And now your site is optimized correctly when you launch it, the first thing we can do is go to the w6 dashboard and then go to marketing and SEO on the left-hand menu. And then under SEO get found on Google. So this is a little tool works has they called the Wix SEO was and help you pick out some keywords and get started on optimizing your site. So first we're going to put in our business name a. Caleb, I'm going to say it's online only. And to describe over and say travel blog and travel blogger, travel photographer. So these keyword phrases need to be phrases that people might be searching for when they're looking for your business. So for us, if we have a travel blog and I'm looking for a travel blog, travel blogger and travel photographer. These are keywords, search terms that were targeting. If you had a plumbing business that you might have something, your key would not be something more like a plumber, Austin plumbing company, Austin, something like that. Okay, So we're going to create our SEO plan using these three terms, travel blog, travel blogger, and travel photographer. And now we're just going to give us a list of recommendations to make sure our site is optimized. So it looks like we've done three of the 71 being the homepage text is optimized, which it just means our keywords are included on the homepage text. Our homepage is said to be visible in search results. And I'll show you where that isn't a minute. And your site is mobile friendly. So remember we optimize your site for mobile devices earlier. So the first thing we need to do is optimize our homepage and also our other pages by changing their Meta tags to reflect our site. So Meta tags are what you see on Google when you search for something like travel blog. So this right here is the meta title, and this is the Meta description. So these are just terms that mean the title on Google or other search engines and the description on Google or other search engines. And a front page editor, if we click Pages, main pages, and click these three dots next to the home or any other page. And the second option is going to be SEO, and this is Google in parentheses. If we click there, we open up this menu and this word, we can change the Meta title and Meta descriptions for each of our pages. So we want to have Meta tags. So the Meta title and description that contains some of the keywords that we're targeting. So we said three keywords, travel blog, travel blogger, and travel photographer. So I'm going to add those in here. And that Caleb, travel blogger. Come check out my winning travel blog and see some of my awesome travel photography. You see we're adding these keywords that Google knows what our websites about. So we're going to do similar things for each page. Okay, so now I'll have Meta tags, the Meta description there set. Let me show you one more thing. At the bottom of each SCO page, you'll see this tab that says shows people search results. And now that check, if you uncheck at that page won't be crawled by assert their search engines bots, and it will be listed on search engines. There's also advanced SEO that's a little beyond the scope of this course. And really you probably won't need to mess with it to perform well on search engines. Okay, So let's make sure to publish your site first. And once it's published, Let's go to the books SEO was and refresh it and see how we're doing now. Okay, Well now we're missing one more thing. Add the homepage is description for search results. So we forgot the business name and our description. So let's go back home SEO google will have configured nomadic, Caleb's award-winning travel travel blog. We published it in and we refresh to. Okay, now we've got the check. Last things we need to do is connect our sight to domain and connect Google Search Console. So now that we have the basics of our site optimized for search engines. So our next step is to apply a premium plan to our website and then assign a domain name to our website. And in case you don't know, a domain name is just this Nomadic Matt.com. Obviously, this is the name that I know Medicaid above. Okay. 34. Setting Alt Tags: Alright, so let's talk about alt tags. Ol tags are just descriptions of your image. People who are using screen, screen readers, like the sight impaired, need these all tags to tell them what the image is, what it contains, what it looks like. So this is an important accessibility feature. It also helps Google's bots understand what your images look like, what they contain. It describes the image to the bots. This is an important SEO feature and it's also really easy to set up. I have to do is click on your image on any of these pages. And then in settings, this image settings box will show up. And then under image text a little bit further down it says, what's in the image, tell Google, that's where you can set your alt text. So usually by default it's just going to grab the title of the image and put it in there. So this one's happy. Photographer girl homepage. I wrote, I titled that earlier. But let's, let's make it a little more descriptive. And B, woman taking photographs in green shirt. And you want these to be as descriptive as possible without writing a whole story about it. And so then we would go through, and for any images, I would describe them. So here, same thing, we can click Settings. And here we could write a portrait of a woman blowing kiss on the beach. Okay. So that's all there is to all tags. Don't be intimidated. It's super easy, and I'll see you in the next video. 35. Connect Your Premium Plan and Domain Name: Okay, so great news. Our website is basically finished. It looks great and it's ready for launch. And my advice is don't be scared to launch before you think you might be ready or the website is perfect. Because it's more important to start, to get something out there and start making sales and interacting with the public than it is to have your website absolutely perfect and have not a single issue or flaw or anything until you start making cells, you don't really have a business. So I would recommend launching as quickly as you can and then continuing to iteratively improve your website and your business as you go. That's how things work. So first we need to assign a premium plan and then we need to assign a domain name to a website. So the dashboard we could go to here, compare plans or settings, compare plans. And you can look through different, different plans. I'm talking about the different plans earlier in the course. So you'll probably be fine on the combo plan. Or if you're going to be doing e-commerce like the side, then you will need a bit. So no matter plan. So I actually have plans through Webex because on our Web sludge in partner. So I'm going to go assign my planet and we'll be right back. Okay, So assigned a business unlimited plan to my website. And now I will come to this screen and it says, congratulations, you're sad. It's premium. Get the best domain for free. Because of a free domain voucher makes you have a bunch of these because we have so many plans through works. You might have a free plan, you might not. I'm gonna get my domain through Wix. And if you do it like that, It's super-easy. Me show you. All you have to do, like to do is put in your domain and we'll do something like nomadic dash Caleb.com, just because I think that's gonna be available and it's easier to read if there's a dash between these two Cs. So let's grab that and I'll do it for a year. Don't look at that. And we'll keep the public registration because it's cheaper. Okay. That's it. Thank you for your purchase. Nomadic edge, Caleb is now assigned to the Medicaid, so our sides left. We have a premium plan assigned to it. We can now accept payments. There's also this little notice asking me if I want to personalize mailbox. I don't because this isn't a real site, but I would recommend you getting a mailbox makes it look much more professional if your email addresses at your website instead of at gmail.com, as somebody who deals with small business owners all day, every day, having your e-mail address be at gmail.com is a 100 percent dead giveaway that you're probably new to the business. You don't really know what you're doing and you're probably not making much money either. And for me, I can't work with people who don't have money to pay for my services. It just does not make you look good. I would recommend getting a professional email address. Okay, so here's where domain now, but what if you have your domain on somewhere else, like GoDaddy? Let me show you how to add a third-party domain from a service like GoDaddy and about two minutes. So a new domains. So if you go to settings and then domains, you could manage a man. At the top it says add an existing domain, click there, and then click connected domain you already own. This can be from GoDaddy or named cheap or Bluehost, or wherever the heck you bought your domain. So we're going to come to this domain name from GoDaddy to our Works website. So direct connection methods, There's pointing in name servers. Name servers was a more foundational change. By appointing. He just change a couple of settings and it won't interfere with any of your email inbox settings where changing your name servers will interfere with your email inbox settings if your email inbox and setup on GoDaddy. So if we assume that you bought an e-mail inbox already when you bought a domain name on GoDaddy, then we use pointing. If your email servers are going to be running off of Wix, then you can use the name servers connection method. So I'm going to assume that you bought an inbox from GoDaddy when you bought your domain and will use pointing. Okay, So we have some markers as their domain name, alright, and click Next. It recognizes that our domain name is from GoDaddy. Yes, it's from GoDaddy. And then it gives us these super-easy instructions. And so I had to do was changed to records or a record and or CNAME record. We jump over to GoDaddy. I've already brought up that domain name ripping San Marcos. And we can manage the DNS here. And then I have to do is change this NAM record and the CNAME record. So we can copy and paste that a record right here in the value box. Points to here. That's all we're going to change. And then the TTL, we're going to set that to 600 seconds. Okay? Ttl stands for Time to Live. And it basically is a timer on the information after which this information will be recent. Two browsers and web so will be accessible at these values. So let's go to the CNAME. Points to that CNAME record will change the TTL to 600 seconds. Okay? And so we have to do, and then we're going to click Verify connection. Okay, now let's say we're going to check your domain connection. It's gonna take up to 48 hours to check the details because we set our TCR that 600 seconds and won't take more than 10 minutes, but we'll track and domain they obsess anyway. And here we go. Nomadic. Caleb is the primary domain. Kayla just a blog, redirects to medicare.com and we have roofing San Marcos.com as an example. That's also going to redirect him a nomadic Caleb.com. And let's check if nomadic Caleb is now live. So it is the site is live. Anybody in the world can go to the Medicare.com and see this website. It's pretty awesome, right? So building, our site hasn't been launched. If you build your website and you're at this point now's the time to send out the link to all your friends and family posted on social media talking about it, start driving traffic, create forum posts, write blogs. Now's the time to go 210 miles per hour and really push your website as a foundational piece of your business. So congratulations, your website is live. 36. Set Up Google Analytics: In this video, I'm going to show you how to connect your website to Google Analytics so you can accurately track how many visitors you're getting to your website, what they're doing? Well pages they're visiting. It's very important to have accurate information about how people are using your website so that you can improve it consistently. So from that it looks dashboard. On left-hand side, got a marketing and SEO. And then under the marketing subheading, you'll see marketing integrations. Click there. And you can integrate a few different marketing services, like Facebook pixel, which would be the Facebook ads or Google ads. Now we're going to connect our Google Analytics. So we're going to click Connect. It's going to give you these instructions as you can follow. But I'm going to add just visually show you how to do it. So I'm going to click Connect Google Analytics, and it's going to ask you for your Google Analytics ID. There'll be in one of two formats, so it'll be UA, I'll these numbers or G, all these numbers and letters. So if you go into Google Analytics, you might see something like this. If you have created a Google Analytics account before. If you haven't go to analytics to google.com and set up a new account. Once you've done that and you've come back, go to admin. There's a little gear icon at the bottom. And then under property in the middle here. Click create property. And we're going to create a new Google Analytics for property. And we'll name this one nomadic. Caleb will set the reporting time zone to be central time. And then in advanced options, we're also going to create a universal Analytics bracketing. I'll put in the website URL as dramatic, touch Caleb.com. And then click Next and you need to ask you some information about your business. I'm going to say that my businesses, people in society, small business. And this is how we intend to use Google Analytics. So once we create that, it'll give us this information. The piece that we need is the measurement ID. So if you click this button, you can copy it or you can highlight it and copy it. And then we're gonna go back to our Dashboard and paste that in. And you click Save. That's it. We're connected to that Analytics. So that's all we have to do to connect our websites to Google Analytics. Once we've done that, we can go back to analytics. And after awhile, obviously we're not going to see information yet here because we just set this up. But come back after a week or so and you'll be able to see how many users were getting, how many of those users are brand new, how long they're spending on the website. How many are there right now? You can find, so you see all kinds of great information. And now a lot of this information is also available in Wix is Analytic Suite, which if you remember, it was in on the left-hand side, analytics and reports. But generally, I've seen in a lot of other people have seen the Google Analytics is lot more accurate than give you a lot more detailed information. And you can dig into the analytics data and a lot more detail. So I would recommend using Google Analytics when possible. Okay, so that's it. That's all I have to do to set up Google Analytics on your website. 37. Congratulations! What's Next?: Congratulations. You've put in the word and you're now fully capable of creating website all by yourself without any help from scratch. That's no easy feat, really, most people can't do it. You should feel very proud of yourself. Like any other skill you web design abilities will improve with practice. Keep working on your own website or see if you can build some sites for free or pretty cheap for friends and family. From what I've seen, training people usually takes five to ten websites before you really feel comfortable with your abilities and can start to charge real money for your projects. Now if you plan to just keep working on your own website, then keep iteratively improving, looking at other websites to try and get new ideas and see what you can do to make you upset better. Ask other people to see things that you can't. I'll be releasing more courses on web design, digital marketing, and running a creative studio in the future. Thank you so much for watching my course and for trusting me as your teacher. Keep practicing, keep learning. And it will show other best. Have fun designing. And I'll see you next time. 38. Extra - Check Your Analytics: In this quick little video, I'm gonna show you how to check your website analytics from the w6 dashboard. So Nomex dashboard, you can see some quick analytics right here. It says cite sessions, post views, total cells. This will look different because you can customize this. And so if we click customize, we can answer in stats. Maybe we want to see the number of unique visitors. Maybe you want to see the bounce rate. You can see descriptions of what all these things mean right here. So let's go ahead and save that. So we've got some more information here, but we want to see all of our analytics altogether at once. So do that, let's go to analytics and reports and check out our Traffic Analytics. Here's where we can see all of our analytics for this website. Now obviously this is a dummy website, so there's not a lot of great information in here, but hopefully you can still learn from this. So getting into the w6 dashboard, analytics reports and the traffic. And here we can see your side sessions are unique visitors. So if the number of individuals that came, nothing that a times that they might have used it. So if you had seven people who each came twice, you'd have 14 sites sessions, but only seven unique visitors. How long they were on the website, two seconds. Hopefully people are on your website for longer and you can see the traffic source by session. So direct Google, all these things depending on where your, your traffic's coming from, this look totally different. Incident number of new versus returning visitors. You can see the sessions by device. And this is an important section right here because it tells you how much you need to focus on optimizing your site for mobile. Now obviously all websites should be optimized for mobile, but it, most of you are traveling from mobile and you really need to focus on It's really all you need to worry about is making sure you have an awesome mobile experience. Into the top pages by sessions so you can see which pages people are visiting. And then in this section you can see sessions by country. This is important if you're a business that only cells in one locale. If you're getting a ton of traffic from China or India or from Russia, she can only sell to people in the United States. Maybe you have a problem. Maybe there's something wrong with your search engine optimization or maybe something right that people are finding you internationally. But nonetheless, maybe you need to expand your markets to China or to Russia. That's where people are visiting your site from. Okay, So you can also adjust the time period up here. So if you want, just want to see like what's happened on the site today, you can click the Share button. And then all these, all these numbers will change to be relevant just for that one day. We don't have enough traffic for that day. And you can also get floors reports. So you can see sales reports, traffic reports, your store reports, blog. So let's look at our traffic over time. It'll take you to a screen that looks like this. And you can see a nice line chart detailing that information, how much fat we're getting over time. So this is great, especially if you're a web designer because you can provide these reports to your clients when they ask about your site or if you perform a SEO services for them, you might ask whether tracks looking like or what pages are being visited the most. You can come into reports and be able to provide them a nice little report like this. Okay, So that's it. It's super easy to check on your analytics and see how your site's don't just go to analytics and then had to traffic. And you'll be able to see that information and make better decisions about how to use your website. See in the next video. 39. Extra - Check Your Site Speed: Let's check on your site performance. It's so important to have a fast loading website. The faster your site loads, the better the experiences for your client, more likely they're going to become a customer. And the better your website's going to do in search engines. Because search engines do care about how quickly your site loads. This has an effect on SEL. Let's go ahead and check on our site speed. From the dashboard. You can click into analytics and reports. And then under performance analysis, you can see site speed. It's going to tell you how fast your site's loading and ways we can optimize them. Here we can see our sites, TTI, time do interactive. And this is just how fast, how quickly people can interact with us. Once they click a link or put in your URL to the side. But down here we actually can't see useful information. And this is pulled from Google PageSpeed Insights, which is this website developers like google.com slash speed PageSpeed Insights. Just search Google PageSpeed Insights. I know find that it looks like the square root of a 100. So it looks like our sites actually not performing very well speed wise on mobile and desktop. Now websites because there is so much software involved and it's not just pure code. The way a custom coded set would be usually don't perform as well as custom code side, as long as that sets cola, but this is still not that great. So we would want to look into why this speeds low. We might have too many images or images might be too large. Or maybe we have too many animations. There's something going on at slowing down our side a little bit. And so we would want to look into that. We can see here on our speed index on mobile and singing 11 seconds. That's way too long. And let's see if we can just test it again and see if we get that same result. Okay, so we ran the test again, and it looks like our desktop score is a little bit about our mobiles the same. So what we want to brainstorm ways that we could improve this page speed. Maybe we will remove some animations. We could compress some images. We could try just in general to make the site a little bit lighter. Let's take a look. So we have two high-quality images right here. Maybe we could remove one of these images, remove the animation. We have a pop-up and that probably takes a second. So maybe we can do something about the pop-up. We can remove all these custom backgrounds that are definitely slowing things down. There's a lot of living things we can do to speed our setup. But there's always a balancing act. Do you want to have a beautiful custom design side or do you want to have a really fast side? What's more important for your user? What's more important for your business? You're going to make that judgment call. It's actually pretty easy to check on your site speed and your set performance from the dashboard. The trick is you need to figure out how to get these numbers up to improve your website and improve the user experience for your clients without turning your website into LV mass. So help that help you find out how to check on your site performance from the looks dashboard. And I'll see you in the next video. 40. Extra - Email Marketing: So in this video, we're going to create our first email marketing campaign. Evil marketing is a fantastic tool. It's an proven to have one of the highest returns on investment of all marketing forms. And the great part about it is it's free. I have to do is design the email you, I think it costs is your time and your energy, but it's going to cost you any money. So if it doesn't work, no big deal and if it does work, get a fantastic ROI on what really only takes you 10 and 20 minutes. So let's put together our first Enoch campaign. So in the w6 dashboard, from the main menu, we can go to marketing and SEO and then email marketing, which brings us here. And so it says drive traffic to your site with email campaigns, Scott's information. So we want to click the blue button, create your first e-mail. It's gonna take a straight into the Whigs designer. And it's gonna give us some little helpful tips. Start designing a campaign. We're just going to skip all this stuff because I'm going to explain it all to you. So super easy to create your email newsletter I have to do is drag these elements. And so maybe we want two columns right below this big picture. And then we have some options. We could do a picture and text to pictures with text and a button, just two pictures. Let's leave it like that for now. So that's how we could drag in an element. Also, on the left-hand side, we have themes which are just quick designs for your e-mail newsletter. So I can click on this, see it change the font, change the background. Click on this one. We can customize those stuff ourselves. But just maybe to make it a little faster, we'll start with our next. Okay, so our background is this. So we can choose a color, or a pattern or an image. So let's upload our own image by clicking this. Plus. Let's try this travel pattern that we'll use in some of elements and the front end go, that looks better. And so let's just customize this and say something like announcing our new Thailand travel guide. So we can just switch out the text for this image for somebody in Thailand. Thailand. And switch this one out as well for a picture of the travel guide. Then say, we get switched on the button to be by now. For the URL, we would have a unique URL. Sell our product, maybe it's Thailand travel. So we're gonna apply that. Get rid of these extra things or remove elements at we're not using your customers information at the bottom. So our contact information links to share on social media and link to our site. So by default, the site link would be created automatically. The other stuff you need to fill out yourself, so the address and the phone number. Once you have email looking the way you want, you can click preview and test to see what it's gonna look like. Okay, so this loop you're going to see in their email inbox, you think that looks good enough. Let's go back to editing. And we can add the recipients to people who actually want to send. As your site grows, you'll have more labels, more audiences you can send to. So for example, eventually, you can have groups for people who have subscribed to the forum. People who subscribe to different e-mail, newsletter, sign-up forms, people who purchase a product from you. Obviously this is a fake site, so we don't have a ton, so let's just send it to myself. Okay. So now only one person who's getting the CMA newsletter. Hopefully when you're sitting in your newsletters, you sitting at a hundreds and thousands of people. Okay, so then the next step, we could do a Next button and we can create a subject line. Actually think announcing our new Thailand travel guide is just fine as the subject line. And let's add a dynamic value. Then emit values of i 0 is going to change based on who you're sending it to. So you can click add a dynamic value and add somebody is firstName, for example. Now we can say, hey, Caleb, we're announcing a new tile and travel guide. And the idea is that more personalized custom subject lines like this are more likely to choose attention and get them to open an e-mail. In my experience, often it does work. That not everybody loves it though, but it does get people to open your email. So we'll change the name to pneumatic and Caleb, reply to e-mail, Kayla peritoneum. And then we could send a test e-mail, scheduled a post. We can send a test e-mail, scheduled email, or send it now. So it's in a test e-mail to ourselves. Do myself. So we can check that out. All right, Here we are in my email inbox. And please ignore how many unread emails I have. I don't even know what those 80, 95 bar is fun. So this is what our newsletter looks like in somebody's actual inbox. And that's a 100 trout Pilot Travel Guide. Here's our picture, our travel guide, our text of length 2 by now. So it's good. That's going to work. So just that easy to put together. A email newsletter or any kind of e-mail blast to send out to your growing audience for your website. So back in the w6 dashboard, we can actually schedule these. So what I like to do in my own business is put together and multiple email newsletters all at one time. Following the idea batching, which is to do similar work all at the same time, save time. So I like to put together three or four newsletters at one time and then schedule now over the next couple of weeks or months. I think that's just the easiest way to do it. You get into kind of a flow. You're pumping out email newsletters and then you're done for the next month. I feel blog posts too, by the way. So we can sketch this out. Maybe want to send it out next Tuesday at 1230 PM or people are on their lunch break. Apparently, people are more likely to open promotional emails over lunch. So Tuesday at 1238, I think it's a great time. Send out our newsletter. Okay, so we could actually schedule I campaign now. But just be aware that if you do schedule your campaign, you'll need a upgraded wakes send marketing plan. It's up to you whether you want to get that. I think it's helpful because there are a lot of great features and Lex is a sin marketing plan. If you don't get it, no big deal, you can just send them at the time that you're ready to send them. So you just get into weeks on email marketing platform at 1238 when you want to send it and send it like that, you can still create these as drafts, okay, It's still saved. So if we go back to my marketing, will see this right here. Or even campaign is in draft, ready for us to send when we are ready to go. By the way, the free plan, you are limited to three campaigns a month. Most people don't want to get more than three emails a month from you anyway though. So I really don't think that should be a hindrance to you or be a deciding factor in whether or not you get a wigs ascend marketing plan. Great, so that's it. That's all it takes to create email blast and email newsletters and Wix and super easy and super fast, you should really be able to make these in five or ten minutes. And if you really want to put in some town and make it look incredible, maybe 20 or 30 minutes. But this is a really easy way to get business to stay in contact with your customers and your clients. And I highly recommend everybody use e-mail marketing as part of their digital marketing strategy. Let me know if you have any questions. Leave a comment and I'll see you in the next video. 41. Extra - Importing Contacts into Wix: In this video, I'm gonna show you how to import your e-mail list or your contact list in your wax dashboard so that you can send email blasts to those contexts. It's really easy. I'll show you how in just a couple minutes. So from the books dashboard, you can go to contacts, and that'll bring you to the contact list. This is part of your free CRM, is where all your contact information is going to be. So you can see your name, address, and repurchases told spent last activity, you can customize this view, but we're not gonna get too much into this right now. I'm just going to show you how to import those contacts. So there's two ways to add contacts to your week CRM so that you can send them emails and other things like that. You can either click the blue New Contact button and just do it manually one-by-one, which would take forever. Especially if you have a longer list, you have one to 10 thousand people in your email subscriber database. It's going to take a really long time. So what I recommend is you click More Actions and then import contacts. So when you click that, it gives you two options. You could import all of your Gmail account contacts, which could make sense if you do a lot of one-to-one emailing with people in your business and you wanted to as blast everybody that cima with on a regular basis. I want. The other way to do it is just upload a CSV. That's the way I didn't. It's really easy. All you have to do is click the blue Get Started button, download their sample CSV. And so it's put this on a desktop. And usually that's going to look like It's a simple CSV with just a few data columns. We've got first name, last name, e-mail, phone, address, city, country company, every color, which would be a custom, custom field. We're gonna go out and just delete the favorite color custom field. And all of these columns mapped to a field in the Whigs CRM. And so how that works is when you go through here and you try to upload it, we'll grab this will upload that CSU they just gave us just to show, show how this works. We'll create markers subscribers because we want to send emails to these people. And then we need to match the CSV columns two fields within weeks. You'll have to give it a second to load. And then this screen pops up and this is where you match your field titles to the Whigs contact fields. So since this is a CSV from legs that super-easy mismatched field titled to contact. Everything's right. And then we'll click Next. And then we can label those contacts will develop on label. So say that was an emo less from our old website, for example, we could put all website or we could put something like farmers market event, July 2020 and 2021 if that's where we collected those e-mails. So let's just remove all this. Let's say farmer's market event. No click Import. Okay, So the input was completed, five new contacts are imported. They've all have this label far as market event July 2021. So we click Done and I'll take us back to the contact list where we can see all those people uploaded here. Now, when we go into our email marketing tool. So marketing, SEO, email marketing. And we want to send an email campaign. Let's say we want to send this one that we worked on earlier. We can jump through here, get to add recipients. And then we can send, send our email newsletter to those people who are labeled with that specific label that we just set up when we imported our contexts. So we can send a email just so those farmers market event contacts. And maybe we're sending it. We could send an email that says, Hey, thank you so much for signing up for our newsletter at this event. It was great. I hope to see you at the next event that's like this, that next farmer's market. And so we can start targeting or human newsletters more specifically. Now, I'm not going to actually send this because those aren't real people. But I think you can see how useful it is to be able to label your contacts and how easy it is to import your contacts from the CSV. And remember, all you need to do is grab this template CSV that works suppliers for you. And then format your customer data into these, into this template. So under these columns, It's just that easy. In just a couple minutes, you can import your contacts from an old website or from an event, or from wherever you can put them all in here it looks website and start singing them, you know, marketing campaigns and manage them in three weeks. Theorem. Okay, so that's it for importing contacts, and I'll see you in the next video. Thank you very much. 42. Extra - Wix Automations: Today we're gonna talk about Wix automations. Automations are awesome. They're going to save you a ton of time. So basically it looks automations automate simple tasks that you would otherwise do repetitively in the course of managing your website. So we can find the looks on animations in the w6 dashboard and or CRM tools, and then automations. And let me just show you a few examples of automations that wicks suggests. Just by default. They're all app-based. All your books automations will, will run up the apps that you have. And when I say apps, I mean things like your work store, your Wix blog, we will explore them, that kind of thing. And so right off the bat, which says suggesting a lot of very helpful automations for us. Things like recovering are abandoned carts. So when somebody has a few products in their cart and they leave the site, we can e-mail them in and see if we can get them to finish the checkout process. We could do things like send a thank you note. When somebody submits a form, you could automatically follow up with somebody after a week and check and see how they're doing. Maybe if you're selling a course, you could send an email link layer that says, Hey, how's the course going? Can I help you with anything? These other automations are things that I use myself with my invoicing. So it's things like if somebody is overdue on an invoice, you automatically e-mailed them to follow up with them. That'll save you a ton of time chasing that invoices, which is really unpleasant part of client work. You can set it up to automatically remind yourself or your clients to follow up on an invoice for a quote, you can set tasks. Hopefully you can see how much time and effort you can save and how much boring work you can eliminate by setting up works on emissions. So let's check out a couple of these that are already made for us. The most useful one that I see right off the bat is this one, visitors to recover abandoned carts. So let's click the blue uses Automation button. You'll come to this screen, which is basically an if then automation builder. And so when I say If Then, what I mean is there'll be a trigger. So if somebody abandons a cart, then do this semi-metal contexts. And these can get much longer than than what they are now you can create an entire email sequence where maybe you send them for e-mails and if they respond you this and if they don't respond, you do that. So you can make very complicated automations. But let's focus on the basic simple automations right now. So like I said, if it's an if then statement, and so we have a trigger, an action, and timing. So this is a basic animation. So for this one to recover abandoned carts or trigger is when somebody abandons of carbon. So if you open up this box by clicking this little blue arrow, you can see that it says to create an autoimmune response where she's an app. And that's what I was talking about earlier when I said that these are app-based. So we would select the Wix App and then we can select the trigger for the SAP, customer makes a purchase or customer abandons the card. Now what if we wanted to do something based on the w6 forms? Then there's different triggers available. Like whenever a visitor submits a form. Now maybe you can see that if you had a lot of different forums that were for different purposes, you can send people different items. So maybe that sounds really confusing, right? So what I mean is if you had a page on your website that said sign up for our newsletter and get a free Thailand travel guide. You can send them automatically send them a travel guide. And I have another one. Maybe you have another form that says sign up for our newsletter and get a free Japan Travel Guide. And you can have magnets in them, that travel guide. And then after that point, you could send them a series of emails relevant to their interests. So a series of emails about talent or about Japan. And you can do all of this within the Wix automation tool here. Okay, so let's go back and finish creating our email sequence for abandoned cards. So when a customer abandons of current, then we have an option to do this. So we could send an email to contexts, which is what we're planning on doing. We're going to send them an email and say, Hey, you forgot something or carbon. We could get notified by email so they notify us. We create a task to maybe follow up with them. We connect a web hooks or to Zapier, which would be essentially to create automation that uses other software outside of weeks. We can move a card and a workflow, which is on our task management board. We could add labels, assigned badges at data to Google Sheets. So we're going to send the email to contexts. And then if we keep going, we can see that we can customize center details. So this is your information. So I would want it to be something like nomadic Caleb. Caleb, at nomadic Caleb.com. Okay. And then we can create the email that we would be saying to them. Now, in another video, I'll show you how to design and create email newsletters. But for now, let's just preview and test this. So this is what our email is going to look like when it sends to our automated this, what are you going to look like when it sends two people who depend on their card and let's say we notice you've got something in your cart and image will be there of the product or the product name and price. And when they click resume your order, it'll take them right back to checkout. Hopefully you can see how helpful this can be. In statistics show that this will help you increase your sales by 20 to 30 percent. Because go back to setup. And we're just going to leave this in as is. Okay. Let's set a timer. I think two hours after the purchase is pretty quick. Maybe let's switch it to two days. I think two hours there might still be shopping and they've just gone somewhere else. Did is went out for lunch or something. So I think today's makes little more sense. And then we could add follow-up actions so we can make our automations longer. Had a premium magazine marketing plan. We don't right now. And for the purposes of this video, I don't think we need to make multi-step automations. But you could by clicking the add follow-up action. Okay, so let's go ahead and activate this automation. That's it. So now our automation is active. You can see that with the free use and plan, we can get, we have up to two free automations. And you'll see how often, how many times this automation has been triggered right here. So let's go back to our automations. And let's also create this automation send thank you email to visitors that submit a form. And these pre-made Wix automations are super easy to use. You can see they've already got the triggers and actions that we need and scheduled, scheduling ready to go. So all we need to do is click Activate. And here's what that email is going to look like. Thanks for getting in touch. So to activate that one. And now our website is working for us all the time. In another way, not only is it potentially selling products or services for us even while they sleep, but now it's also e-mailing visitors about Encarta emails and thank you e-mails. We don't have to click anything. We don't have to contact anybody or website and automations do the work for us. So looks on animations are awesome. They're going to save you a ton of time. They're gonna make your life easier and they're going to make your clients very happy because they're going to get service quickly. Nobody will fall through the cracks, you won't miss anybody. And their needs are going to be that. That's it for this video and I'll see you in the next one. Thank you. 43. Extra - Set Your Social Share Image: Alright, in this video, I'm gonna show you in about two minutes how to change your social share image. This is the image that shows when you link to your website on Facebook or anywhere else, or you text to link to your friends or a customer. It's the image that shows up when you send somebody a link to the website. It's really easy to change. Let's check it out. So on the left-hand side and click Pages. Then next to any of your menu items, you can click the three dots and then go to social share. This menu pops up and you can see right here, how are we going to upload an image and it gives you a preview of what it looks like when you share your link, the link to your website. So let's upload an image. And we can just use any of these. Let's grab the stock image. And how about this one at the guy taking a picture? And so these are going to be unique for every page. So we can set this for each page. So for example, maybe you want on your video social share image. You want it to be a picture of somebody taking a video, stuff like that. That's all you have to do to set your social share image super easy. And I hope that helped See you next video. 44. Extra - Wix Photo Editor: In this video, we're going to check out the Wix photo editor still on your dashboard. Under media. You can scroll down here and I'll say photo studio. You could also click directly on a photo. Did you get here? You click Photo Studio, and then you can either upload it from your computer or select from your site files. So the photo studio is going to allow you to edit photos and all kinds of different ways. You can either use Adobe Lightroom or your computer's built-in photo editor. It's similar to that. It's got a few handy features. Let's upload this image real quick. We can crop it. And we want that square for Instagram post or something like that. And feature that I use very frequently is the cutoff Vg. And you click here, it's going to cut out the main subject of the image. That's really works best if there's high contrast between the subject and the background. Let's check this out. Did a pretty good job. There's a couple of pieces we could clean up using the refined cutout feature. Meatus uses brush and try to brush out the pieces. We don't want like that. Let's restore, say we wanted this piece. If you've ever used Photoshop, this is super similar. You can restore it or I said apply. So you have this little cut out. And we can also do little enhancements. We can auto enhance. And Wix will take its best guess on improving the image. You can adjust it manually using all of the standard photo editing settings like brightness contrast, highlights, shadows, color, saturation. You can apply filters. So like Instagram filters, if you're familiar with those, then you can even turn it into a little graphic by adding text and backgrounds and that kind of thing. I'd say we probably made this picture much more boring. But you get the idea. You can save it. And now you have this image to use. Again, drag it onto our page. Right? This custom edited images, It's almost like you have a little Photoshop will read into X. So that's the photo editor. Hope that helped. 45. Extra - Wix Video Maker: The Wix video maker is as easy to use as the Whigs photo editor. You can get there in two ways. So on the front end you can click the photo icon for media and go to video maker. Or in the dashboard, you can go on the left-hand menu to marketing and SEO, and then scroll down to video maker. Here you can see they have a few different templates that you can use to get started announcing a sale, promoting some kind of milestone. Or you can just create one from scratch. So we're going to walk through that real quick. They have different aspect ratios. Square for something like Instagram, landscape might be for you to portrait for an Instagram story. So if we click created a video, there'll be this little tutorial video that pops up and we're going to customize our video. Let's get rid of the placeholder videos. And I cut down five videos for us to use for this. And what order do we want them then? Maybe something like this. Okay. Now, let's remove the texts That's endless at our own text. Travel. Okay, now we can add a video style. Let's see, let's choose which one do we like? Maybe nano style colors. We're going to hold those for now. Music. We can just look through a few of these and see what we like. So we'll grab this one. Can't get enough of this. This impose going to show up at the end of the video. And now we can preview your video. It's going to take a psycho. Alright, everybody is writing the check it out. Yeah, so not bad for literally a minute of work. Now, with Wix is a sin plan. You can only pay for for free. You have to upgrade your ascend a marketing plan to get more on the professional planning and create ten a month, unlimited. You can get 15 days per month. I wouldn't expect you to make all that money, not at least as you start your business. So in click, save and share, and share it on social media. You can upload it directly to YouTube very quickly and easily share it on Facebook, download the file, upload someone else like video, like Vimeo. So x makes it really easy to create it. A video for you, for your business very quickly and share it wherever you'd like. And that's it. That's everything to the Whigs video maker. It's super-easy to use, play around with it and have some fun. And let me, let me see some of the videos you make. Thanks.