Google Sites hacks you've NEVER heard of!

[Music] well hello there welcome back to my channel it is of course chelsea of she designs things and in today's quick video i'm going to be sharing with you my tips and tricks to making your google site well better so of course if you'd like to know more then stay tuned all right so the very first tip i'm going to share with you is to utilize lottie files and if you've never heard of lottie before lottie files are basically like gifs but less heavy if that's a word so it's one of those things where it's easier for me to show you rather than tell you so here i have this bird animation and instead of you know uploading it like an image you actually upload its html so in here we're just going to click on html and then the biggest thing you want to do when you're using a google site is to remove the width and height requirement so that you don't get that ugly stupid box square looking thing that comes on the side like an iframe so we're just going to delete those and then you can decide if you want to show controls or if you don't i'm not going to show controls because i want this to look like the animation is integrated into the website and then of course all you'll have to do is copy the code and paste it in your google site so this is a google site that i'm working on and only thing i'm going to do is double double make a copy of this section and then delete this one double click and click on the embed icon and when it says embed code paste the lottie file code and then insert and there you have it now i have this really cool bird that's like 80s drinking out of a cup all right let's see what he looks like obviously on a mobile device so this is what's really cool about lottie files is they're really responsive and they resize appropriately as you can see and much bigger so they're they're clearer they're easier to see and with the requirements inside of your google site you can't have an animation be larger than 47.68 mega pixels megabytes geez megabytes so this is an alternative and they have hundreds of animations for you to choose from my next tip is to utilize google fonts to create icons which i know seems a little strange because it's like what kind of icons well all of these are icons that are a part of google font google has created a font that's called noto emoji i think it's noto emerging it could be something completely different it could be no to emoji but i'm going to go with nodo because it sounds better so here is nodosan symbols 2. you actually can't use all of the font all of the symbols here in your google site because it's not included just yet however noto emojis are and what's great about them is they look more like icons than emojis and that really comes in handy when you want to have something that has more of an effect like stars or you know something kind of groovy like like this if you want to have a star you can actually have a star hand icons and not that goofy looking emoji stuff this is actually egyptian hieroglyph which is a different style of actual font but it really makes a difference on your google site like you can have the e instead of using like importing an image to create your envelope for your email like a whole bunch of different icons that you can create just by using fonts and if you want to know how to get to these fonts all you have to do is say you want to create a piece of text um so double click wherever you want to have a piece of text and then right where it says uh space wherever your font icon is but usually for me i'm always set to one font which would be space mono and then add the font and then you want to search for nodo emoji and that's the one that i have installed because like i said the other one isn't available just yet so if i tried to find noto sends symbols it actually doesn't come up yet but it makes it less of a process when you use icons instead of well font icons instead of bringing in an image or png because those image and pngs you do need to have alt characters for and you don't have to do that when you're using emojis so my next tip is to use the table of contents inside of your google site to create sections this is especially helpful if you have a single page web design and you want people to be able to navigate that single page more quickly so you can create it almost like a menu and then when people want to navigate to that section they can just click on the table of contents so for example i have this one pager web design right here for a therapist and if i wanted to check out their treatment section i would simply click on the treatment and then if you wanted to see something like their location just navigate quickly to the location just click on the location and so on and so forth now i will say this when you're using these sorts of sections um you will have an option to have like all of this here and let me actually change my theme real quick you'll have the option to have all of the subheadings and headers that you have show up so all you have to do is hide them in order for it to show more cleanly which then it will appear like this so especially on a mobile device this is super helpful but when it's in preview mode you can't actually click on the sections so i noticed i know you guys probably noticed that i have a ton of custom themes along the side and this just makes it easier for me to create templates for people and change the color scheme really quickly and i highly suggest this if you're one of those people who want to change the style of your google site but don't want to have to constantly be making changes and constant it gets tedious after a while what's cool about doing it this way though is say for example this was your business and you were changing just for the season every season you wanted to have a new look or new style so to change the the theme all you'll have to do is select that theme and your colors all the selections that you have will change with it now obviously these are images in their white so that won't work until i change the color of the section but you're also able to do this by using google's themes that they have which some aren't bad some are some are pat some are pretty bad but some aren't bad like level i don't really like because it adds a white box behind everything um and this one's a bit bold but you're you're able to use the themes that are created inside of google if you so choose to but just keep in mind they're a bit loud for for me now i want to show you something because i do have the menu portion up and this is something that you should probably create and this is probably going to be my second to last tip on the google sites and that is of course not the landing page portion of it but hiding your pages so by hiding your web pages you're able to create a separate menu so what i mean by a separate menu is i'm going to click on this one here let me change the theme to one of the themes that i have there we have it so if you hide your page menus you can create your own menu such as this one and i'll show you what it looks like and how it operates and i'll probably leave a link down below so that you can actually view and play around with this this version of this uh the therapist google site template that i have so if you wanted to click on the different uh pages you're able to do so without having your menu be here here here and then it also still looks really great in a mobile device as you can see so you have a plenty of options when it comes to changing the way your google site looks you just have to think outside of the box my last tip which is going to be combined with two other tips actually is to start actually paying attention to your fonts it is imperative that you pay attention to your fonts most of the time when someone tells me my website looks bad it is their font and it is their colors they don't understand font pairings and their colors are awful so the best way to do that is to just actually go to google fonts if you go to fonts.google.com and i'll actually leave a link down below so that you can get to these um noto emojis which make great icons again but like that that's really awesome um but if you go to your fonts.google.com these are pretty much all the fonts that you can get inside of google now i have a bunch of stuff highlighted obviously because i have a ton of things in there but as you can see this is a really cool font and this would look great on say your google site and sometimes you'll find them here and sometimes you you know you might not be able to find it just yet inside of your google site but what i like to do is to create a page just a regular regular regular google site and place the fonts in that google site so as you can see right here i have the same text repeated but using different uh fonts because i wanted to get an idea for what i wanted it to look like so this one here is uh elise and then this one is is it elise or elsie i think it's elise i'm gonna go with lc oh ie i need my glasses so this is elsie with the swash on it so if you look all the highlighted all the capital letters have this characteristic style to them and then you also have this one here and of course everybody know well actually i don't think anyone's ever seen this one too much this one here so you just have to start actually going through one by one in all of the fonts and then you'll be able to find really cool ones like that so most of the time like i said it's your fonts that make your google site look like crap and then onto your footer make sure and this is just a trick of mine whenever you're creating a footer for your google site that you create two sections for it it makes it easier when you are looking at it in say a mobile view for you to have like your logo and then also include your pages um any sort of affiliations you may have and i have this newsletter here let me make this clear i know y'all seeing this and thinking something's changed we can have newsletters if you haven't seen my other videos and you you're very new here welcome uh no you still have to have something to connect it to now granted you could literally take just html here and put it in apps script and actually create a newsletter in apps script but i'm not gonna i'm not showing that that's gonna take forever but i use flowdesk for my google site um it's just easier so if you use flodes mailchimp i'll probably make a video on like mailchimp how to you know create one in there um anything to that nature you're you can pretty much you know add that stuff in here if you need it too all right so i do hope this video was helpful please let me know if you have any comments if there's anything you would like me to show a tutorial on with the exception of this because i ain't i would rather just give you the dang on code because it links to absolutely nothing so it's just a marker of what you can do what's possible or even how to do this it is time consuming but yeah if you have any comments questions concerns or you want to learn how to do something of course leave it down below and as always see ya

Channel: She Designs Things

Views: 118,915

Keywords: website, web site, build web site, build website, google sites, google, workspace, wordpress, wix, squarespace, godaddy, theme, top tips for google sites, google sites tips and tricks, google sites advanced tutorial, how to use google sites, how to make google sites look good, how to make google sites pretty, how to make google sites look professional, google sites templates canva, how to make google sites look nice, google sites tutorial, new google sites, google sites tips

Id: jP19tT1JI1Q

Length: 14min 10sec (850 seconds)

Published: Fri Jul 15 2022