Google Apps Home‎ > ‎Google Sites‎ > ‎

Google Sites Basics

           

Google Sites Tips and Tutorials

  • Customizing Themes This page will be complete by November 2012.Themes change the background, fonts, colors, and heading styles of  your web site. You can customize a theme by choosing Edit Sidebar ...
    Posted Nov 20, 2012, 5:30 AM by Joe Fahs
  • Creating a List Page This page will be complete by November 2012Lists pages are a good place to organize information. Viewers can organize the list by adjusting the way they sort various columns ...
    Posted Nov 20, 2012, 5:29 AM by Joe Fahs
  • Google Sites Video You can add YouTube and other streaming videos to your Google site by embedding them into a page. Go to page ...
    Posted Oct 24, 2010, 9:32 AM by Joe Fahs
Showing posts 1 - 3 of 4. View more »

Getting Started

  • Log on to your Google Apps account.  
  • Gmail no longer has an upper left menu bar to choose other apps. Click the App Launcher in the upper right corner of your screen and click to choose Sites

Create Your Site

  • Create a new tabbed window in your browser (CTRL-T or Open Apple T) so you can switch back and forth between your page and this guide. 
  • Log on to your Gmail account.
  • Click the Sites link in the top left menu bar.
  • Click the red Create button.
  • Follow steps 1 - 8. Check all settings.

  • As indicated in step 8 be sure to click the red Create button. 
If you do not have a Google Apps domain account, then you may be required to complete a word captcha

Manage Site > Sharing

Manage Site provides options to change the layout and appearance of your site, display site content such as pages and attachments in one location, share your sites with others for viewing and collaboration, and change your site name, category, and description.

By default a Google Sites web site is treated as a wiki in which all Google Apps members of the domain (e.g. Elmira College users) can find and edit. Let's change this right away so your site is viewable (find and access).
  • Click the blue Share button in the upper right corner of your screen to bring up Manage Site > Sharing and Permissions
The link to share in this example is https://sites.google.com/a/elmira.edu . 
  • Under Who has access click the Change link.
  • Under Visibility options choose Elmira College - People at Elmira College can find and access. 
  • To the right of Access is: Anyone within Elmira College change Can Edit to Can View.
        
  • Click the Save button.
You can always check the Sharing status of your site by clicking the blue Share button.

Adding People to  Edit Your Site


If you wish to add editors to your site who will edit pages with you, then enter their e-mail addresses with Can edit rights in the Add people box (e.g. mtwain15@elmira.edu).  As Owner of your site you have access to the Manage Site menu, but editors do not.

    
  • Click the Return to site link in the left sidebar.

Home Page 

Your home page is the landing page that viewers will see first when they go to your site's address (e.g. http://sites.elmira.edu/cvt). The page typically includes the purpose of your web site and entices readers to navigate through other pages in your site. It is good to keep the format uncluttered and visually appealing. Adding images is always a plus!

Editing Your Page

  • Click the Edit page button (pencil icon) in the menu bar at the top.        

Notice that the menu bar changes to Save and Cancel, indicating that the page is in editing mode. 
  • Refer to the diagram below, which describes the different parts of the editing page.
  • Click in the Content Text box.
  • Type the word Introduction and press the Enter or return key.
Let's quickly add filler text for practice:
  • Create a new tab in your browser and go to http://www.lipsum.com. Click the Generate Lipsum Lorem button and copy two paragraphs. Switch back to your Google Sites page, click in the Content Text box and choose Edit > Paste to paste the text.
  • Type the word History as a separate line before the second paragraph.
  • Type the word Links as a separate line after the second paragraph.
Formatting 
In this practice section you will add headings, a bulleted list, hyperlinks, and an image to your page. Below is a snapshot of what your page might look like:  



  • Click in the line Introduction and choose Format > Heading (H4).
  • Apply the same format to the lines: History and Links.
  • Under Links type a web address such as http://ptny.org and the press the Enter or Return key to create a new line.
  • Type text such as State's Outstanding Fall Foliage.
  • Highlight both lines and click the Bullet List icon.

Inserting a Hyperlink

  • Highlight the web address http://ptny.org and click the Link button in the Format bar. Google Sites detects the link as a URL and automatically inserts the web address.
  • Hover over the link and click Change.
  • Check Open this link in a new window.
  • Click the OK button. 
  • Highlight the text State's Outstanding Fall Foliage and click the Link button.
  • Follow the steps below to establish the link.

  • Click the OK button.

Inserting an Image

Let's insert an image and wrap it to the right of your text.
  • If you do not have an image, click the Download link at the bottom of this page to download the image cvt_start.jpg to your computer's desktop.

Attention! Crop and resize large images using software such as Photoshop to keep file size low. Uploaded images count towards your total Google Site storage and cannot be deleted even if no longer used or needed.
  • Insert the cursor before the text (in our example Lorem ipsum dolor in the first paragraph) and choose Insert > Image.
  • Browse for the image on your computer's desktop (or wherever it is organized), click to select it, and click the Open button. The image is added to the page's image library.
  • Make sure that image is selected (see example in the figure below). Type Alt text if you wish the image description to be read by an assistive screen reader. 
  • Click the OK button to insert the image.

  • Your photo is inserted before the text in your first paragraph. Apply steps 1 and 2 in the diagram below to wrap the image to the right of the text.

Save or rename your images with meaningful names (e.g. scenic_lake.jpg) that allows easy referral when managing attachments. 

Top of Page

Creating a New Page

Your Google Site is a collection of individual pages. Unless you create a site from a site template, your site begins as a single homepage. Follow these steps to create new pages within your site.

  • Click the New page button at the top of your page: 
You have the choice of five default page templates that determine the structure of your page.

Web Page The Web Page in Google Sites is the most basic page that gives you space to add content and images. Google Sites will update frequently to save work as it is being done, but to ensure all work is saved you can manually chose to save the page.
Announcement page An Announcement page is similar to a blog and can be used to post news or status updates. 
File Cabinet page The file cabinet page allows you to upload and store documents for viewers to access. People who subscribe to your site will be notified when new files have been uploaded. Page subscribers are notified of new files, updated files, and delete files.
List pages Lists pages are a good place to organize information. Viewers can organize the list by adjusting the way they sort various columns.
Start Page Start Pages allow viewers to add gadgets to use while viewing your page. This page is unique to each user since they can add their own gadgets. Gadgets are tools to make your online experience easier they range from simple calendar or weather tools to translators, and pretty much everything in between.


  • Choose the standard Web Page template.
  • Check Put page at the top level.
  • Type the Name of your page (e.g. history)
  • Click the Create Page button.
  • Practice adding text, images, and links on your own, again using copied or generated text as filler for your page.
  • Next let's learn how to insert a YouTube Video within your page.
For the related page in the Catharine Valley Trail site see http://sites.elmira.edu/cvt/history

Inserting a YouTube Video

You can add YouTube or Google Docs videos by embedding them into a page. Let’s use a YouTube video as an example.
  • Create a new tabbed window in your browser, go to http://youtube.com and type Catharine Valley Trail in the Search box. Click Search. (Or search for your own video.)
  • Click on the video thumbnail to open the YouTube page.
  • Copy the web address: http://www.youtube.com/watch?v=PpjrwBNrjuo
  • Click below the last paragraph in your history page.
  • Choose Insert > Video > YouTube.
  • Paste the web address into the URL box.
  • Click the Save button to insert the video.
  • Click to insert the cursor to the right of the video.

Catherine Valley Trail Half Marathon

http://www.youtube.com/watch?v=PpjrwBNrjuo
  • You should always attribute your source. Press the return or enter key and then choose Edit > Paste to insert the originating URL of the YouTube video.
  • Click the Save button.
Learn more 
Top of Page

Applying a Theme to Your Site

A theme is a common layout and formatting design that is applied to all pages in your site, existing or new. The theme's layer is separate from the areas where you add editable content unique to each page. Let's choose a theme that you find suitable fro your site.

  • Refer to the diagram to the right
  • Click More to drop down the menu
  • Choose Manage site.
  • Refer to the diagram below.
  • Choose Themes in the left sidebar.
  • Scroll through the themes and explore ones that look promising by clicking the preview link. 
  • Once you have chosen your theme, scroll to the top or bottom of the page and click the Save button.
  • Click <Your site name to return to your web site and display the new theme. 
You customize a theme by choosing Edit Sidebar > Colors and Fonts and applying colors, fonts, and images to the page, header, footer, sidebar, content, and gadget elements in your site. 



Learn more: go to Customizing Google Sites Themes for details and tips on how to modify a theme according to your taste!

Top of Page

Creating a Announcements Page

An Announcements Page like a blog keeps track of posts in reverse chronological order -- starting with the most recent information at the top of the page. Posts are sub pages to the primary announcement page. Ideas for announcement pages include reflections, news, technology tips and hints, and staff bios. 

Readers can click the Subscribe to Posts button on an Announcement page to receive a RSS news feed of new and updated posts. 

The Announcements page has a number of limitations:
  1. Posts can not be re-arranged from their default reverse chronological order. If you want to place a post at the top order of the hierarchy, then you would have to delete it and create a new post.
  2. The author's (user with Is owner or Can edit rights) name can not be hidden in the post signature.
  3. Only collaborators with read-write access to the site (Rights = Is owner or Rights = Can Edit) can comment on post. 
Let's create a News Announcement.
  • Click the New Page button.   
  • Under Select a template to use choose Announcements and type News in the Name your page box. Keep the option Put page at the top level.
  • Click the red CREATE button.
  • Optional: In the text box under News type a description of your page. 
  • Click the New post button.
  • In the title box type the title of your new information.
  • In the post box type the full text. You can include information as you would with a normal Google web page including images, hyperlinks, videos, and gadgets. Again posts are sub pages to your primary announcement page.
  • Click the Save button!
  • Click the News page link in the left sidebar.

Recent Posts (Announcements)

You can insert a gadget on another page such as the home page to display a window of current announcements (news, reflections, tips, and so on). 

  • Go to your home page. 
  • At the bottom of your page insert a new blank line and choose Insert > Recent Posts (under Gadgets). 
  • If you have more than one Announcement page choose the one you want from Show posts from. In this example CVT News is used.
  • Choose Post length = Short snippet. If your posts regularly include images you may want to try checking Include thumbnail of first image in post. 
  • You again have an opportunity to add an intro post to your announcements. 
  • To outline and title your Recent Posts gadget check Include border and Include Title with an appropriate name (e.g. CVT News). 

To see a the CVT News gadget go to http://sites.elmira.edu/cvt and scroll to the bottom of the home page. 

The gadget below highlights the three most recent Google Sites Tips and Tutorials. If you click View More, then all tips and tutorials will display, which provides a useful supplement to this introductory Google Sites Basic page.

Google Sites Tips and Tutorials

  • Customizing Themes This page will be complete by November 2012.Themes change the background, fonts, colors, and heading styles of  your web site. You can customize a theme by choosing Edit Sidebar ...
    Posted Nov 20, 2012, 5:30 AM by Joe Fahs
  • Creating a List Page This page will be complete by November 2012Lists pages are a good place to organize information. Viewers can organize the list by adjusting the way they sort various columns ...
    Posted Nov 20, 2012, 5:29 AM by Joe Fahs
  • Google Sites Video You can add YouTube and other streaming videos to your Google site by embedding them into a page. Go to page ...
    Posted Oct 24, 2010, 9:32 AM by Joe Fahs
  • Adding Captions to Google Sites Images You can add captions to images on a Google Sites page by editing HMTL code. Type your caption text after the IMG SRC tag for the image and before the ...
    Posted Nov 20, 2012, 5:28 AM by Joe Fahs
Showing posts 1 - 4 of 4. View more »

Top of Page

Customizing the Sidebar

You can customize the sidebar in your site to add external links, reorder page links, insert images, and add interactive widgets. 
  • Make certain that the page has been saved and the buttons Edit page, New page, More, and Share are available.
  • Click the More button and choose Edit Site Layout (under Site Actions). 
  • There are two sets of menus that are displayed: above your site title (Header, Horizontal navigation, Sidebar, Custom footer, and Site width) and the Sidebar menu as shown below.


  • Hover just below Sidebar to bring up the Configure Navigation menu (see diagram to the right) and click on the menu once.
  • Uncheck Display title
  • Uncheck Automatically organize my navigation.  Turning off automatic navigation allows you to add and organize pages in the order that you want. 
  • Let's add a page. Click Add page.
  • Below Select page to add click Home to select that page.
  • Click the OK button (you may have to scroll down your page's sidebar) to insert the CVT News page.
  • Click Add page and repeat the process to add other pages (e.g. CVT News, History) -- one at a time -- to your sidebar menu.  
  • To order pages vertically click to select a page and then click the Up or Down arrow.  
  • In lower left corner of the Configure Navigation window click OK to apply these settings and add the pages to your Sidebar. 
  • Click the blue Close button (upper right corner of your page) to exit Edit site layout.
Top of Page






ą
Joe Fahs,
Oct 13, 2010, 11:45 AM