Incline After-School Organization

Positively impacting the lives of dozens of children each day

The Village Guide, your virtual concierge audio and web guide -- with 100% of all advertising proceeds going to support IAO activities

See your name on Crystal Express at Diamond Peak -- joint project of DPSEF and IAO

Primer


Incline After-School Organization
©

Site hosted by Sierra Web Design

Primer on Editing the IAO Website

Login to the Content Management System (CMS)

  • get your username/password
  • login at the IAO site... the upper right corner... Login
  • note: this document is available on the IAO site in the lower right corner... Primer

Note on Browser Pop-up Settings

  • during various editing operations (e.g. inserting an image) your browser (Internet Explorer, Firefox) will want to open a pop-up window (e.g. to browse to the image on your local PC)... you may therefore need to (only once per computer) enable pop-ups for the IAO site.
  • the first time you access a pop-up form you might need to click in the browser header to allow the pop-ups (permanently for this site)
  • or you can do this proactively via... in your browser... Tools, Internet Options, Privacy, Pop-up Blocker, Settings, allow www.inclineafterschool.org

General Guidelines for Web Pages

  • With the exception of specific Events and dated News Articles, avoid "dating" of the material... leave out "year such-and-such", "yesterday", "next week", etc.... this just sets you up for an out-of-date page that you or a colleague will forget to edit.
  • Unless it's obviously important, avoid specific use of people's names and titles... assignments change often and therefore we again are setting ourselves up for out-of-date pages.
  • Remember the "one place" principle... information should be stored on the site in "one place" only. If we replicate information on multiple pages, chances are that when edits come along we'll forget to change the replicated pages and once again we have pages out-of-date.
  • Text
    • stick to standard Formats
    • Heading 2 for page header
    • Heading 3 for subheaders
    • Normal for body text
    • only use Bold and Italics when absolutely needed (they become too loud if overused)
  • Images
    • generally limit image height to 160 pixels for landscape images and 220 pixels for portrait images
    • if you want the visitor to have access to a larger image, let the CMS system create a small thumbnail Link to the full-sized image (see "to add images to a page" below)
  • Links
    • the general objective here is to preserve the visual comfort zone provided by our attractive IAO site
    • if you are linking to a page outside the IAO web, then have it open in a New Window
    • if you are linking to a PDF file (in or outside the IAO web), then have it open in a New Window
    • if you are linking to a page inside the IAO web that does not have the look/feel of the standard IAO web, then have it open in a New Window
    • you specify links to open in a New Window on the Insert/Edit Link form... Target... Open link in new window



Important Note on Cut/Paste

If you are cutting/pasting text from another application (definitely MS Word but also some other applications and occasionally some web pages), you'll want to make sure the formatting of the source (font, color, bold, etc) is NOT brought forward to the web page. To avoid adopting the formatting of the source, just do the following:

  • if available, always start with a "print friendly" version of web pages
  • swipe/copy the text you want from the source
  • open Notepad via right mouse on Desktop, New, Text Document
  • paste our text into Notepad
  • select all Notepad text (cntl-a)... copy
  • now move to your new web page in the CMS system... paste (this will paste all the text without any formatting)
  • to double check, you can click the Source icon in CMS to verify that that are not a bunch of html tags (e.g. <font size="2">, <span style>, etc.)


Editing a News Article

  • this is a good place to start.
  • Login to the CMS (see top of this Primer)
  • Go to the News article you'd like to edit (from the right sidebar, or "more" under Latest News)
  • at the top of the article, click Edit
  • now you're in an editor much like a simplified MS Word. Just try things out... but do not hit "Submit" at the bottom of the page, as this would overwrite the good version on the website.
  • when you're done experimenting, click on Home from the top menu (this will exit the editor without saving)

Creating a News Article

  • Find a "printer friendly" version of a news article, e.g.:
    • tahoebonanza.com
    • Search for "IAO"
    • select the desired article
    • click on the Print icon at the top... Cancel the printing
  • Login to the CMS (see top of this Primer)
  • from the left menu area, click Create Content... News
    • enter the date of the news article in the Start date area... leave the End date the same as the Start date
    • swipe/copy/paste from the article title into Title
    • in the Body block
      • type in the name of the publication (e.g. North Lake Tahoe Bonanza:) and Bold it
      • swipe/copy/paste the first paragraph of the source article into the Body block
      • example:
        North Lake Tahoe Bonanza: For more than 15 years, Project IAO has put food on the tables of families in need through its weekly food distributions. A new program which may become a model in the region for social services, gets to the heart of the hunger problem.
      • swipe/copy/paste the remainder of the text from the source article into the Article block
  • To add images to the page

    • in the source document (e.g. printer-friendly page of Bonanza), click on are image to enlargen it
    • right mouse on the image... Save-Image-As... to somewhere on your local computer (remember location)
    • now in the Body of the article you're editing, position your cursor at the beginning of the paragraph where you want the image displayed... click the Insert/Edit Image icon
    • to the right of the Image URL field, click the Browse icon... at the bottom of the popup form... check on the Create Thumbnails, click Browse... select the image file from your local computer... Upload File... then from the upper table of files(you can sort this table by clicking date, then the latest uploaded images are on top), add the image file that was uploaded... or add the image's thumbnail (sufixed with "_0")
    • Border = 1... VSpace = 4... HSpace = 4... Align = Right
    • swipe the URL field... right mouse Copy
    • Insert off the form
    • if you want the thumbnail to link to the full image... select the thumbnail... Edit/insert link icon... put your cursor in the Link URL field... right mouse Paste... Target = Open link in New Window (this allows the visitor to click on the thumbnail in your article to get a full-size graphic in a new window)
  • If the press article was authored by a particular person (rather than staff reports), then go to the bottom of the Body block and enter the author's name and title, and right-justify.
  • Proofread your page carefully
  • To save your work (early and often!), scroll to the bottom of the page and click the Submit button ... or click View at the top of the page if you want to discard your changes
  • Proofread the live version carefully
  • Newsletters: treat the IAO Mailer newsletter as a news article:
  • Create Content... News
  • enter the date as the date the newsletter mailed
  • enter a title in the form... "Newsletter - IAO Mailer - <season> <year> (e.g. Spring 2007)
  • near the bottom of the News article, File Attachment... Browse to a PDF version of the newsletter on your local PC... Attach
  • Submit

Creating a Calendar Event

  • Login to the CMS (see top of this Primer)
  • from the left menu area, click Create Content... Event
    • enter the Start date and time... enter the End date and time (can be same date for single-day events)
  • enter a Title for the event (keep this brief, say less than 22 characters)
  • in the Body block
    • enter your full description of the event (you could also add images, see above)
    • if you want to bring up a PDF file (e.g. a flyer)
      • add some text, e.g. "Flyer..."
      • select "Flyer..." and click Insert/edit link
      • to the right of the Link URL field, click the Browse icon... at the bottom of the popup form... click Browse... select the PDF file from your local computer... Upload File... then from the upper table of files(you can sort this table by clicking date, then the latest uploaded files are on top), add the file that was just uploaded
      • Target = Open link in New Window
      • Insert off the form
  • Proofread your page carefully
  • To save your work (early and often!), scroll to the bottom of the page and click the Submit button ... or click View at the top of the page if you want to discard your changes
  • Proofread the live version carefully

Editing an Existing Page

  • Note: for now IAO users (other than Wayne) are limited to editing Calendar Events and News articles. If you really need edits to other pages, please contact Wayne.
  • Login to the CMS (see top of this Primer)
  • click Edit at the top of the article
    • edit or add to the text much as in any word processor
    • standard settings to use
      • page headers are Format = Heading 2
      • subsection headers are Format = Heading 3
      • narrative text is Format = Paragraph
      • within a line you can use (sparingly) Bold, Italics, and Underline
      • use numbered/bulleted lists, indents, and justification as you would in a word processor
  • To add images to the page
    • in the source document (e.g. Google images, Bonanza article, etc.), click to get a full-size image displayed
    • right mouse on the image... Save-Image-As... to somewhere on your local computer (remember location)
    • now in the Body of the article you're editing, position your cursor at the beginning of the paragraph where you want the image displayed... click the Insert/Edit Image icon
    • to the right of the Image URL field, click the Browse icon... at the bottom of the popup form... check on the Create Thumbnails, click Browse... select the image file from your local computer... Upload File... then from the upper table of files(you can sort this table by clicking date, then the latest uploaded images are on top), add the image file that was uploaded... or add the image's thumbnail (sufixed with "_0")
    • Border = 1... VSpace = 4... HSpace = 4... Align = Right
    • swipe the URL field... right mouse Copy
    • Insert off the form
    • if you want the thumbnail to link to the full image... select the thumbnail... Edit/insert link icon... put your cursor in the Link URL field... right mouse Paste... Target = Open link in New Window (this allows the visitor to click on the thumbnail in your article to get a full-size graphic in a new window)
  • To edit or replace an existing image... select the image, click on the Insert/edit image icon... and do much the same as was done in the previous major bullet
  • Proofread your page carefully
  • To save your work (early and often!), scroll to the bottom of the page and click the Submit button ... or click View at the top of the page if you want to discard your changes
  • Proofread the live version carefully

Creating a New Page

  • adding Pages (other than Events and News) to the website is a bit trickier... contact Wayne to discuss

Creating and Uploading Photo Albums

  • at present this is also a bit complex and Wayne needs to be in the loop
  • if you only have about 10 photos, simply ZIP the photos and email the ZIP file to Wayne
  • if you have more than 10 photos, then write the photos to a CD and get the CD to Wayne