CommonSpot Intermediate: Training Guide
This workshop is intended to introduce the UW-Eau Claire content contributor to more CommonSpot concepts,
tools and methods needed to maintain and add new content to web sites. After completing this workshop, content
contributors will be able to create subsites, add new pages, use custom elements and adapt them to fit page
layouts.
Materials



CommonSpot Intermediate: Training Guide (white)
CommonSpot Intermediate: Exercises (pink)
Common Spot Intermediate: Word Document with Copy Text (yellow)
Setup


Open Internet Explorer and browse to http://www5.uwec.edu/playground
When instructed, each participant will go to their assigned site, linked from the sidebar of the Playground
home page
o The link named TextCopyIntermediate.txt will be used later to copy text into the Rich Text Editor
o Click the link named Staff Image. Right-click or Ctrl-click (Mac) on the displayed image and save
it to your desktop. Then use the browser back button to return to The Playground site
Outline
Part 1: Review of Basics
 Logging in
 Changing mode/Views
 Uploading an image
 Registering external links
Part 2: Creating Subsites and Pages with Templates
 Using the Admin section on My CommonSpot ribbon
 Creating subsites
 Creating a new page in a subsite using a template
o Using templates
o Standard metadata
o Custom metadata
 Layout options
 Building the page content
o Adding an image
o Using a CommonSpot Field to add the page title
o Adding an Info Box for related links
o Wrapping text around objects
o Using related links
 Changing a navigation bar from the template
 Adding a Page Index
Part 3: What’s Next?
 Advanced Topics: Templates, custom layouts, events, etc.
 Open house sessions
 Working one-on-one to enable you to maintain your site
Part 1: Review of Basics
In our CommonSpot Basics workshop, we did a series of exercises that logged you in, demonstrated how to change
views, use the Rich Text Editor, create links and know the differences between containers and elements.
We’ll start this workshop with Exercise 1 to review:




Logging in
Viewing page in CommonSpot
Changing views
Uploading an image to CommonSpot
Registering External Links
CommonSpot uses a registration system for links to non-CommonSpot pages or sites that are commonly used on
this campus. These are registered on a global subsite managed by Web Development Services that we call,
RegExternalLinks. While it takes a little more effort to use this linking feature, it is beneficial to do so if the exact
link is used on more than a couple of pages in your site.
The advantage of using Registered External Links is that if the link should ever change, it can be corrected in one
central location rather than going to every location where the link is used.
One way to see if a link exists is to use Reports » Pages, Templates, Uploaded Docs & Registered URLs. To narrow
the search, uncheck all options except Registered URLs and select the Subsite (check Include Child Subsites to view
all) and then Filter:
External Links – Dreamweaver Sites (for sites not yet converted to CommonSpot)
External Links – Off-campus (for sites not associated with UW-Eau Claire)
External Links – On-campus (for campus sites or services such as Webmail, Phonebook, etc.)
If you do not find the site listed, you can request to have the link globally registered (if you think the entire campus
would benefit, email web@uwec.edu) or you can create them locally for your site. If you want your local registered
links to be separated from other pages, you should create a special subsite used solely for this purpose.
Follow the steps found under Properties & Actions Register External Page.
Exercise 2 takes you through this process.
CommonSpot Intermdiate: Training Guide
2
Part 2: Creating Subsites and Pages with Templates
Using the Reports Section of CommonSpot
_
__
The Reports section of CommonSpot is an area where access and information on the content of your site/subsites.
Below is a listing of the different reports available:









Pages, Templates, Uploaded Docs & Registered URLs…
Images…
Pages with Broken Links…
Pages with Errors…
Pages by Link Reference…
Images by Link Reference…
Pages by Static Properties…
Pages Waiting for Approvals…
Approvals Blocked by Expired Users or Non-Contributors…
Go to Exercise 3 to review a Report.
Creating Subsites
The Admin section of CommonSpot is an area where settings and access to administrative functions are found. This
is where you will create your new subsite.
A subsite is a collection of similar pages, most often associated with navigational areas. A folder or directory in a
static site is a close equivalent of a subsite. The difference is that you can control more abilities in a CommonSpot
subsite than you can in a folder or directory. Subsites are created from the Subsite Administration section of
CommonSpot, described above.
Using standard conventions for naming and describing subsites will make maintaining your site easier. We
recommend the following:
1.
2.
3.
Subsite name: The name may contain letters, numbers, and dashes, but may not include spaces or
symbols. We recommend the name be typed in all lowercase and as short as possible
Description: A brief phrase or sentence
Display name: Used for display in dynamically generated elements such as Page Index or Breadcrumbs,
capitalize the first letter of the first word and lowercase subsequent words, unless they are proper nouns.
Go to Exercise 4 to create a “Jobs” subsite.
Creating a New Page in a Subsite Using a Template
Using Templates
A template is the framework for the development of similar pages in your site. Using a template simplifies
maintenance. Content in elements that are identical for a group of pages (e.g. navigation bars) are made
CommonSpot Intermdiate: Training Guide
3
unavailable at the page level (locked down.) This is so changes can be made on the template and effect a change to
all the pages derived from it. This is called page inheritance.
Your site may contain one or many templates, depending on the depth and complexity of pages. For most sites,
the template most often used will be called SiteName-Main. At the time of your site conversion, you will be given a
list of the templates and their purpose.
Standard Properties (Properties » Standard…)
Standard Properties contains general information about a page. It is the first panel of information filled in upon
page creation. A list of properties and recommended usage is shown on the following page.
Highlights of Standard Properties
Name/URL: When creating the page, enter
the filename minus the extension (e.g., index)
Title: The CommonSpot page label used for
breadcrumbs and other page features.
Recommended: Keep the title short.
Capitalize the first word. Do not capitalize
other words in the phrase unless they are
proper nouns.
Title Bar Caption: The title used in the
browser’s caption bar and for bookmark titles.
Here we use normal title capitalization.



Don’t use the same title on every
page of your site!
Do include your site name on every
page of your site plus the content
description. Also identify UW-Eau
Claire.
Order is important – start with the
most specific to least using the “,”
symbol as a separator:
Usage: Page Title, Unit Name, UW-Eau Claire
Example: Staff, Alumni Office, UW-Eau Claire
Description: A summary of the page’s content in a one or two sentence format. This becomes the abstract shown in a
search result set and improves search engine results.
Include In: Check both for most pages.
Keywords: Use words that will connect people to this page. The better the keywords, the better the search engine
results.
CommonSpot Intermdiate: Training Guide
4
Custom Properties (Properties » Custom…)
The General tab of the Custom Metadata panel is used to control the layout of your page. Listed below are the
layout options available to you. Custom layouts beyond what is available in Custom Metadata can be provided
through Web Development Services.
Show Navigation Bar: Yes/No
Navigation Justification: Left/Right
Show Upper Full Width Content Container:
 Hide full width content container
 Show full width horizontal container above navigation bar
 Show full width horizontal container below navigation bar
Turns the nav bar on or off
Links in the navigation bar can
display left or right justified
This container is intended for
providing a full width image or
text element either above or
below the navigation bar
Layout:
The layout options are shown to the right. It is helpful to understand sizes of
pages. Page sizes are developed in pixels. In UW-Eau Claire’s layout, the
standard width of all pages is 760 pixels (or 760 px.) Pages can be divided up
into sections with varying widths.
For example, the most common layout has 2 columns with a sidebar of 190 px
(ghost seal optional) and full content region to the right of the sidebar of 570
px.
Show Content Region Header Container: Yes/No
Show Lower Full Width Content Container:


Hide full width content container
Show bottom full width horizontal container
This container is intended for
providing an image or text
element above the content area.
For example, breadcrumb links
This container is intended for
providing a full width image or
information element above the
motto
Go to Exercise 5 to create a “Jobs” page.
CommonSpot Intermdiate: Training Guide
5
Building the Page Content
Elements placed on a CommonSpot page do not have margins automatically applied. Therefore, the content
contributor must apply margins whenever adding a new element to a page.
IMPORTANT: Except on custom elements where required, do NOT place margin options on containers (square icon). They
should be placed on elements (round icon).
The margin options available include:
 Default
 marginStandard
 marginLeftOnly
 marginLeftRight
 marginRightOnly
 marginTopOnly
 marginNoLeft
 marginNoRight
 marginNoTop
 marginNoBottom
 marginBottomOnly
 marginTopBottom
Another feature you will enable is the Page Title. When you use this field option, the Title you used in the Standard
Properties form will automatically be displayed here. Several other options are available, including page
description, page owner, site name, site URL, current user first name, etc.
You will be adding an Info Box for related links in the sidebar of the Jobs page. It is a best practice to isolate links to
pages outside your site to make it very apparent to the user that these links are not within the site. We provide
several options to make them standout.
The Infobox-Simple element is found in the Element Gallery under UWEC Custom Info Box Elements » Infobox –
Simple. Other types of boxes, including Rounded Edge boxes, are also available.
Go to Exercise 6 to add content to the “Jobs” page. This exercise will take a considerable amount of time to
complete. Time permitting: Complete Exercise 7 and 8 which show options for wrapping text around objects.
Changing a Navigation Bar from the Template
In The Playground site, as in most sites, the navigation bar is found identically on all pages and thus allows a user
to get to any page within the site from any page within the site. So that we don’t have to add “Jobs” to the
navigation bar on all of our pages, we lock it down so that it can only be changed in the template.
Go to Exercise 9 to add the “Jobs” subsite to the navigation bar.
Adding a Page Index
CommonSpot provides a convenient way to display collections of pages contained in a subsite (e.g., secondary
navigation), especially when using the Horizontal Navbar for primary navigation. Using the Page Index element, as
soon a page is added to a subsite, it will appear as a link in the Sidebar in a predetermined order.
Go to Exercise 10 and 11 to add a Page Index to the “About Us” index page and modify its display in the sidebar.
CommonSpot Intermdiate: Training Guide
6