Category: GAFE

Google Sites: Updating Site Layouts & Customizing Navigation

You can give your pages structure by changing the layout & customizing navigation To accomplish this follow the steps below:

Updating Site LayoutScreen Shot 2016-03-04 at 11.38.02 AM

  1. In the top right corner of the page, click on the Gear Flower and under Site Actions select Edit Site Layout
  2. To enable/disable headers, footers, sidebars or horizontal navigation, click an option in the toolbar. Click it again to remove the object.
  3. Sidebar Options:
    • To add an item  to your sidebar (navigation,text, etc) click on the plus sign under sidebar
    • To edit an item in your sidebar click on the pencil under sidebar
    • To change individual objects on your site (headers, footers, etc.) hover over that part of your site. Editable areas are highlighted in blue. To make a change to a highlighted object, click it.Screen Shot 2016-03-04 at 11.37.35 AM

      • Header—add a custom logo or change its height & alignment
      • Horizontal navigation—Change your navigation bar’s style & select the pages of your site you want to display there.
  4. Once you’re finished changing an object, click OK. When you’re finished making all your changes, click Close

Customizing NavigationAfter you’ve added navigation bars, you can add links or change the order that your links appear.

  1. Screen Shot 2016-03-04 at 11.37.13 AMIn the top right corner of the page, click on the Gear Flower and under Site Actions select Edit Site Layout
  2. In the top toolbar, click Horizontal navigation.
  3. In the Configure navigation window, you can configure any of these options.
    • To rearrange the page order, use the arrows
    • To add linked pages, click Add page
    • To make a linked page a subpage in a sidebar or a drop-down list in a horizontal navigation bar, indent the link.
  4. Click OK and click Close



Google Sites: Adjusting Fonts, Colors & Backgrounds


Under the manage site option, you can add a further customize your site’s look by adding background colors or images to the header or entire page.  To accomplish this, follow the steps below:

    1. At the top right of the page, click on the Gear Flower and under Site Actions select Manage Site
    2. On the Manage Site page at the bottom of the  left sidebar select Themes, Colors, and Fonts.
    3. On this page you can change the theme of the site or you can change the color scheme (background, text)  of the entire page or specific areas (site header, content area, etc)
    4. At the bottom, you’ll see your changes reflected in the preview.
    5. When you have completed your changes, click save
    6. If you want to clear all customizations and return to the preset theme, click clear all customizations

Screen Shot 2016-02-29 at 10.57.20 AM



Google Sites: Adding Images, Objects & Other Gadgets

Under the Insert tab, you can add a objects, apps, and gadgets to further customize your site. This is also where you can embed files from your/ your students’ google drive, calendars, and files.

Some useful apps and gadgets include:

  • Recently updated files—Lists the latest additions or updates to files loaded on to the site.
  • Calendar—Embed a class/project calendar to update students of due dates.
  • Drive—You can embed anything from your google drive (docs, slides, drawing, etc.) to your site and students can also load their projects directly from their drives when given permission by the teacher to edit the site. When the source is modified, the document updates automatically within Sites
  • YouTube—Embed any YouTube video in your site.


Screen Shot 2016-02-29 at 11.42.47 AM

Google Sites: Editing Your Pages

In GAFE updating a site page is just like editing a document but you can do more than just adding text. To start click on the pencil in the top right hand corner of the page you want to update. This will open up your editing options that will appear across the top of the page. If you just created the page, the options appear automatically. Below is an overview of some of the basic options:

  1. Insert menu
    • Add images– you can add images by uploading them or by accessing them via their web address (URL) You also have the option of adding “ALT Text” to identify your images.
    • Add links- you can link to another Google Sites page, a Web address or an apps script. You can also choose to have your link open in a new window.
    • Add a table of contents- Google sites can create a tables of contents from the text headers on the page.  
    • Add gadgets under this option you can add snippets from your recent posts, add a text box, add an HTML box (for adding embedded codes or videos) or add other specific gadgets like Google Calendar.
    • Google-specific applicationsadd items from your google drive,  Google Maps, YouTube video, etc.
  2. Format menu and toolbar
    • Format text- you can format your text by choosing your font & text size, the color of your text & the ability to highlight it, the level of page heading and the alignment of the text on the page.
    • Remove text formatting- you can remove the preset formatting of the page in order to customize your content
    • Code- you can edit HTML or CSS content directly
  3. Table menu
    • Insert, delete, and modify table rows and columns
  4. Layout menu
    • Specify the number of columns on the page
    • Add sidebars- sidebars are auxiliary menu found at the edge of a webpage. They can be customized by the site creator and often contain a number of commonly used tools and provide a form of navigation for page viewers.

Google Sites: Adding Pages

When you first create your google site it only has a homepage and site map. To add pages:

  1. Click on the “add page” symbol in the right hand corner or the page
  2. In the new window, add a name for the page (a URL is automatically created for the new page, which you can change later. You can change the URL later by clicking on setting (Gear Flower) in the top right hand corner of the page and selecting Page Settings.  
  3. Choose a page template. The different types of pages available are:
    • Web page: the simplest kind of page; you can write content, embed gadgets, and arrange it to fit your needs. It has standard formatting controls ( bold, italic, bullets, etc.) and you  can attach documents from your hard drive to the bottom of the page. Site collaborators can comment on your pages and if you choose edit them as well.  Google Sites periodically saves versions of your page as you make edits, so it’s easy to go back to earlier versions of the page to make comparisons or undo changes.
    • Announcements: similar to a blog, announcement pages display posts you make to the page in chronological order, starting with the most recent.
    • File cabinet: these pages let you store and organize files from your computer’s hard drive, making it easier to share files with other users of your site. Anyone subscribed to the page will be notified when files are added, changed, or removed.
    • List page: these pages let you make and organize lists of information. Items on  list pages are easy to add, edit & remove and viewers of the list can sort it by any column. Anyone subscribed to the page  are notified when items are added, changed, or removed.

4. Choose your page’s location within the site by nesting it under an existing page or keeping it at the top level. You can move pages later by clicking on setting (Gear Flower) in the top right hand corner of the page and selecting Page Settings.  

5. Click on Create
Now you’re ready to edit the your pages

Screen Shot 2016-02-29 at 11.44.20 AM.png