Creating Your Classroom Website

Transcription

1 Creating Your Classroom Website Revised 7/10

2 Contents CREATING YOUR OWN CLASSROOM WEBSITE... 1 SIGN UP FOR GOOGLE SITES... 1 LOCATE THE CALSTATETEACH CLASSROOM SITE TEMPLATE... 1 SHORTEN YOUR SITE'S URL (OPTIONAL)... 2 GETTING HELP... 2 MANAGING AND EDITING YOUR SITE... 2 EDITING YOUR PAGES... 2 CUSTOMIZING YOUR CLASSROOM WEBSITE... 3 UPDATE YOUR WELCOME MESSAGE... 3 ADD YOUR CONTACT INFORMATION... 3 ADD INFORMATION ABOUT YOURSELF... 3 UPDATE THE "MEET THE TEACHER" BLOCK... 3 UPDATE THE "OUR SCHOOL SITE" LINK... 5 ADD AN ANNOUNCEMENT... 5 ADD A BLOG POST... 5 SHARE YOUR SITE... 6 OPTIONAL CHANGES... 7 ADD A HOMEWORK ASSIGNMENT... 7 ADD A NEW PAGE... 7 ADD A NEW PAGE'S LINK TO A NAVIGATION MENU... 7 CHANGING THE ORDER OF LINKS IN A NAVIGATION MENU... 7 REMOVE A PAGE'S LINK FROM A NAVIGATION MENU... 8 DELETE A PAGE... 8 ADDING A FILE TO THE "FILES AND DOCUMENTS" PAGE... 8 MORE ON MANAGING YOUR SITE... 9 ABOUT POSTS AND PAGES OTHER PAGE SETTINGS Revised 7/10

3 Creating Your Own Classroom Website This guide will show you how to create your own classroom site using Google's excellent website building tools. You will add to and customize your site as you move through the CalStateTEACH program. After you complete the program, you'll still have access to your classroom site. Sign Up for Google Sites To get started, point your browser to If you don't yet have a Google Sites account, you'll need to sign up for one by clicking the "Sign up for Sites" link. You can sign up for Google Sites with your calstateteach.net address. Optionally, you can sign up for a gmail account first and use that account to create your Google Sites account. If you have a gmail account already, you can use that account for your Google Sites account. Follow the on-screen instructions to create and authorize your Google Sites account, then sign in to Google Sites with your and password. Locate the CalStateTEACH Classroom Site Template You'll build your classroom site based on a CalStateTEACH classroom site template. There are two ways to locate the CalStateTEACH template. 1st Method (recommended) Go to and click the "Use this template" button at the top of the browser window. If you follow this link before logging into Google Sites, you'll be prompted to log in. 2nd Method 1) Once at the "My Sites" page, click the "Create new site" button. 2) Under "Choose a template to use", select "Browse the gallery for more". 3) Type "calstateteach" in the search box and click the "Search" button. The "CalStateTEACH Classroom Site" template will appear. 4) Click on the site in the list. 5) Click the "Select" button. CS-1

4 Type a name for your site in the "Name your Site:" box. Give your site a brief, descriptive name, such as "Miss Graves' Classroom" or "Mark Johnson's 2nd Grade Class". Shorten Your Site's URL (optional) Google will create a unique URL (web address) for your site based on the name you give it. Because this URL can grow quite long, it's a good idea to try manually shortening or abbreviating it. For example: Mark could try shortening /markjohnsons2ndgradeclass to /johnson2ndgrade. Note: the shortened URL still has to be unique among millions of Google sites. If Google alerts you that your chosen URL is already in use, try adding an additional word (or a number) to the end of your URL. You do not need to choose a theme or change any options at this time. Type the letters you see into the bottom box and click the "Create site" button. Your new site will be created, and you'll be taken to your site's home page. Click around the links in the left-hand navigation panel to get familiar with your new site. Getting Help If you find yourself stuck, click the "Help" link in the upper-right corner of the screen. This link takes you to a help resource you can easily search for answers to most problems users experience with Google Sites. Managing and Editing Your Site Most of your editing will occur using the "Edit page" and "More actions" buttons found in the upper-right corner of the site management interface. The "More actions" button allows you to change certain page settings, manage your overall site, and more. Editing Your Pages When viewing any page of your site, the "Edit page" button allows you to edit the main content area of the page you're currently viewing. In page edit mode, you can add and edit text, as well as add, move and delete other types of content. This other content includes files, calendars, tables and other "gadgets" that extend the functionality of the page. CS-2

5 In edit mode, an additional tool area appears. Here is where you can insert different types of content, as well as edit and reformat your page's text. Feel free to experiment with these controls. Click the "Save" button to keep your changes, or "Cancel" to discard them. Customizing Your Classroom Website Armed with general knowledge of how to change a Google site, it's time to customize your classroom site. Note: if you've been exploring the site management interface, return to your site's content now by clicking the "Return to site" link. Update Your Welcome Message If desired, you can change the intro paragraph on your home page (suggestion: keep it brief). To do so, follow these steps: 1) Click the "Home" link in your site's main left-hand menu to navigate to your home page. 2) Click the "Edit page" button at the top of the Google Sites interface. 3) Place your cursor in the existing welcome message and change it to your liking. Use the formatting buttons at the top of the edit window to change the look of your message. 4) Click the "Save" button to save your changes. Add Your Contact Information Use the process detailed above to navigate to the "Contact Information" page and update your contact info. Add Information About Yourself Use the process detailed above to navigate to the "About the Teacher" page and add a brief bio. Note: When adding information about yourself, consider your audience. Also, it's important to remember that the information you share will be visible to anyone. Update the "Meet the Teacher" Block To add your name and picture to your site's left-hand sidebar, follow these steps: 1) Click "Edit sidebar" in the lower-left corner of any page (you can also go "More actions" -> "Manage site" -> "Site layout"). 2) In your site's sidebar area, click "edit" in the middle "Text" box. This opens the text box for editing. CS-3

6 3) Click on the existing image to select where your new picture will go. 4) Click "Insert", then select "Image". 5) Click "Choose File" or "Browse", then locate your desired image on your local computer. After uploading, the newly uploaded image will have a yellow border. 6) Click "OK". Your image will appear in the text box with controls beneath it. 7) Click the links under the image to set "Align:" to "C", "Size:" to "S". 8) Click on the original image and select "Remove". 9) Swipe the text "Type Your Name Here" with your mouse to select it. 10) Type your name. 11) Swipe the red "Click 'Edit sidebar' " message with your mouse to select it, then delete it. Be sure to delete empty lines beneath the "(learn more)" link as well. 12) Click "OK" to finalize your changes. 13) Click the "Save changes" button at the top of the edit interface to save your changes. 14) Click the "Return to site" link to leave the site management interface (if desired). CS-4

7 Update the "Our School Site" Link To make the school site link go to your school's main web site, follow these steps: 1) Click "Edit sidebar" in the lower-left corner of any page (you can also go "More actions" -> "Manage site" -> "Site layout"). 2) In your site's sidebar area, click "edit" in the bottom "Navigation" box. This opens the navigation menu box for editing. 3) Double-click on the "Our School Site" entry in the navigation menu. 4) Add your school's home page address to the "URL or " box. 5) Click "OK" to finalize your link changes. 6) Click "OK" again to finalize your changes to the navigation box. 7) Click the "Save changes" button at the top of the edit interface to save your changes. 8) Click the "Return to site" link to leave the site management interface (if desired). Add an Announcement To add an announcement to your site (and delete the existing place-holder announcement), follow these steps: 1) Navigate to the "Class Announcements" page. 2) Click the "New post" button. 3) Change the title from ("Untitled Post") and enter the body of your announcement in the lower text box. 4) Click the "Save" button to save your changes. 5) To delete the place-holder announcement, return to the "Class Announcements" page. 6) Click the title of the announcement you wish to delete (do not click the "Edit post" link). The announcement page opens. 7) Click the "More actions" button and select "Delete page". Click "Delete" on the confirmation screen that appears. Add a Blog Post Use the process detailed above to navigate to your "Class Blog" page, then add a new blog post and delete the existing place-holder blog post. IMPORTANT: Your site is a virtual workspace where you can learn how to create your own classroom website. It is also public, viewable by anyone. To avoid compromising privacy or security YOU MUST NOT post any information about your actual students or classroom to your site. DO NOT use real student names, and DO NOT post pictures of your students. CS-5

8 Share Your Site Until you share your site with faculty and other CalStateTEACH students, you'll will be the only one able to see it. To share your site with your faculty, follow these steps: 1) From any content page, click the "More actions" button and select "Share this site" (you can also go "More actions" -> "Manage site" -> "Sharing"). 2) In the "Invite people to your site" box, select "as viewers". 3) Enter your faculty's CalStateTEACH address into the box. Click "Invite these people" to add your faculty to the list of people who can see your site. IMPORTANT: do not check the "Anyone in the world may view this site" checkbox. Your site should not be made public at this time. In the box that appears, leave the "Message" box empty and click the "Skip sending invitation" button. (You do not need to your faculty a link to your site they'll get your site address from the Course Website.) If you wish to send an link anyway, fill in the "Message:" box and click "Send". IMPORTANT: for reasons of safety and privacy, you must not share your site with anyone outside the CalStateTEACH program. You should now see your faculty's address in the "People with access" box. If you want to grant access to other CalStateTEACH students, use the "Message" box and "Send" button to enter and send an invite message. Once invited to view your site, their addresses will also appear in this list. CS-6

9 Optional Changes The following changes are optional--feel free to make them to your site if desired. Add a Homework Assignment A homework assignment page is already created in your site it's just not yet visible in any menu. To make the page visible and add a homework assignment to it, follow these steps: 1) From any content page, click the "More actions" button and select "Manage site". 2) Select the "Pages" screen from the left-hand menu. 3) Click the "Homework Assignments" page heading to view the homework page. 4) Click the "More actions" button and select "Page settings". 5) In the "Show this page in the sidebar:" area, check the "Main Site Links" checkbox. This will make the page visible in your main sidebar menu. 6) From the homework page, click the "New post" button to add a new homework assignment. 7) Follow the instructions for adding an announcement or blog post to add your new homework assignment and delete the place-holder assignment. Note: You can clicking the "Pages" screen's "Tree" view button to show the hierarchy of your site's pages. Add a New Page You can add any number of new pages to your web site. To add a new page, follow these steps: 1) From any content page, click the "Create page" button at the top of the management interface. 2) Choose a template (see the "Site content: Page Templates" section in this guide for details). In most cases, you'll use the "Web Page" template. 3) Give your page a name (shorter is usually better). 4) Leave the "Put page at the top level" option selected. 5) Click the "Create Page" button. Your new page will appear in edit mode, so you can immediately make changes. 6) Edit the page as desired, then click "Save" to save your changes. Add a New Page's Link to a Navigation Menu A new page will not be accessible to your visitors until you put it in a navigation menu or link to it directly from the content of another page. To add your new page to a menu, follow these steps: 1) If not already on the new page, go "More actions" -> "Manage site" -> "Pages" and click on the page heading to access the page. 2) Once on the new page, click the "More actions" button and select "Page settings". 3) In the "Show this page in the sidebar:" area, check the "Main Site Links" checkbox. This will make the page visible in your main sidebar menu. 4) Click "Save". Changing the Order of Links in a Navigation Menu To change the order of links in any navigation menu, follow these steps: 1) Click "Edit sidebar" in the lower-left corner of any page (you can also go "More actions" -> "Manage site" -> "Site layout"). 2) In your site's sidebar area, click "edit" in the "Navigation" box you wish to reorder. This opens the navigation menu box for editing. 3) Click once on the link you wish to move. CS-7

10 4) Use the up and down arrow buttons to move the link in the list. You can also use the left and right arrow buttons to create a visual hierarchy of links. 5) Click "OK" to finalize your changes to the navigation box. 6) Click the "Save changes" button at the top of the edit interface to save your changes. 7) Click the "Return to site" link to leave the site management interface (if desired). Remove a Page's Link From a Navigation Menu You can remove a page's link from one or more navigation menus, effectively making the page invisible (or inactive) on your site. This does not delete the actual page from your site. To remove a page from a navigation menu, follow these steps: 1) Click "Edit sidebar" in the lower-left corner of any page (you can also go "More actions" -> "Manage site" -> "Site layout"). 2) In your site's sidebar area, click "edit" in the "Navigation" box you wish to change. This opens the navigation menu box for editing. 3) Click once on the link you wish to move. 4) Click the "X" button to remove the link. 5) Click "OK" to finalize your changes to the navigation box. 6) Click the "Save changes" button at the top of the edit interface to save your changes. 7) Click the "Return to site" link to leave the site management interface (if desired). Delete a Page To completely (and permanently) remove a page from your site, follow these steps: 1) Navigate to the page you wish to delete. 2) Click the "More actions" button and select "Delete page ". 3) Click "Delete" in the confirmation box that appears. Adding a File to the "Files and Documents" Page You can add any number of files to your site's "Files and Documents" page (up to the 100 MB total file size limit). Use the following process to upload a file to your site: 1) Navigate to the "Files and Documents" page. 2) Click the "Add file" button. 3) Click the "Choose File" or "Browse" button and locate the file you wish to upload. 4) Add a brief description in the "File description:" box. 5) Click the "Upload" button to add your file to the page. CS-8

11 More on Managing Your Site To make overall changes to your site, click the "More actions" button and select "Manage Site". An overview of your site appears. These screens allow you access all of your content pages, control your menus, change who can view your site, alter your site layout or appearance, and much more. The "Pages" screen is pictured here. The sections of the site management interface you'll use most include: Site content: Pages Here you can access all of your pages, even inactive pages not currently seen by visitors to your site (pages that don't appear in any menu). Click the "Tree" button for a collapsed view that shows the relationships between pages and posts. Click any page title to go directly to that page. Site content: Page Templates Page templates define the layout of the content area of pages on your site. When you create a new page, you'll choose one of the four basic templates. You can also create your own templates on this screen. CS-9

12 The standard page templates include the following. Web Page This content area template is an empty container that allows you to add text, images and "gadgets" to the page. Use this template if you don't have need for any specialized content on the page. Announcements This template creates the index page for related posts such as announcements, blog entries or homework assignments. If you want to add a running series of posts of any type to your site (not just announcements), select this template. File Cabinet Use this template for uploading and sharing files on your site. List This template allows you to create a list with columns (like a spreadsheet table) that you can easily add items to. Site settings: General This screen allows you to change the name of your site (displayed at the top of every page), the "landing page" your visitors will first see, and other general site settings. Site settings: Sharing This screen is where you control who can see and edit your site. To add individual additional owners or collaborators, type their addresses into the text box and click the "Invite these people" button. Make sure the "Anyone " checkbox under "Advanced permissions" is checked to make your site public. Site appearance: Site layout This screen allows you to change the overall layout of your site. You can also control your lefthand menus and "Meet the Teacher" text box. Clicking the "Change site layout" button allows you to drastically alter your site's appearance (not recommended). Site appearance: Colors and Fonts Site appearance: Themes These screens allow you to change the colors, fonts and overall look of your site. Unless instructed otherwise, please keep your site's colors and theme unchanged for the duration of your tenure with CalStateTEACH. Note: you can return to your site's content from the site management interface at any time by clicking the "Return to site" link. CS-10

13 About Posts and Pages Pages that display a list of related content posts (i.e. announcements) allow you to jump directly to the post's edit screen by clicking any "Edit post" link. This works the same as clicking the post title to view the post, then clicking the "Edit page" button. Any post (i.e. announcement, homework assignment, blog entry, etc.) is considered a "page" in your site and can be edited and formatted as such. Posts differ from regular pages only in that they are added and displayed on an index page (i.e. the "Class Announcements" page). Just as with any page, you can also add a specific post to any navigation menu for one-click access. Other Page Settings To access other important page settings, click the "More actions" button and select the "Page settings" option. A pop-up window appears that allows you to control several aspects of the page, including its title, what menu (if any) the page appears in, and more. The page settings you'll use most often include: Show page title Check this box if you wish to have the page title displayed at the top of the page's content area. This is on by default for all pages except your home page. Show this page in the sidebar: This area allows you to select which navigation menu, if any, this page appears in. To make a page unavailable to site visitors (while you make changes to it, for example), make sure all sidebar boxes are unchecked. Note: a page does not have to be included in a sidebar navigation menu to be accessible. You can create a text link to any page of your site from directly inside any content area. CS-11