Google Sites

sites.google.com

I’m unsure of if there is an import/export feature (I don’t think there is), so I recommend getting the client to sign in to Google and follow the instructions to create a new site and set permissions. This way, the site only has to be constructed once, just on the client’s account, rather than you setting up on your own account then having to re-create exactly the same thing on the client’s account.

A NEW SITE

Go to the link above. Sign in. Click “CREATE” (red button in the left sidebar), choose “Blank template“, name the site, and choose the url. Click “CREATE” (red button below search bar) to finish creating the new site. The name and url of the site can be changed later as well.

Well, congratulations. Your client is now the proud owner of a Google Site.

SET PERMISSIONS

Go to the site. Press Shift + S, or alternatively click on “More” (right side of top bar) then “Sharing and Permissions” (which has an icon next to it with a person-shape and a + sign).

In the field to “Invite people” (near the bottom), add your email, change “Can edit” to “Is owner,” and click “Share & save.”

Be proud. You’re also an owner of a Google Site now. Time to start editing the site while your client patiently twiddles his/her thumbs. Don’t make them wait too long, now.

EDITING THE SITE

It’s likely that you’re trying to re-create an existing site. It’s unlikely that you’ll get the Google Site to be exactly the same, but we’ll just settle for something exactly similar.

Themes, colors, fonts, backgrounds, & more

From the site, press G then M, or alternatively click “More,” then “Manage Site.” Click “Themes, Colors, and Fonts” (bottom of left sidebar).

Start by choosing a similar theme. Then, customize the colors and fonts using the settings available. Insert the header background picture, if applicable. Other options include are but not limited to navigation hover colors, text sizes of headers, and background color/images.

As far as I am aware, there is no way to use CSS to affect the entire site, or even the entire page. There is an HTML module, but any CSS placed in the HTML module is supposed to be limited to only inside that module.

Removing the search box

From the site, press G then M, or alternatively click “More,” then “Manage Site.” Click “Configure Search” (below Site Storage and Copy/Publish/Delete Site, above Statistics).

Simply uncheck “Enable Search” in the options that appear.

Changing Layout

From the site, press Shift + L or alternatively click “More,” then “Edit Layout.” In the top bar, the header/navigation/sidebar/footer can be enabled or disabled, and the site width can be set. Click on parts of the site itself to see additional options.

Click on the header of the site. The height can be changed, and a logo can be added. Alignments can also be changed as well.

Click on the navigation. The pages that appear can be configured, and the style of the navigation (boxes, tabs, or links) can be chosen.

Click on the sidebar. The title and page level shown are editable. Click on the pencil icon of the sidebar. The position and width of the sidebar can be configured.

Click on the (non-custom) footer. The “View Site as Desktop,” “Sign In,” “Recent Changes,” and “Print Page” links can be hidden. The custom footer is fully editable unlike the regular footer, which cannot be removed.

Adding & Editing Pages

To make a new page: From the site, press C, or alternatively click the New Page icon (paper with a + sign, right side of top bar). New page = made.

To edit an existing page: From the page, press E, or alternative click the Edit Page icon (pencil, right side of top bar). Page = editable.

Everything is WYSIWYG, so I won’t go through all that. However, I’ll note here that some pretty cool stuff can done, such as inserting pretty much anything Google (e.g. Calendar, Maps, Docs, Presentations), and you can also change the layout of the content. Both are in the menu bar at the top. Of course, normal options like inserting tables or images are available as well.

This entry was posted in Coding. Bookmark the permalink.

Comments are closed.