How to Make a Website with Google Sites (Beginner Tutorial)

Ready to create a free website with Google Sites? In this video, Scot Friesen guides you through everything you need to know to get started. From choosing a template to customizing your theme and adding pages, he'll show you how to build a professional-looking Google Site with ease. He'll also cover setting up a custom domain to make your site more memorable. Whether you're a Google Sites beginner or just need a quick walkthrough, this video has you covered.

Video Transcript

- Are you ready to create a free website with Google sites or perhaps you just need a refresher? Either way? In this video, I'm going to show you everything you need to know to get started with Google Sites. Now, first things first, how do we get to Google sites? Well, you can either do a search for Google Sites or go to sites.google.com and you'll end up on a screen that looks like this. Now, we can either get started with a completely blank slate, a blank site. Just note that this will probably take a lot of additional work because there's nothing here waiting for us. So I often recommend that we get started with a template. Now, Google will present us with about four or five examples here, but I recommend clicking on the template gallery where you can see all of the options available to us. In this case, I am going to use one of these. I'm going to click on this one called Salon, and this will open up our brand new site with the template items included. Now, don't worry, we can replace anything here, all of the text, all of the images we can delete and remove, and of course add other elements as well. But at least this gives us a framework. So to get started, I'd recommend that you give your new site a name. In this example, I'm just going to call this one Scott's Shop, something nice and simple. We can always come back and change this later. Just know that this will also change the name here in the upper left hand corner or wherever the homepage or the title of your website is here. These do not have to be the same, so we can come over here and change this at a later time. Now, the first thing that we're going to want to do is select our theme and also make sure that you're comfortable navigating around your website. So on the right hand side, you can see that there are three main tabs, insert pages, and themes. I'm going to click on themes, and on this tab I can click around on these different thumbnails. So I can click on this one. I can see that the text is maybe a little bit smaller. I can click on this diplomat one, this level, this impression. You've got a number of different ones that you can click on to see what works best for you. I kind of like this one here. It really sort of stands out to me, but that red is not my color. Well, we can continue to customize that down here as well. Maybe I like this green, but that's still not quite my branding color. If we come over here to the right here, we have the option to put in our own hex code, or we can come here and select our own color as well. So maybe I like this blue, but maybe more of a sort of a Navy purplish blue there as well. Lastly, you will notice once you've selected a particular theme at the bottom, there is a font style as well, and you will always have three choices to choose from here. So I'm going to choose Frank. Hmm, not so wild, Frank, narrow, not too bad. Maybe that first one is the best. I'm going to go back to capital and choose that one as well. So if you ever want to go back and forth or try out a new theme, you want to come here to the themes tab. Next up, let's work our way backwards. I'm going to come to pages. This is where you can see all of the pages, which it's already included within our template. This is really helpful because most businesses are going to have these types of pages, services about testimonials and contact, and if I click on any of them, they're going to bring me directly to that particular page. For example, if I go to the contact page, this already has some great boilerplate information here, so I can just change the address here. I can add my operating hours. It's already done a lot of the work for me, but let's get comfortable with moving our pages around. Maybe the contact information is the most important to me, so I don't want it to be last here in my menu. All I need to do is click and drag and I can bring it up and make it second behind my homepage, and maybe I want the About section to be. After that as well, I can click and drag that up as well, so you can rearrange your pages any way that you like. Lastly here, within the pages section, what do we do if we want to remove something or add a new page? Well, you can see here as I hover over any of these pages, I can come over and select the more button. We've got a number of different things that we can choose from here, but that includes the ability to delete that page as well. At the very bottom of the screen, you'll see that there is a plus button. Now, when we hover over it, we've got a number of different options available to us, but the main one that you'll be using is new page. If I select this option here, here I can add a new page. Maybe I want to offer a deals page where I'm going to conclude special offers and bonuses I'm going to collect Done. And now we can see that that deals page has been added. I can now come in here and start editing that information. Now, just before we start editing and editing content, we do want to look at one more place, and that is under our settings. The reason being is that there's some important things here that we want to keep in mind. Let's take a quick look at brand images. And remember, you probably have a logo and you'd like to include that with your website's name. So here, if I come to upload, I'm just going to grab something that's quickly available to me here, and now that logo will appear here within my menu header as well. The other nice thing about uploading your own logo is that you can choose one of the colors here that has been selected and apply it directly to your site. So even though we customize this and selected this blue shade, maybe I want to use this red that's coming directly from logo. Now everything is very much in line here within my website. Lastly, within settings, I want you to make sure that you know where to go to set up your custom domain. Why without a custom domain, your website is going to be something like this, sites.google.com/view/whatever name you would like here, or at least whatever name is available. This may be okay when you are first getting started, but if you want people to take your website seriously, you're going to want to apply a custom domain. And perhaps the easiest place to get your custom domain is at.online domains. Here you can easily search for the domain that you like. So for example, maybe I'm looking for Scott Shop, I'm going to hit search and let's see what comes up. Yes, Scott Shop online is available. Why should you use a.online domain? Well, it's probably going to be very difficult to find a.com address that is still available and.online is your next best option. Not only is it professional, it's memorable and fits with any business, go to www.get.online and use the coupon code SimpliVity to get your custom domain for the first year for just 99 cents. Click the link in the description below to learn more. So now that we've customized our theme, added our pages, and perhaps added a custom domain, we want to come to the insert tab. And this is probably where you'll be spending most of your time because this is where we can add text images, embed other files, or embed other code and add our own content blocks as well. Now remember, anything here on any of your Google site pages is editable. I don't like this tagline. All I need to do is click on here and say, look and feel. Let's say look and feel great. Maybe that's my tagline here. So I can change absolutely anything that I want. Maybe I want this to be a little bit smaller. I'm going to highlight that text and I'm going to reduce it down to maybe size 14. That's maybe a little too small. How about 24, something like that. Anything you see on the screen here, we can also click and drag here. As I click and drag this item, I can move it to the left hand side. To the right hand side. You can see when I've clicked something, it automatically displays a grid format so I can change things the way that I like. And then down below, we can take advantage Photos, for example, I can click on them. I'm going to click on this one a second time. So I'm selecting just the image and not the image plus the title. I'm going to come up here and select more, and I'm going to say replace the image. Now I'm going to choose select, which is automatically going to open up my Google Drive file. And maybe I want my SimpliVity here, so I'm going to select that. I'm going to say insert, and now my own image, my own photo or whatever I've selected is input here. Now, the one thing I really don't like with this template is this all caps text here at the bottom. Now, by selecting it, I could start to edit it, but I'm actually going to use the remove button here and just remove it completely because what I want to make use of is on the right hand side, one of these content blocks a content block is a combination of images and text, and it'll give you a quick preview here of what each of them will look like. This first one here I think makes the most sense with what I'd like to add. So all I need to do is click and drag it. Now you can see I have not let go of my cursor, and you can see that there's a blue image here. Wherever I drop it, that's where it will be located. I do want it to be down here below this set of three images. So now I've got this content block waiting for me. With this content block applied, I can now immediately start to add a new image, just like you saw me do before. I can come in here and start to add it or edit that text and everything will remain or continue with the theme, the font, everything else that we've set up before, earlier. So I can start to edit this text, maybe I'm going to say new specials. I'm going to add some new deals here, and you can see that this text is identical to what we have up above. Everything else falls into place. Of course, I can add other information here as well. Here you can see you've got some of the standard formatting options, including bold and italics. You can choose if you want to center a line or left a line and include things such as bullet points, so you can really edit these sections to your heart's content. Now, down below the content blocks, we have a number of other options available to us as well, including the ability to add an image carousel, to add a divider, to add some other Google integrations, such as integrating directly a slideshow or a form or a calendar, or of course adding a button. And that may be one of the most standard things that you include within your webpages. I'm going to first select the button and I need to give it a name. So maybe I'm going to say something like book. Now I want them to directly go to the contact page when they select this button so they can book an appointment. Now down below we have an option here to either select one of the other pages that we have. In this case, I do want to select that contact page, or we can paste any other link. So for example, do you want to send them to your Calendly appointment scheduler? Well, you could paste that link in here. Do you want to send them to a social media site? You can paste in your social media link here as well. But by clicking into this empty text box here, it will show the other pages on our website. I'm going to select contact, and then I'm going to say insert. And now you can see this book now button has been inserted. Now I don't need to keep it here. I can click and drag it. I can center it here on the screen, but maybe I want to include it here within this new specials area, so I can click and drag it and bring it here as well. So now when people read maybe the description of my new specials or the image here on the left hand side, they can click this book now button and go directly to my contact screen. Now of course, as you continue to build out your website and make changes, you're going to want to make sure that everything is behaving the way that you like. And Google Sites has given us a handy preview button here near the top of the screen. By selecting this option here, we are going to be brought into a live version of our website. So I can click on any of my menu items here at the top of the screen, or I can come down and test that button that we just created. If I select book now, perfect, it's going directly to that contact us screen, but you can also see how your website will look on other devices. Now, by default, it's going to show you in a large screen what we see here, but so many users are using their phones or mobile devices. So here I can click on the phone version and it's going to show me how things will be lined up. We can also view our website in a tablet mode as well. So you may want to come in here from time to time to see if the changes that you are making are being displayed the way you want them to when people are viewing your website on different devices. Once you're done with your preview, simply come down here and select X to exit the preview and you will be returned to your editing window. Lastly, let's make sure that you're ready to share your website with the world. None of the changes that we've made will be live until we come up here and select that publish button. Now to help us out, after selecting the publish button, it's going to show us the differences between the two. So for example, on the right hand side, this is what's currently published, this is what people will currently see. But on the left hand side, you can see that we have the changes that we've applied. This is just one last way that it can help us decide if we want to proceed with publishing and making this change. So I'm going to go ahead and hit publish, and now all of those changes have been made live. But now that your website is published, what link do you share with others? Well, if we come here and select this dropdown arrow beside the publish button and select publish settings here, you will find the web address for your website. So all you need to do is go ahead and copy this link and share it with others. But remember, in order to look and sound professional, - You'll want to use a custom domain. And here's where you can go to manage your settings. Now, if you have any other questions about how to get started with Google sites, be sure to let me know in the comments down below. And remember, being productive does not need to be difficult. In fact, it's very simple.