When you want to build a simple, free website, it can be tricky to find the right builder. Some only let you have one page, while others make you dig around menus to figure out how to use them. What if you just want to drag and drop some text and images in a decent-looking layout?
As usual, Google has your answer: Google Sites.
What is Google Sites?
Turn forms and surveys into business growth
Google Sites is Google’s website builder. When you pit Google Sites vs. WordPress or another advanced website builder, it won’t really stack up—it has way fewer features. But it still has what you need to create a blog, portfolio, business site, or company intranet. It’s also simple enough for non-business users to create websites for their families, friends, and classrooms.
In fact, you can get pretty polished with Google Sites. Site Builder Report shares some professional-looking Google Sites examples, like the site for Dr. Xu Chu’s petrology group:
Is Google Sites free?
Yes! You can build a Google Site at zero cost. Plus, since it doesn’t have pricing tiers, you get all of its features for free.
How to use Google Sites
Go to sites.google.com and choose one of the options at the top to start a new site: use a template, or start from scratch. You can switch to Google Sites’ classic editor at the bottom-left of this page, but this tutorial will explain how to use the new editor.
Since my cats need to improve their online presence, I’ll make a website for them as an example. As you build yours, use the preview option in the top-right menu to see what your website will look like on different devices.
Create a header
Every new Google Sites page starts with a premade header. At the top-left of that header, you’ll find a field that says Enter site name. The name you enter here will appear on your website, but you can give your site a private name on the main Google Sites page where you go to edit your sites.
When you hover your mouse over the site name, you’ll have the option to add a logo that appears to the left of the name. It comes up small, so use a simple and clear image.
Go to the lower-left of the header section to edit your header. Select an image to use as your background, then choose from four header types: cover, large banner, banner, or title only. The first three options present your background image in various sizes, while the last only uses header text.
The lower-right corner of the section has options to adjust the image for better header readability and lets you choose where to anchor (center) your image. There’s no set Google Sites header size. Instead, it takes your image and adjusts it to different resolutions based on where you anchor it. I suggest using the highest resolution you can, then checking how your header looks on different devices using the preview option.
After you decide on your banner size and background image, work on the header text. Click on it to edit its style, size, font, and alignment. Drag the dots at the top of the text box to move the box left or right (but not up or down). Or delete it if you don’t want any text.
Want to add an image on top of your header image? Double-click anywhere on the banner, then use the circle menu to add from a URL, your Google Drive, or your computer. You can also use the menu’s middle button to add extra text boxes.
Choose a theme
Click the Themes tab at the top of the menu on the right to modify your site’s design. Each theme has a few preset color schemes and fonts.
Looking for more control? Click the + icon under the Custom category to make your own theme that Google Sites will save for later. You can modify fonts and colors to your heart’s content.
Add text and media
Time to dig into Google Sites’ website building elements. Click the Insert tab in the right bar to add the following elements to your site:
-
Basic elements: The top section of the Insert menu lets you insert a text box or images, embed HTML code, or add Google Drive files. You can also access these options through the circle menu by double-clicking anywhere on your site-in-progress.
-
Content blocks: These premade blocks of text and images save you time on adding individual elements and arranging them.
-
Collapsible group: A collapsible group consists of a header with collapsible text lines underneath. You can change any combo of header and body text into a collapsible group by clicking the Collapsible toggle that appears when you click on their text boxes.
-
Table of contents: Google Sites’ tables of contents automatically generate links that jump to different sections of your website using text from each section. You can remove items but can’t add them.
-
Image carousels: Add two or more images to an image carousel that you can navigate using the dots below it, or have it automatically cycle through the pictures.
-
Buttons: Create a link button that draws its font and colors from your theme.
-
Dividers: Google Sites creates simple dividers with a design based on your chosen theme.
-
Placeholders: A placeholder section holds space for an image, YouTube video, Google Calendar, or Google Map.
Just like the header text, any text box you add through these elements has options to change its format and size. Click the three dots on the right end of the editing bar to edit line spacing, add an indent, or create code-style formatting. The keyboard shortcuts you use in Google Docs to edit text also work in Google Sites.
Incorporate Google elements
It wouldn’t be Google if it didn’t integrate well with other Google apps, and sure enough, Google Sites lets you add content from other Google tools through the Insert menu. Each Google-related option will take you to a menu to find the file or interactive element you want to share. Choose from these options:
-
YouTube: Embed a playable YouTube video into your website.
-
Calendar: Share your calendar in weekly, monthly, and agenda views.
-
Map: Insert an interactive Google Map of the address you choose.
-
Docs, Slides, Sheets, and Charts: Add a Google file in View mode to your page.
-
Forms: Display a Google Form that visitors can fill out on your site.
Insert a Google Sites contact form
Google Sites doesn’t have a native contact form option. Instead, you have two options to insert one from an outside source:
-
Google Forms: Make a contact form in Google Forms, then use Google Sites’ Insert or circle menu to add it.
-
Embed code from a third-party app: Check if your favorite booking app or form app has an embed code option, then use the Insert or circle menu’s Embed option.
Arrange columns and sections
Rearrange your elements at any time by clicking and dragging the dots at the top of each one. New elements appear at the bottom of the page, and you can drag them next to existing elements to create columns.
Tip: To keep your images in their original aspect ratio, drag a corner to start resizing them, then press your Shift key to resize with the same ratio.
You can move single elements to the left or right, but you can’t change their vertical position within a section. For example, I can’t line up these headings with the center of each image:
Click and drag the dots on the left of the section to move it. There, you’ll also find options to change its background color, duplicate it, or delete it. Switch up your section background colors to add emphasis and break up visuals.
Add and manage pages
Finished with your first page? Add more from the Pages tab in the right menu. Go to the + icon at the bottom of the menu to add a new page. This button also lets you add an outside link or a menu category to your header menu.
Move page names around on the Pages menu to change their order in your website’s menu. Drag a page under another page or a menu category to make it a subpage. On your site menu, a subpage appears as a dropdown menu item below its parent page or category.
Click the three dots next to a page name to make it your homepage, duplicate it, add a subpage, hide it from the menu, or delete it.
Tip: If you want to copy something from one page to another, select that part of your site, press command + C or Ctrl + C, then paste it onto the new page.
Publish and collaborate
Now it’s time to share your hard work. Click the Publish button at the top-right of the screen. As you publish, you can set the end of your custom URL. You can also hide your website from Google results if you want to keep it private.
After you publish, you can visit your site at sites.google.com/view/yourwebaddress, as you can see under the Web address bar in the picture above.
In the future, hit Publish whenever you make changes to your site and you’re ready to share them publicly. Whenever you re-publish a site, Google Sites will show you the differences between your new edits and the currently published site.
In classic Google fashion, you can also share your site with others and set them as editors or viewers. Click the person icon in the upper-right menu to add people and set their permissions.
If you have multiple folks working on your website, you can check its version history by clicking the three dots in the upper-right menu and going to Version history. This option works similarly to Google Docs’ version history feature, letting you check old versions and roll back your site.
Congrats on building a website! Here’s how mine turned out.
Frequently asked questions
Can I have a custom domain in Google Sites?
Yes. You can set up a Google Sites custom URL through the Settings > Custom domains option. This feature lets you hook up a domain through Google Domains or a third party.
If you plan on using your Google Site for professional purposes, a custom domain will give it extra polish. Plus, it’s pretty cheap to get one—about $15 a year.
Does Google Sites have widgets?
Google Sites doesn’t have widgets outside of its Google apps options, but you can add any outside option with an embed code. Look for an Embed or < > option for the widget. The Embed feature in Google Sites can only use HTML code.
Not into it? Try a different free website builder
If Google Sites is the first free website builder you’ve tried, give others a shot to see what features you prefer. Zapier’s picks for the best free website builders include some pretty feature-packed options if the simplicity of Google Sites isn’t what you’re looking for.
This article was originally published in March 2018 by Matthew Guay.
Need Any Technology Assistance? Call Pursho @ 0731-6725516
