Google Sites: Build Your Own Theme (Pt. 5)

By | August 18, 2011

Part 1 | Part 2 | Part 3 | Part 4 | Part 5

This will be the final post of the Build Your Own Theme series. I will post another series about organizing a class site.

In this post, we’ll customize the site appearance, and publish as a template for future use.

Customize or remove Search Box

Sometimes you design a nice header, and when you look at your site, the search box ruins it.

Depending on how large your site will be, or how it is organized, you might want to keep the search box, and design your header around it as needed.

Unfortunately, you can’t move the search box to another part of the page, so it has to be all or nothing. I remove the search boxes from my class pages, since most of the information is duplicated in Google Documents (where there is a much better search feature that can search within documents).

To remove it, go to Manage Site (type g then m), and click on Site Layout. Click on “Configure Search” If you uncheck “Enable Search,” it will remove the search box. If you want to keep it, you can also set search parameters: search this site only, search all sites in the domain (Apps accounts only), and search google. Whatever you choose, be sure to click “Save Changes” before returning to the site.

Page Settings

When you create a new page in Google Sites, there are some features that will automatically appear: Page Title, Subpage listings, Attachments, and Comments. You can remove any of these on any page.

The Page Title is set when you create the page, but you can change it at any time by replacing it in the editor function (press e). The URL won’t change, until you change it in Page Settings (see below).

When you create a new page, it is placed by default on the top level (no hierarchy). You are given the option to place it within the page you were on when you clicked “Create a Page,” or you can place it anywhere else you’d like. 

It is very useful to use page hierarchy to organize your site. However, when you do,  you will see the “Subpage Listing” on the page. It is organized alphabetically, which I don’t find particularly useful. I prefer to use the dropdown menu in horizontal navigation  (even though it has to be set up manually) just so my site doesn’t look cluttered.

“Attachments” can be a useful feature, if you want to add a file or files to a page that visitors can see and download. It saves the trouble of making a separate page for downloads. I haven’t used attachments in this way (my “attachments” tend to be Google documents), so I remove it.

“Comments” is an interesting feature, and useful for certain types of pages (when you want student feedback/comments/input), but on an information only page (like syllabus or home page), I remove it. I think you have to be logged into a Google account to submit comments (at least, it didn’t work for me).
To modify these, go to Manage Site > Page Settings (or type u)

You can unselect the ones you don’t want to include. Again, you’ll have to do this for each page.

I remove them all as soon as I create pages, and add them back later as needed.

Customize System Footer

The System Footer is the ‘Google stamp’ that appears at the bottom of every Google Site. Its a way of letting visitors log in to edit, or report sites for abuse. And, of course, that the site is powered by Google. As such, you can’t modify it very much, but you can trim it a bit. Go back to Manage Site, then Site Layout. If you scroll to the bottom, there is a box for the system footer. Click “Customize Site Footer Links.” Here, you can hide 4 out of the 7 system links. If students are going to have edit privileges, you may want to keep the “Sign in” box, but there’s really no need to keep the others. I’ll hide all four. Click “Save Changes” before returning to your site. Your new system footer will look like this:

Create Custom Footer

While you can’t remove the Google System Footer Completely, you can add your own. Perhaps you want to include other helpful links for students (School Web Page, Your Email Address, Gradebook, Etc). Back in Part 1, we added a Footer to the page layout (Site Layout > “Change Site Layout” > Click checkbox next to “Footer”). Now, we’ll click “Edit Footer” on the Site Layout page. You will have basic text editing capabilities (text, insert image, insert link, insert horizontal line) and formatting that you will find on any Google Page (headings, sub/super scripts, etc). You can also use HTML editing. I kept it simple, three links, and a horizontal line to separate it from the system footer. Once you save changes and return to your page, it will look like this:

Publish your theme as Site Template

Now that we’re done with the theme, you might want to save it somehow to use for a future site. Unfortunately, there’s no “Save theme” feature on Google sites (yet?), but you can copy the site, or publish it as a template.  For either case, go to Manage Site, and select General in the left menu. Scroll to the bottom, and you will see both options.

If you “Copy the Site” it will be private only to you.  If you Publish the Site as a template, it will be searchable by anyone searching for a template (though you can usually only find it if you know the title). If you have Google Apps for Education, you have the added option of publishing the site template to your domain only.

If you have any questions about any part of this series, please leave your questions in the comments, or click “Contact Me” at the top of my blog.


2 Comments

Elizabeth on October 6, 2012 at 6:17 pm.

This whole series was incredibly helpful! I’m a developer who has been asked to create a Masthead and Navigation for a company that uses Google sites for it’s internal newsletter… now I know the limitations of my design. Thank you so much!

Reply

Laurence cutler on February 10, 2013 at 9:25 pm.

Awesome series, it’s old I know, but it still works perfectly, just shared them all on google+ so others can benefit too.

Reply

SAY|something

Your email will not be published or shared. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>



UA-21712927-1