Hello,

Sign up to join our community!

Welcome Back,

Please sign in to your account!

Forgot Password,

Lost your password? Please enter your email address. You will receive a link and will create a new password via email.

Sorry, you do not have permission to ask a question, You must login to ask a question.

Please briefly explain why you feel this question should be reported.

Please briefly explain why you feel this answer should be reported.

Please briefly explain why you feel this user should be reported.

Home Latest Topics

  • 6k
  • 6k
Kevin Stratvert

How to Create a Website with Wix – Tutorial for Beginners

video
play-rounded-fill

Hey everyone, Michael here. Today, we’re going to build a professional looking website for your business. We’re going to start with the basics of having nothing at all, and by the end, we’re going to have a fully functional website ready to go. We are going to add product listings, business hours, and locations. It’s going to look beautiful because we’re using Wix, which is one of the best web builders out there, and we’ll show you how to do this step by step and you can follow along. When I worked at Google Domains, we saw a lot of customers choosing Wix because of its competitive pricing and its ease of use. Let’s go check it out. Here we are on the Wix homepage. You can get here by clicking in the top right-hand card or down below in the description. Feel free to follow along. At the end of this, you’ll have a fully functional website. It’s completely free and no credit card is required. Next, I’m going to hit get started. Once you’ve logged in, they’re going to ask you who you are creating this website for, and since I’m creating it for my business at the Kevin Cookie Company, I will select this, then continue. Next, Wix is going to ask us what type of website we want to create. I’m going to see if they have something available for Cookie Shop and they do. So, I will select that and continue. Because I’ve selected Cookie Shop as the type of business, I want to build a website for, Wix has provided me with a lot of beautiful designs to choose from. You can go down here and load even more templates if you like. It’s important to note if you choose one of these templates, you can’t change the template later. You can customize a lot of the different elements of the template, such as text and images, but you are actually beholden to the template. I don’t want to choose one of these templates yet, so I’m going to go ahead and skip so we can work on building from a completely blank template later. Next, Wix will ask us to fill in a website name. You can change this at any time, but we are going to put in the Kevin Cookie Company, and you can see it populate here where it’ll show up on your website. And we like the way that looks, so we’re going to hit continue. One of the great things about Wix is they allow you to add apps to your website. You can add things like your Instagram feed, or you can set up an online store to sell any kind of physical goods or products. You can also even put up a portfolio of your work if you’re an artist or a photographer, but I’m just looking to make a pretty basic website right now, so I am going to uncheck these and then I’ll click go to dashboard. Next, we land on an area that Wix calls the dashboard. This is like the control center for your entire website. We can also see how far we are in the website building process. It says one out of four steps completed. Also, it says it here. We see that we’ve already completed one of these steps, which is to update the type of site we’re using, and the second step is to connect a custom domain. You can either buy a website domain from Wix or connect one that you already own. You don’t need to connect a domain that you own or buy one, you just would be running off of a Wix domain that they provide for you, which may not look as professional as you would like it to. On the left side, we also have an array of advanced options like contacts and analytics and reporting. Contacts is where you can add other team members to help you build and maintain the website, and analytics and reporting can help you see how many visitors you’ve had to your site and what the site load speeds are like. I don’t want to deal with any of those right now, and it’s also important to note that you can skip around through these steps. I just want to go directly to the part where we get our site designed, so I will click design site. Here Wix gives us two ways that we can design our website. They can either help me build one, or they will allow me to choose a template that they have customized to what I’ve said earlier, but it does sound like having them build a site for me will be a little easier, so I’m going to choose that and click get started. Next Wix wants us to add a little more information about our business, such as our email address and address. We can also add a logo, and I want to do this because I know that it will show up later on our website. Now that I’ve filled everything in, I’ll click on next in the bottom right. Before we get to see what our website is actually going to look like, we need to help Wix with some building blocks to do so, and they give us six beautiful options here, wild rose, minimal, retro, humble, things like that. I actually really love the word humble, it speaks to the values of the cookie company, and I like the colors because they remind me of warm butter, so I’m going to go ahead and choose that one, and then click next. Next is where the magic starts to happen. Wix provides us with three designs we can choose from for our cookie website. Because we said earlier, we are a cookie website, they’ve pulled in a lot of images of cookies. They’ve also gone ahead and used the humble color scheme we selected with the light yellowish color and the purple. We really like the one on the left because it just really appeals to me, all the cookies laid out like that and talking about what we bake. So, I’m going to select this one and click next. Next Wix asks us if we want to add any pages to our website. I think I want to add a couple, I’ll start with about us, I think that one is important. I don’t have catering services; I’ll ignore that one for now. You can always come back and add pages later if you want to, so you don’t have to get married to whatever you’re choosing right now. Our team, I love it, there’s nothing more narcissistic than a business that talks about itself. I’ll do that one as well and then I will click next down below at the bottom. Congratulations, your site is up and running just like we talked about in the beginning of the video. It required no coding. You can go and look at it right now if you want, but I still have a couple things I want to do to make it my own, like add some sections and change text. So, to do that I’ll go to the editor. Next Wix will drop you into something they call the editor that has a preview of your beautiful website here in the middle. This is the area where you can edit text and you can change out the images or even move sections around if you’d like or change the layout. And boy there are a lot of delicious looking cookies, might be break time for me. Also, on the left side of the screen you have a lot of icons such as add apps, site design, and add elements. You don’t have to know what all of those are right now, but we will go over some of those in just a little bit. For now, though I think I’m going to want to start by editing the text on the home page. To edit the text, we see here you just double click, and it’ll zoom you into 100% and then you will have to double click again to highlight all of the text. And I noticed that the text that we have right here isn’t fitting neatly onto the page. We have this errant you just sitting down at the bottom. So, I want to change that font size. I’m going to scroll that down to about 62, but I also want to change the text itself because this isn’t the message that we want to have at the Kevin Cookie Company. So, I’m going to say deliciousness in every bite. Then I’m going to try some different fonts as well. You know I actually think Avenir Light would be good. Yeah, that looks nice. And I’m going to italicize it. And once I’ve chosen what I like I can just click out and then zoom out again to see if it looks good. Yeah, that looks pretty good so I will keep that. I see below that the image in the hero carousel is of macaroon cookies and while they are delicious, they are not the ones that built this billion-dollar business, so, I will go ahead and change these. So first I’ll have to zoom in because that’s how you edit things and text and images in Wix. I’ll click on the image which brings up a little menu that says change images which is exactly what I want to do. I’ll click on that. I can see here all of the images that are contained within our carousel. We can replace any of these images with our own. You can add more images at any time you like if you’d like to have a huge carousel. I just want to reorder these. Let’s see there’s a chocolate chip here. That’s the really profitable one. I will move that to the front and move the macaroon to the back. I like the order here. I will just click done in the bottom right and take a look at it. It does look quite appetizing. I’m going to zoom out see how that looks on the page. I think this represents our cookie company much better. Matches the image of our logo above. I think I’ll stick with this. I’m going to zoom in one more time just to show you the additional controls you have with images. Once you zoom in and then after you click on the image it will bring up a new little toolbar here. Previously we clicked on change images. This time I want to use the gear icon to change some of the settings. You can see some of the advanced settings that you can use in here. Additionally, we have this design paintbrush logo. You can click this, and it will allow you to change out of the slider setup you currently have for your photos. You can change it to a grid, or you can change it to a different kind of slider. Anything you’d like really. It’s also cool that with Wix any element can be edited so if you have text or video, and you double click on it when you’re zoomed in you will get a similar style toolbar where you can customize anything you’d like to. From this area you can also drag the photo up or down and reposition it if you’d like but I’m actually pretty happy with it so I’m just going to leave it as is. Now that we’ve tweaked our site a little bit and made edits to the images and text, I want to zoom out to show you what sections are. Each website is made up of sections. Here we have our welcome section, our product section, and contact us, and opening hours. Whenever you hover over a section, you’ll notice on the right side there’s a toolbar that appears. This allows you to move sections up or down so if I want to move the contact us section up here, I can do that. I can also use the quick edit button to make quick changes where I can change the background colors, things like that and I can also change the layout of the section if I want. I’ll click add section and once that opens up, you’ll see a whole menu of different types of sections you can add. So, a contact section which has information to get in contact with you, a welcome section, things like that. I’m going to add a video so I know I’m going to use the basic form because it’s blank and I can add the video easiest to a blank area. To do that I will grab this and drag and drop it to the part of my website where I want to put it. I think I’ll put it near the top so that people can really get in the vibe of getting into cookies. Now that we’ve added a basic section to our website where we’re going to add our video, I wanted to talk briefly about elements because our video itself is going to be an element and sections are like containers that hold different kinds of elements. You can always add elements from the top left-hand part of the screen. Anything can be an element really like text, images, buttons, strips, lots of different things are considered elements by Wix. We want to do a video so we’re going to go over here and select YouTube and this bam puts in a nice YouTube video for us. We just have to change the address which we will do next. By the address I mean the URL address of our YouTube video where the commercial is hosted. Just like earlier with our image controls, you’ll note that the video also has the same customizable controls. You can click in them for more advanced options. All I want to do right now is change the video even though this one looks very nice. I want our cookie video to be put in here so I will change the URL, post in ours and there it is. Now that I’ve changed out our video to the cookie commercial, I’m going to move this down by dragging and dropping it, give it a little more space and then I want to add a new element up here. I’m going to add some text, so I’ll go over to the top left, go to the element area, choose some themed text and I’m going to apply heading 2. That looks good. I’ll put it right here, oh it started down there. I want to move it up and I’m going to type in made from the best ingredients. I feel like that’s a little large and kind of overbearing. It doesn’t work well so I’m going to highlight this and go back to the top right here under the text settings and change the theme to something smaller like heading 5. That looks much better. I’m going to stick with this. Now that we’ve added everything I want like the ingredients and the video, I’m going to zoom out just to see how things look. Actually, that looks pretty good so far. The only thing I think I might want is to add a social section down here because we do have quite a following so I think I’ll do that next and add an element. I’m going to add the social element to the footer at the very bottom and the footer is a special thing because it appears on every single page. I’m going to go up to elements again and I’m going to click and find social and here what’s really cool that they do is that Wix allows you to drag an entire social bar down to the bottom, so you don’t actually have to add them company by company. It allows you to center it with a nice purple line again. I let go and there it is. And just like with every other element within the Wix design editor, the social bar has a nice little area where you can customize things. If you click on set social links, you can put in the address to all of your different social media accounts. If you don’t have any of these for your particular business, you can remove them or you can choose to rearrange how they appear in the social bar. Once you’ve done that, you could go down to the bottom and click done. Just like you can add elements and sections, you can also delete them. I have been getting a lot of grief from my boss Kevin here at the Kevin Cookie Company about the negative feedback we’ve been receiving from customers. So, I’m going to delete the contact us section. You can do that by the menu or if you’re getting really advanced, you can use the hotkeys. And now you can see the section is gone. Next, I’m going to zoom out and scroll to the very top of our site. Here we can see different areas that are called pages. We have home, about us, and our team. I feel like those are a little light. You can actually scroll up to the left here and click into them to see where they are. Here we have the about us page. We want to add a page for FAQ because we’ve been getting a lot of questions from customers, and we just like to have them resolved right here on our website. I’m going to use the pages and menu area, the icon here, and I’m going to click into that so that we can add a new page. To add a new page, I’m just going to click this blue add page icon, and here you can see that Wix provides us a lot of easy and ready to go page templates that we can use, but I just want to have a blank page. Next, I’m going to change the name of my page to FAQ. I can also rearrange these any way I want. I can put it up here, or actually I want it at the very end here, or I can put it under as a sub menu, and if you change it, you will also notice it moves around up here. So again, if I move this under the home area, the FAQ will move over here. I can also, if I don’t like it, I can click into the three ellipses or three dots and then scroll all the way to the bottom and hit delete. I can also duplicate it if I want to have multiple kinds of the same page. For now, I think this looks pretty good. Again, I’m going to move FAQ to the back and then I am going to close out. For my FAQ page, I don’t just want static text that stays the same for as long as the website is in existence. And Wix has devised something that’s pretty cool. They have these things called apps, which act like widgets that you can put on your site, and they actually have one for FAQs and they also have it for a bunch of other things like payments. You can even have a full-fledged store. This is their app store where you can come in and you can choose apps to add to your site. I’m going to look for an FAQ app and see what they have. I see that they have one provided by them. I’m going to click on that, and it says right there, add to site. It’s free to install. They’re not going to charge me anything to do so, so I’ll click it. And now it’s added my FAQs app or module, if you want to call it that, and it offers a more dynamic experience than just the standard text. And you can actually manage all of that in this dashboard area they have. You can set up which questions are answered and what order you want them to appear. Now that we have our FAQ section added to the website, there are just two more icons I want to call out from the left-hand toolbar here. They are site design. This one’s important because it allows you to change the look and feel of your website. You can change the background colors and the fonts as well as page transitions. Second, there is the media icon, which allows you to upload Google photos or any kind of images from your Instagram as well as logos you might want to upload yourself. You could also buy images from Wix. They provide free images, but they also sell images through partnerships such as Shutterstock. I feel like I’m done making changes to the website. It’s in a pretty good place. I want to go ahead and take a look at what other people will be seeing. I want to preview this, so I’m going to scroll up here and click on the preview button. Once you’ve hit preview, Wix does a really smart thing and shows you two ways to look at it. You can look at it as if you are on a desktop computer, which obviously means laptop or desktop with a monitor as well as on a mobile device. So, this is what it looks like on a desktop right now, but I’m still on the FAQ page. I’d like to see what the homepage looks like, so I’m going to click home. This actually looks really nice. The images are loading. We have our social bar. The hours are there. I really like the way this has turned out. I also want to see what it looks like on a mobile device, so I’ll go up here and click this tiny little phone icon and just like that it pops up with what it will look like on an iPhone or Android device. The other really cool thing is they provide you with a unique QR code that you could actually hold your phone up and take a picture of so you can see it in your hand on your phone. I think our site looks really professional. I think it’s ready to be published so everyone can see it. I’m going to do the really big task here, the one we’ve all been working towards, and I’m going to hit the publish button. Hey, look at that. Your site is live. It’s up and running. You’ll notice you have a Wix URL here. We’re going to go ahead and click view site. There’s a banner up at the top for Wix, but everything looks really nice and professional. If you don’t want this banner up at the top or the Wix URL, you can upgrade to a different type of plan, so let’s go to the dashboard and take a look at how we can do that. Here we are back in the Wix dashboard area. You can see we’re on the free plan, which gives us our Wix website address. If you want to have your own custom address or you want to get rid of that banner that was at the top of your site, you can feel free to upgrade to one of their various business plans at any point, but there’s no pressure to do so. And there you have it. We’ve built and baked a new website for the Kevin Cookie Company. I hope it drives a lot smore orders and really butters up our gross margin. All right, that was bad, but for more videos like this one, please consider liking and subscribing, and we will see you in the next one.

Related Topics

You must login to add an answer.

Hide picture