TCEA 2022 Registration is Now Open

Spiff Up Your Google Sites

(Up Your Google Sites Game

Instructions Site

Table of Contents

Looking for the dimensions ?

Here is a visual for a Favicon and a Logo.

If your website is quite long and you want your user(s) to quickly jump to sections, set up a table of contents.

(See my example to the left)

Steps

Make sure you are at the top of your page
Under Insert, click the Table of Contents
As soon as you use the Headings format in a text box; this will appear in your table of contents section.

You have the option of hiding words when the eye-shaped icon appears, allowing you to customize your table.

Looking for the dimensions ?

All credit is given to Tony Vincent.

Button

Use a button to access a URL or a page within your site.

TCEA

Steps

1. Under Insert, click on button

2. Name your button

3. Copy/Paste your hyperlink

You have a choice of a filled, outlined or text button.

The button will be your theme's check-marked color.

Announcement Banner

Announcement banners let you highlight important information.

Steps

1. On the Google Sites menu bar, click Settings (gear)

2. Slide to turn on Show Banner

3. Choose drop down arrow to select Banner Color

> 24 standard colors or customize your color

4. Under Announcement Message field, enter your text

5. Scroll down to Visibiliity to display banner on home or all pages

6. No publish button, just click the X

Just add text for your announcement and you can also add a button!

Create a Button in the Announcement Banner

1. In field, under Button label, enter your button text

2. Under link, enter hyperlink

3. Also check the box if you wish the link to open in a new tab

(This could be a link to another page or an outside URL)

Image Carousel

Google has provided the Image Carousel to show multiple images in one space.

Check out my Image Carousel of my two rescues, Boo and Tuff. No longer running the wilds of Del Valle, Texas.

The last two pictures show their condition at rescue and Tuff's first haircut, courtesy of Austin Animal Center. Talk about your prime example of The Ugly Duckling.

Steps

Under Insert, select Image Carousel.
Next you will need to add your images.

Click the gray + button

You can either upload or select images

(Must have two or more images)

3. Click dark blue button, Insert

4. Before you go, click on the Settings (gear) for more features

Customize options

Show dots so user can cycle through your images manually

Show captions (Go back to the images, hover over the image and click add text)

auto-start ( starts Image Carousel instantly)

Transition speed will be an option if you select auto-start

speeds: very slow, slow, medium and fast

5. Make sure you click the Update button when you make changes

6. You have the option to resize your image carousel when you are on the Google Site

You can also use the section background as a divider (use small text)

Divider

A divider is a horizontal line. It can be used for visual separation between sections on your Google Site.

Steps

Click on the section of the Google Site where you wish to place the divider
Under Insert, select Divider
From experience, the divider will not always appear where you want it -
1. 1. Try this: Hover over the divider, let your cursor turn into a four arrow icon. Click and drag for correct placement
To delete the divider, hover over the left side of the site, a trash can should pop up, so you can delete this section (divider)

Here is a visual for a Favicon and a Logo.

Favicon

A favicon is the small icon associated with a URL which is displayed on a bookmark list. A favicon helps you locate a website quickly if you are using your bookmark bar.

I used the TCEA Robot for my robotics website.

My professional headshot for my resources website.

Pumpkin clipart for The Boo Breakout

Steps

On the Google Sites menu bar, click Settings (gear)
Click on Brand images
Under Favicon, select or upload an image
You will need to upload your image and then X out
Publish the website
Bookmark the website and you should be able to see the favicon

Sometimes you have to wait a little bit - be patient =0)

Not every image will work with a favicon. Keep in mind that they should typically be small and without too much detail.

Logo

Steps

On the Google Sites menu bar, click Settings (gear)
Click on Brand images
Under Logo, select or upload an image
Should appear instantly

Custom Map

Custom maps can be a nice addition to your Google Site. Perhaps you need to highlight a location for an athletic or academic event. Maybe you want to point out historical locations in your city - a custom map will do the trick.

First, you will need to go to Google Maps to create your custom map before inserting your map in your Google Site

Steps

Go to: https://www.google.com/maps/about/mymaps/
Click on Create a New Map
Click on Untitled Map. Give your map a title/description and click the blue Save button
Click in the Search bar for a location
Click + Add to Map
Now you can change pin color (paint bucket) and icon (popular icons)
Repeat steps 4-6 to add more locations.
Go back to your Google Site and insert your map.
1. Under Insert, select Map
2. Click on My Maps
3. Click the blue button, Insert
4. You have the option to resize your image carousel when you are on the Google Site

Collapsible Text

Get the TCEA Membership That’s Right for You

Since 1980, TCEA has supported educators. We’ve provided resources and strategies to help integrate technology in K-16 education and create opportunities for learning without limits. We can give you the tools you need to reach your goals. Enjoy a year of membership packed with networking, professional development, and career-enhancing opportunities at one of three membership levels:

Regular Membership: $49
Retired Educator Membership: $30
Student Membership: Free

Collapsible text box saves space on your Google Site. Use this feature if you have one or more large bodies of text.

Check out the example above.

Steps

Under Insert, select Collapsible Text

Automatically a heading and normal text box will appear

2. Enter your text in the appropriate places

Now your user will be able to expand and collapse text boxes on command

If you decide later you do not want the collapsible text box, click on the caret and a box will appear on the left side. Slide the button off. In my experience, once you delete the collapsible text box - there is not way to turn it back into a collapsible text box.

Placeholders

As you are designing your Google Site, use a placeholder to save a spot for an image, video, map, a Google Drive document, etc.

Steps

1. Under Insert, select Placeholder

You have the option to resize

* 6 Placeholders will give you an equal amount of space in a horizontal section

Templates

Google just added a new feature for Google Sites. Drum roll please . . . templates!

These templates were created to give users a quick and easy instrument to create a high-quality site. The templates have a preselected theme, populated pages, and a wide array of prepositioned spaces for text, images, and layouts for your content.

If you don’t have the time or desire to start from scratch, a template is a way to go.

Education has two templates - Class and Club

Blog Post

Page updated

Report abuse