today I want to show you how to build a website using Google sites for free and then I want to show you how you can set it up with your own custom domain [Music] name hi I'm Jamie and welcome to teachers Tech as I mentioned we're going to be building a Google site from scratch here today in fact we're going to be building this Google site it's called Pooch house it's a mock website for spa services to dogs you can see that we added different things things like galleries Google forms in it and even added a few different videos you'll see how easy it is to create a website using Google sites and at the end of this I'm going to show you how to purchase a domain and set up your Google site to have that custom domain let's get started today on how to build a website with Google sites you will need a Google account to create a Google site you can see up top I'm already logged into my Google account just with a demo account completely free but this tutorial work if you're following along with a work or school account I'm going to go to the app launcher here and I'm going to go to Google Drve this is where I like to start my Google sites from I'm going to go to my drive and I like to create a folder first to keep everything organized so I'm going to go ahead and just go new and we're going to create a new folder and we'll call this uh demo website just like that and I'm going to go ahead and hit create inside of this demo website this is where I'm going to create my Google site to keep things organized now I showed you under the new you can go this way or you can just rightclick and you'll get the same thing but to get to Google sites you can go to more and there it is right there Google sites so I'm going to click on Google sites and it's going to open up and I'm ready to start with my website the other thing I want to point out to you a shortcut to your creating your Google sites is if if I have a new tab open like this and I just type sites. new and hit enter it will automatically create a site for me as well since I'm already logged in but the organization Factor uh won't be the same so I'm going to close out of this one and we're going to start with creating our website here let's start by giving this website a name and I'm going to make a pretend website for a dog spa and we're going to call this Pooch house so I'm just going to go ahead and type Pooch house in this is going to be the name the other thing I'm going to do right now this is what the file is called inside where it's going to be in Google Drve and I'm going to call this the same thing Pooch house and it comes up at this point also and it will automatically change uh save as we go along now we're in the header here I want to point out we can change our header type so if I click on so since I'm clicked in here if I go to header type right now I'm under large but if if I pick cover you can see how it changes to Banner to title if I go and we'll stick to large Banner here for a moment if I want to go back I'm just going to click in the middle again I can upload an image or select if I go to select I can go to search images through here I could go to my Google Drve I could uh go to Google images and do a search I'm going to upload in this case so if I go upload I just need to find where this is going to be so on my desktop I have something called Google sites images and I'm going to upload this header image I'm going to click open so this is going to be my background now it adjust so this down here remove the re readability adjustments so if I click on it it will remove this it made the background image a little darker so I could see the pooch house the other thing I want to point out is that you can uh choose a theme right from the get-go um so I've just typed in it but if we look over to the right hand side we have themes over here and I'm under simple and I can click on different colors and right now you won't see very much but if I click on this one you see how the fonts change automatically Diplomat how it changes and so you can pick uh which one you would like and then you can change the color type as well you can see how that changes I'm going to go back to simple but I can always change it um I can let change it at a later Point as well let's go ahead and add a logo and a favicon now and to do this I'm just going to move up top and hover over this top and notice we have ADD logo I'm going to click on it and then you'll notice that we can upload a logo and a favicon I'll explain what that is in a moment but I'm going to go and click upload I have this that I'm going to use for my logo right here and click Open Notice right away uh it picks up the colors from that logo and it will ask do I want to use this as a theme so if I click on the orange now over on the side it's chosen that color and that will be uh the theme that we'll be using throughout the other thing that we can do is upload a favicon a favicon will appear up here so see this is the Google site symbol right here the favon will replace this so I'm going to go upload and I'm just going to use the same one for now um I'm going to click open so this will be my favicon I'm going to close out if here and I want to point out I have my Google Drve tab open if I go back you can see this is being saved inside of my Google Drve and has the updated name as well so let's go see how this could look as a website right now so we can preview it but we can also publish it when I preview it I can go up here so no one knows this website's out there yet but if I click preview this will show me what it's looking like you can see the logo up here the favon doesn't appear yet because I don't have this site published but look down below if I want to look what it looks like on a mobile I can click it and it gives me the idea as uh what it will look like on a tablet I can click on and back to the computer screen I'm going to close out of this now publishing is a bit different it's up here um I'm going to click publish and it's going to give me a name so this is the site that you're going to see this at here so if you were sharing this site with somebody this is what you would uh give them I am going to show you later on how to get your own www custom name that you can add to this uh you can also add who can manage the site so if you are collaborating with anybody you can click manage and add people here and they can help you create this I'm going to go ahead and just click publish now and once I do that it's live so if I share that site people will be able to see this if I go back up to publish here we're going to go to we can go back to our publish settings uh I'm going to go to view publish site so this is what it looks like online so if someone else saw it this is what they would see notice this is the favicon up here this where it's orange right here it replaced that Google sites if I wanted to go back and edit again I can click edit uh this page or I could just close out and I'm going to go back uh to it as well let's go add some text to our first page and to do this first of all I'm going to change my header type make it a little bit smaller to Banner now now this is where I want to add some text and notice I don't have a text box yet I can go on the side click text box up here or if I want to put images or I can just double click and it brings me to the same uh parts so I'm going to go and click on text it creates a text box for me so if I go ahead and type this in so this is my intro on my first page spoiler spoil yourp at Pooch house and so this is some uh information easy to use notice uh that as I go through I can change the size of this text box here so if I wanted it over here as I hover over top of it I can also move it to wherever I would like in here and it snaps to those lines here so you'd find somewhere that you'd want it and change the size the text box to match and it just adapts easily I'm going to just stretch this out here a bit more inside as soon as I click in this if I was going to highlight my text I can quickly make some changes so if I was going to use something like a table of cont Contents I could put titles and headings and subheadings uh I can change the font in a hurry so if I wanted it to be a different one uh you can go ahead and play with that at any time you can use the back arrow to undo things as well so undo last action or use the shortcut contrl Z and it will go back those steps if I want it a little larger I can make a change to my font and we have the other ones like buold metallic underline I would stay away from underline a lot of times cuz people will think it's a link so if it's it's a link yes you want it underline but if you underline it people try to click on it and we have our text color that we can highlight something and change the color uh to it just like that but I'm going to go contrl Z again so I'm going to move this over here so if I change the size of this and then click on this size here this over here maybe I want to put an image so this is where I could click picture and I'm going to go and just choose this one this one's in my Google Drve so I could go and click insert when we insert images they drag just like the text so I can uh move them to where I want and I can even size just by grabbing the handle of it so you can see how it stretches out we can go ahead and crop any image so with crop if I wanted to focus just on uh one point this will zoom up here so if I was just looking at the eyes I can move it around in here as soon as I hit the check mark then it's cropped I can do the duplic if I needed the same picture and I can also remove it you have a few different options uh here if you wanted to just replace this with a different image because this will hold the exact space spot and you don't want to move it around you can go ahead and put another image in this spot so if I was going to go grab uh this one right here and hit open it just replaces the image there the other thing we can do in any of this is to link things so we can link to external or even inter internal so let's do an external so notice we have our insert link and I'll use this as an example so if we wanted to link it to this site right here I could grab I could WR I could copy that or contrl C and I could go to the link and I could paste it in so I can apply it at this point so now you can see that there's a link if I click on it it will bring me to that and you can see there's just a redirect on that page set up by them so if I go back any word I could anything I highlight I get the same option so as soon as I highlight anything we have the link over here I could go ahead and insert the link put apply and then this will be the link so this is what I mean about don't underline things because people are going to think it's a link and this will go to the same spot some other changes you can make to a section would be the color background so if I choose this there's different styles so if I click on this this will match the style that I have as part of my site I can also upload images if I wanted that to be the background of a section and you can also delete these sections so if I delete it I want to show you a quick way now using content blocks that you can put things in so the content blocks are here if I go ahead and select this it automatically puts this already to just put a picture and some text so now if I just click this I could upload or select my image or go from drive I'm going to upload and I'm just going to choose this same one and it places it in so what do I want to put for text well let's start with up top here I'm going to say welcome to Pooch house it's a little bit big so I'm just going to go and make this a little bit smaller so it fits across and let's go ahead and add a little bit more text to here and this will just be a little bit about us so we can quickly add this but I want to add something else too so I can go to this content these content blocks again and I'm going to choose this one right here so I'm going to click on this and with adds some new uh places that I can quickly add some information so let's go add some pictures so I'm going to upload quickly to each of these so I want this one here we'll upload this image we'll upload another image here we'll pick this one with the dog and we'll do a testimonial at the end so this will be something maybe a page full of testimonials from uh different people so now I can go ahead and add text to each of these I just quickly went and added some text let's see how everything's looking now so we can preview up top as I showed you before and we can take a look that if it's going to look well on mobile you get an idea how it Scrolls through we can also publish now I want to point out when we publish this time so I'll hit publish I'm going to hit got it so this shows the original here and nobody can see or this shows the original on this side so what's currently published this shows what I'm about to publish nobody can see this information till I publish so you can just check to make sure this is the correct thing so as soon as I click publish now this will be the updated information that people see on my website we can quickly change the order of these sections around if I hover over here see all these dots this is a move handle if I click on my mouse and hold and drag I can change the spot so this becomes the top so you can change these around very quickly to get what you need the other thing I want to point out at the bottom of the page you can add a footer that would be on every page so if I click on this what's the footer I want to add I'm going to add a copy right here so again I can go back and publish this here one more time see my changes hit publish and it's all updated again now it's time to start adding some more pages to this website I'm going to create four new pages I'm going to click on this and you'll notice that I just have one page right now the homepage if I hover over this at the bottom I can go ahead and click and create a new page if you just wanted a link you could use this one right here and then it would be part of the menu but I'm going to go new page and what do I want to call this this is going to be called Services now I have this Services page it uh copied the header everything I had from the first page my logo and even my footer at the bottom it's all ready to add content the next thing that I want to add is an about us one so I'm going to click on this again and this time I'll just type about us and hit done and I also want a gallery to be putting pictures in so I'm going to click new page and we'll put gallery and done and I'm going to add one more but this time it's going to be a little different I'm going to go to the services and add a sub page so these uh little dots right here I'm going to click on it and click add sub page because I'm going to have a packages uh one here so I'm going have packages and done and you can see how it's indented and what it means here if I go to the services notice it drops down if I wanted the about us to be at the uh last I can simply drag these around here so if I drag it down it changes it up here on the menu and I can even drag pages into sub so if I just bring it to gallery and under a bit so if I just move it under push it you can see now how that would be a sub page but I don't want it there I just want to drag it down as a page on its own so we have the menu here we can change this in a couple different ways if I go over to the Gear if I hit this there's navigation right now it's on top if I go to side it will place it over here so if I click off this and then show sidebar then it becomes over here where I can navigate different pages you can also change the color so it's under transparent and I like the transparent but if you wanted it let's say uh black uh like this now the bar comes out and it's black through here uh so you can change it for both of those on it I'm going to go back to a top one and I'm going to keep it transparent let's navigate to the gall let's navigate to The Gallery page to add an image Carousel so clicking on gallery brings me to this I'm going to add right here but first of all I want to add some text I'm just going to double click Text and give it some a little bit of text just to say what's happening on this page this is where I want the gallery I'm going to go to insert and take a look at all the different things that I can place uh onto a page from uh YouTube videos to Social Links to calendars I'm not going to go give put them all in today but I'll do a few of them so let's do image Carousel I'm going to click on ADD image upload image I have a number of different pictures I want to upload I can hit open it shows me the different ones that got uploaded I can delete them or remove the image I'm going to click on insert and then we get our image Carousel I can move it around I can size it I can grab the handles if I want it larger and I'll Center It Center it just like this so now what does it look like let's just do a preview so if I click the preview right now I'm in Mobile I can click through the gallery on the different images that I have on this one I can check what it looks like in large screen and continue on remember if you you like what you have and you want to share it right away hit your publish I went over to the about us page and I put a little text and an image just like I showed you before I'm just going to Simply change the style just to change up the color in the background a little bit I want to add some videos down here to do that I'm going to go to insert we can do this in a couple different ways well YouTube is one of them and I talked about that for a moment but if I click YouTube here uh what's the link let's say I go to I could do a search or if I found the the YouTube video I could take a video from here and do a search with the actual Link in here to get specific if I click on this one and click insert here we have it inside our website uh just like all the other things I've showed you you can simply drag it around you can size this as well another way you might want to add a video is through Google Drve so if I double click you'll notice that we can get to drive here or we can get to drive over here so if I click from drive and and I have some uh information or some files inside the practice one and here is a video so if I click on this I can click on insert so this will play from my Google Drve so this is important when things are taken from your Google drive it has to have the permissions in order to for people to see it uh if you don't give them that permission there'll just be a blank spot on here so I want to make sure when I put this in it's coming from my Google Drve allow anyone with the link to have access and I just want them to have viewer this goes to any file so if I was putting a PDF or Google Docs or or slides I would have to make sure I give that access of anyone so then I can hit share and it automatically takes care of it at that stage so I can go through and size just like I did before uh so now I have a couple different videos on here let's go ahead and hit publish again and let's go take a look at what we have now in our publish site we'll go to view publish site and here is our two videos in here so if I hit play it this will play from right in here and this will play in here this is a very short one we have the information let's go check out our Gallery here we have our Gallery it's coming along quite nicely I can go back to home I'm on the services page just typed out a little information added a few pictures I want to point out a couple different things you could add now let's go ahead and add a divider line between here and what I'm about to add so if I go to insert you'll see that we have divider if I just click it it just gives this line here kind of like a separation now the next thing what I want to add down here let's say I want a Google form for so a place that they could book their appointment on so I can collect their information I can add that from my Google Drve now I've already made the Google form just a simple one to show you it's living in my practice folder here so now when I go back to here I'm just going to double click go to my from Google Drve it's in the practice folder and now it's going to be this one so I'm going to click on it click insert and now I have this Google form that I can place in if I want to preview what it looks like how it gets used if I go back to preview you'll see now as I go down that I can click in here a person could fill out this information tell me what they want and hit submit so you'd have that built in right on your website another thing you might want to add and I'm going to go to the footer to do this so it's on every page you might want to have your Social Links so maybe Instagram or Tik Tok or YouTube so if I go down here to the I'll go down to the bottom again here notice that we have Social Links so I can go ahead and add an image so I'm just going to go upload and I have a Instagram logo I'll place this one in and I'm going to place this one just a YouTube just just to give a demo here now YouTube I could just go get a link and I know I'm not going to anywhere directly I can go and paste my information in here we'll go and to instagram. com and I'll place the information here so once I have that set up I'll click insert so notice it went right here I'm going to move it right here over here to the end to get it in line and let's go ahead and preview this again how it looks so we have our Google form what I showed you and now at the very bottom and this is a little bit of the way but I have these little links that would be on every page so if I go to home and here are there's my Instagram and YouTube ones that I placed in so if I go to phone and see how it looks like and I'll go down the very bottom here's my Social Links that when I click on them it will go to that page so if I like everything I'm going to hit publish again and have it all up to date just by couple clicks by now you should have a good understanding of how to create a Google site with multiple Pages putting in images videos text and taking advantage of these quick things that you can just insert I didn't go through all of these but they are just a simple click and add in just like how I've showed you the thing I want to point out now is how you can save time using a template if I go to the top leftand Corner the sites home page and click sites home this is where this is where this one right now Pooch house is living that's the one website I have for this one I want to point out that we have a template gallery now that you understand how to create a website this is a great way uh to go from now I've showed you uh with the different themes how you to apply them but these are different ones that are already created and all you have to do is change it so for example if I click on this one here uh it's going to go ahead and create a copy so here we go that we have and it has all the pages built into it here so you could go and use something like this and just update the text update the images through it you can see how they have their social media at the bottom so this is definitely a way to create a Google site in a hurry another thing to take advantage of with Google is to add collaborators or share this with other people if it's a business and you want other people to help you out in creating this go up to here share with others just click on it you're just going to add the people's names in here so if I want to add people I could just click on it and then give them the access then once they're logged in with their own email they'll be able to make changes the other thing I want to point out if you want to quickly grab the link of your site so right now it's still at sites.
gooogle if I click on this copy this I can send that link to somebody an email and then they're going to see my published site but now I want to show you how you can go ahead and use a www so take a look at this if I go up to settings here and I've showed you a few different things in here with navigation and brand uh you can go to custom domains here and you can make it uh be a www your own domain so I would go ahead and click Start setup now you need to have a domain I just moved over to GoDaddy logged into my account I typed in Pooch house here uh unfortunately Pooch house. com is already taken I don't know who would have taken that already but you can see they're giving me a lots of different options here so I'm going to choose this one right here this poochh house. com I'm going to select it I'm going to make it mine uh so I have a Go Daddy account uh it's pretty easy to go through and add it so if everything uh looks good I can go ahead and check out here so I'm going to go to the cart and continue to cart and I'm just going to go purchase this this domain and then I'm going to show you how to set this up I have my poochh house.
com all purchased here I'm going to jump back to my Google site I am going to have to do some changes over here but Google sites walks you through it so let's jump over here so now I have a domain and I'll just put it right in here so it's www poo house. com I have to make sure I verify the ownership here so when I click on this it's going to tell me what to do so I have the domain here www. po house.
com I'm going to click continue so it's going to check for verification so it's going to tell me to do the instructions of how I do this let's go ahead and start verification so now I have to connect with my Go Daddy so I'm going to get logged in here once I log in it tells me to connect it's verifying this might take a few minutes ownership is verified you can see this only took a few minutes to get this all verified I'm just back over here under setup custom domain at my Google site now that I have this verified I can go next this is some changes I have to make inside I got to go back to go Daddy and make some changes with my DNS settings so I'm just going to follow this through step by step so I'm going to go to my DNS settings and create a new C name under that c name value or alist I'm going to call it www so if I go back over to this page right here and I'm going to go and go to the domain and the next thing I want to do is uh manage my DNS so I'm in my DNS records and I just want to point out down at the very bottom there's this txt record this is what they put into verified I own the domain I could have went through and added this but that was just a faster way uh when I can connect directly to GoDaddy and it they did it for me now they're telling me to add a new C name entry and I already have this one right here they they want me to use www I'm actually going to go and edit this one instead I could actually go ahead and delete this uh if I want to because I'm going enter the same one but if I hit edit rather than it just going to this Pooch house. com uh under the value I'm going to have it go to this ghs Google hosted. com uh because I wouldn't be able to put two of these wwws at the same time so so I could delete this and then add this back or just make this edit so I'm just going to go ahead and hit save on this and this will update my records and you can see it says success that it's been updated now I'm just back on my Google sites here's all the things I just did I'm going to click done and now you can see I have a connected domain Pooch hen house.
com I got a new window open here let's give this a try I'm going to type in w W ww so we're going to put in Pooch house.
