Getting Started With CommonSpot

arcanainjuredΛογισμικό & κατασκευή λογ/κού

2 Ιουλ 2012 (πριν από 5 χρόνια και 2 μήνες)

395 εμφανίσεις

CommonSpot

Content Server
Getting Started Guide



Copyright 1998-2005 PaperThin, Inc. All rights reserved.

CommonSpot Getting Started 2

This CommonSpot Content Server Getting Started Guide, as well as the software described in it, is
provided under the CommonSpot Evaluation License Agreement and may be used, copied and distributed
only in accordance with the terms of the license. The content outlined in this manual is for informational
purposes only and is subject to change without notice. By no means should the information contained
herein be construed, as a commitment by PaperThin, Inc. PaperThin assumes no responsibilities or liability
for errors or inaccuracies found in this documentation.
ColdFusion and Flash are registered trademarks of Macromedia Corp. Microsoft, Windows, Microsoft Word,
Excel and PowerPoint, FrontPage and Windows NT are all registered trademarks of Microsoft Corporation.
Solaris is a trademark of Sun Microsystems, Inc., Acrobat is a trademark of Adobe Systems Incorporated
and Verity is a trademark of Verity, Inc. FuseTalk is a trademark of FuseTalk, Inc.
This document was last updated January 19, 2005.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 3

Chapter 1 Introduction
......................................................................................4

Chapter 2 Installation
........................................................................................5

2.1. Preparation
.........................................................................................................5

2.2. Installing
............................................................................................................6

Chapter 3 Understanding CommonSpot Site Hierarchy
....................................12

Chapter 4 Site Creation
...................................................................................13

Chapter 5 Understanding Templates
...............................................................17

5.1. Template Overview
...........................................................................................17

5.2. Base Templates
.................................................................................................18

5.3. Navigation Templates
.......................................................................................18

5.4. Content Templates
............................................................................................18

Chapter 6 Developing the Base Template
........................................................19

6.1. Base Template Introduction
...............................................................................19

6.2. Importing HTML
................................................................................................20

6.3. Replacing Content with CommonSpot Elements
.................................................25

6.4. Populating “base +1” Template
.........................................................................30

6.5. Advanced Base Template Development
.............................................................37

Chapter 7 Developing Content Templates
.......................................................39

7.1. Steps to Create a Content Template
..................................................................39

7.1.1. Ghost text
.................................................................................................................40

7.1.2. Element Inheritance
..................................................................................................41

Chapter 8 Next Steps
......................................................................................42

Chapter 9 PaperThin Resources
.......................................................................44

9.1. Contacting PaperThin
........................................................................................44

9.2. Technical Support
.............................................................................................44

9.3. Sales
.................................................................................................................44

Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 4

Chapter 1 Introduction
Thank you for your interest in evaluating CommonSpot Content Server. In this guide you will learn
the fundamentals of building a new site with CommonSpot. The intended audience of this guide
is first time developers and administrators of CommonSpot who are looking for a step-by-step
instruction guide for getting a site up and running in CommonSpot quickly. An entry-level
understanding of ColdFusion development is assumed, along with basic Web application
development. Also, it is assumed that the user has had at least an introduction to CommonSpot
and has a basic familiarity with interface.
It is the goal of this guide to provide simple instruction on installing CommonSpot, configuring
the server, and instruction on the first steps toward turning your Web site design into a
CommonSpot site. This guide is not intended as fast-track training of CommonSpot, nor to
replace other product documentation which provides additional details of CommonSpot use. The
CommonSpot User and Administrator Guides ship with the evaluation software for your reference.
Please refer to the following additional resources to learn more about CommonSpot:
Content Contributor’s Guide





Administrator’s Guide
Developer’s Guide
Template Developer’s Guide
CommonSpot Document Library on
www.paperthin.com

Recorded Webinars on
www.paperthin.com


Knowledge Base Articles on
www.paperthin.com


CommonSpot Discussion Forums on
www.paperthin.com


PaperThin Technical Support


Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 5

Chapter 2 Installation
This chapter deals with the various different steps involved in a CommonSpot installation.
Installing CommonSpot is a browser-based operation that does require some preparation of
outside software like database servers and web servers.
The contents of this chapter are:


Preparation


Installing

2.1. Preparation
Prior to installing CommonSpot, you’ll need to complete the following important steps.
Completing these configuration steps ahead of time will allow the installation process to
proceed smoothly.
You should have received an email from PaperThin containing instructions for downloading
evaluation license keys from the PaperThin web site. Before downloading new keys, a validation
code will need to be entered to activate the keys for your server.
1. Navigate to
http://www.paperthin.com/support/downloads
- the secure
downloads section of the PaperThin support site. Log in using the user name and
password which were emailed to you.
2. Download the appropriate CommonSpot software build from the Web site.
3. Create a “commonspot” directory either at the Web root of your server or under an
alias. Whether this directory is actually at the Web root or simply mapped is not
important, as long as navigating to {servername}/commonspot in your Web browser is
a valid path.
4. Unzip your CommonSpot build into your commonspot directory.
5. Verify that the ColdFusion server is properly configured for CommonSpot. Refer to the
‘server-configuration-notes.doc’ in the CommonSpot /docs directory named for
details.
6. Create a “keys” directory in your commonspot directory.
7. Navigate to http://{servername}/commonspot/installation/server-info.cfm.
Copy the server validation code that is displayed.
8. Navigate to
http://www.paperthin.com/support/downloads/license-keys.cfm
.
Next to the server key that is displayed, click on the link “Validation Codes”. In the
dialogue that is displayed, enter the validation code you received in step 7.
9. Click on the Download Keys link on the right hand side of the page. Download the set
of CommonSpot evaluation keys (a “Server” key and a “Customer” key) which we have
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 6

created for you, and which you will need as part of the installation process.

10. Place the keys which you downloaded from the PaperThin site into this keys directory.
11. For MS SQL Server and Oracle installations, you will need to create databases (users)
at this point for CommonSpot’s sites and users. These two databases are required for
installation. For MS Access installations, these databases will be created by
CommonSpot during the installation.
2.2. Installing
The CommonSpot installation process will walk you through the steps of installing on your
server. In order to begin the installation process, open Internet Explorer and navigate to
http://{servername}/commonspot/installation/install.htm
(replace the ‘servername’
with your server name or IP address, or use ‘localhost’ from the server console):
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 7


Continuing on to Step 1 will begin the installation process. Steps 1-4 are all htm documents
that will walk you through the steps necessary to configure your Web server. Step 5 is the first
ColdFusion module in the process. Please note that before you proceed to step 5 you must
have:
• ColdFusion running
• A ‘/commonspot’ mapping in your ColdFusion administrator
• Your jvm settings configured according to the CommonSpot Installation Guide.
Step 5 of the installation requires you to enter the proper path to your ColdFusion administrator,
to your Commonspot installation and the password to your ColdFusion administrator.
CommonSpot needs this password in order to interact with the ColdFusion administrator and
complete the installation process.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 8


Once you have entered this information, continue to Step 6. Step 6 will perform additional
checks and tell you what to expect for step 7. Review this information carefully before
proceeding to Step 7. Step 7 involves entering the server information and directory
configurations.
When enter the server and license information, be sure to enter the correct Server IP Address. If
you have an alias or DSN, you may use that.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 9


Of special note is the Administrator Account. When CommonSpot is installed, an administrator
user called ‘admin-commonspot’ will be created. The password that will be used is whatever
you enter here.

Also, be sure to adjust the CommonSpot directories to suit your installation. The Web Server
Document Directory marks the “home” directory of your Web server, the Parent Directory marks
the directory where all new sites will be created (sub-directories will be created for each new
site) and the Local Data Directory is where CommonSpot will store all necessary internal data.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 10


Once you have entered all of the above information, click ‘OK’ to proceed.
• MS Access installations - CommonSpot will create the necessary .mdb files and
datasources, and move directly to the CommonSpot login screen.
• MS SQL Server and Oracle installations - CommonSpot will first go to the database
configuration screen.

Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 11

For both the sites and users database, enter the name of the database, the server on which it is
located, and the username and password required to log in. Keep in mind that CommonSpot will
need rights to add and drop tables and columns, etc.
At this point, CommonSpot will create the datasources and proceed to the login screen. Log in
using the ‘admin-commonspot’ username and the password you provided in Step 6 and you will
find yourself at the CommonSpot Administrator Module, ready to create a site.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 12

Chapter 3 Understanding
CommonSpot Site Hierarchy
One of the most important concepts to understand before beginning to build your first
CommonSpot site is the concept of the site hierarchy. Each CommonSpot site is a stand-alone
entity with its own content database and hierarchy. CommonSpot sites do not share search
indexes with each other, nor can they share content or templates. Please bear this in mind when
creating separate CommonSpot sites.
The structure of each of these sites is composed of a set number of directories that are created
with each site and the subsites that you create. Each subsite that you will create adds another
level to this directory structure. When considering what constitutes a new subsite, it is important
to consider that the site structure will affect url’s, breadcrumbs, security, content scheduling, and
searches. See the graphic below for an example of how this structure might work.

Note that certain directories, like ‘cache’, ‘customcf’, and ‘images’ are created with each subsite,
while others like ‘datasheet-modules’ and ‘renderhandlers’ exist only for the root level site.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 13

Chapter 4 Site Creation
Once you have decided what the structure of your site is going to be, it is time to create it. The
CommonSpot interface will walk you through the process of site creation and will automatically
generate the file structure and database data necessary for a new site. Once again, for Oracle and
MS SQL Server installations, the database (user) necessary for the content of the site will need to
be manually created ahead of time. For MS Access installations, the database file will be
automatically generated by CommonSpot.
Once you have completed steps necessary for creating the database file, you can navigate to the
CommonSpot Admin home ({yourserver}/commonspot/admin/index.cfm}).

Expand the ‘sites on this server’ section and click on the ghost text ‘Click here to create a new
site’.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 14


The first dialogue presents a list of required permissions for site creation, and asks you supply the
password for your ColdFusion administrator. Once those permissions have been confirmed and
the correct password provided, Click ‘Next’ to proceed with the installation.
The second step of the installation asks you to provide a ‘Name’ for your site, a ‘Brief Description’
and a ‘Display Name’. The ‘Name’ of the site will be the name of the actual directory that is
created by CommonSpot. All of your site’s file structure will be kept within this directory. The
‘Brief Description’ will be used for display purposes only, such as in the CommonSpot
administrator. The ‘Display Name’ will be used for display purposes in links, breadcrumbs, etc.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 15


When you have completed this information, click ‘Next’ to proceed to the next screen. This
dialogue will gather the information that will configure your site. The base directory is where you
want the folder structure of your site to be installed. Remember that each site must have its own
directory. This will default to the document root you provided in the CommonSpot installation,
with the new site directory added on.
Next is a checkbox that asks whether or not this site is to be at the Web server root. This is where
the determination of whether this is to be a root site or not is made. With a root site,
CommonSpot will assume that the Web server will see this site as the root and that it has been
configured appropriately. For example, if “mainsite” was a root site, it could be navigated to in
the browser through http://{servername}/. If it were not a root site, its address would be
http://{severname}/mainesite/. This checkbox will determine how CommonSpot will store
internal paths to the site.
Also in this dialogue you will need to provide the IP, or alias, for the new site, choose a name for
the ColdFusion data source that will be created, and provide a password for the CommonSpot user
that will be created to have administrator rights to the site.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 16


When you have established the configuration of your site, click ‘Next’ to proceed. For MS Access
installations this will be a final screen reminding you to check your Web server configuration. For
SQL Server or Oracle you will first have to configure the database settings for your new site. This
is done in a similar fashion to that of the CommonSpot installation.
From there, you will be presented with a dialogue that will ask you whether you want to
“Configure” to enter the site administration of the new site, “Create first page” to create a new
page at the root of the new site, or “Close” to simply close the dialogue and stay at the
CommonSpot administration home.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 17

Chapter 5 Understanding Templates
Before incorporating your Web site design into CommonSpot, it is essential to understand the
template structure of a CommonSpot site. A CommonSpot site is, above all things, template
driven. This chapter will discuss the different types of CommonSpot templates and how they are
used to create your site. The contents of this chapter are:


Template Overview


Base Templates


Navigation Templates


Content Templates

5.1. Template Overview
Three different levels of templates combine to create the hierarchy of a CommonSpot page: base
templates, navigation templates, and content templates. The templates work together to start at
the most general level and work towards the more specific to produce the look and feel of your
site. CommonSpot templates can be thought of as “transparencies” where the highest level
templates bleed through to the lower ones so that by the time you are at the page level, the user
is seeing the sum of the parts of all templates in that inheritance structure. As an example, let’s
take a look at a partial map of the structure of the templates on the CommonSpot demo site:

Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 18

Notice that all pages and templates ultimately inherit from the ‘Base’ and ‘Base plus one’
templates. This is good CommonSpot site design, and the desired relationship for CommonSpot
templates.
5.2. Base Templates
Base templates are the foundation of any CommonSpot site. It is in the base template that the
general site structure, design and function are established. They are the “blueprint” of your site.
Unlike all other templates in CommonSpot, which are edited in your browser through the
CommonSpot interface, base templates are developed entirely in code. A typical CommonSpot
site requires only one base template (with rare exceptions) with every other page and template
ultimately deriving from that base template. The base template may contain a standard
navigational bar, a hierarchical menu, company logo, stock ticker and/or any other recurring
object. The base template is a ColdFusion module, and thus it can be created or customized
using CFM tags, HTML, DTML, JavaScript or any other standard Web technology.
5.3. Navigation Templates
Navigation templates represent the first layer of templates between the base and the content of
your site. These can be thought of as defining the “outside the white space” of your site. While
the base template defines the structure of your design, the navigational templates define the
substance of that design. In a typical CommonSpot site, the navigation templates rarely are
more than one or sometimes two templates deep in the hierarchy. However, they are essential
as the bridge between the base template and the content templates.
5.4. Content Templates
While the base template and the navigation template work in partnership to produce the “outside
the white space” of your site, the content templates structure that white space and represent the
templates that will ultimately be exposed to your content contributors. For example, your base
template may determine that your site uses a two column design with a header, your navigation
template may determine the content of that header, but the Content templates will decide what
sort of content sits on what is left. Content Templates can be as diverse and numerous as the
need of any site determines.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 19

Chapter 6 Developing the Base
Template
Getting started with your base template is getting started with your site. It is here that the
foundation of your site and the “skeleton” of your design are established. This chapter will give
you the tools you require to develop the base template for your site. The contents of this chapter
are:

Base Template Introduction


Importing HTML


Replacing Content with CommonSpot Elements


Populating the “base +1” Template


Advanced Base Template Development

6.1. Base Template Introduction
While CommonSpot does offer the ability to create and register your own base template, it is
recommended that you instead modify the one that is created with your site. When a site is
created in CommonSpot, an out-of-the-box template structure is created as well. Along with a
series of content templates, a base template is created as well, in the form of “template-
basepage.cfm” in the {yoursite}/templates/ directory. Also created is what will serve as your
main navigation template, often referred to as “base +1”, template-base-template.cfm, at the
root of your site. It is by working with these two templates -- one in code and one in the
browser -- that development of your site will begin.
Before starting development of the base template, it’s important to understand a few
characteristics of a base template:
• The base template represents the <body> section only
Although you are developing the structure of your site with HTML and CFML in the base
template, you are only dealing with the code that would normally fall between the html
<body></body> tags. Therefore, your code should not include any starting <html> or
head code. There are other ways to integrate head section code if necessary.
• CommonSpot uses enablecfoutputonly=”yes”
For internal purposes, CommonSpot uses the ColdFusion setting
enableforoutonly=”yes”. This means that all your code that needs to be output to the
browser, such as html tags and javascript, must be enclosed in <cfoutput></cfoutput>
tags. As a best practice, you should also close these outputs before executing CFML.
• Base templates only execute at render time
CommonSpot base templates are included in CommonSpot’s caching system and will
not execute on every request. Because of that, dynamic code will also be cached and
variables dependant on session, time or like variables will not perform as expected.
However, page or subsite variables are acceptable, as caching is page based.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 20

• Cache must be cleared for changes to the base template
Because the base template is cached, any time a change is made to it, the cache must be
cleared for CommonSpot pages in order for the changes to propagate. This is not the
case for CommonSpot templates, as no cache is built for templates. Clearing the cache
for base templates can be done on a page by page basis from the page and template
management menu or site/subsite level from the subsite properties in the CommonSpot
Subsite Administrator.
6.2. Importing HTML
Note: This section uses the demo site design as an example for developing a base template.
The example takes a simple design approach to the demo site, which stops short of some of the
advanced techniques used in the actual demo site construction. To learn more about the
advanced techniques used in the demo site construction, such as custom metadata layout
options, see the references in the
Advanced Base Template Development
section in this guide.
Once you understand the concept of the base template, you can begin development. For the
purpose of this guide, we are going to walk through the process of building a base template by
building the base template for the CommonSpot demo site. If you wish to follow along with this
section of the guide, you can find flat html versions of the demo site in
/commonspot/demo/html.
Start by following the directions in the preceding sections for creating a new site. Next, open
index.htm, and sub-page.htm. These two html mock-ups represent two different designs of the
site. On this demo site, as with many sites, the home page follows a significantly different
design than the rest of the site. In cases such as these, it is to the developer’s benefit to simply
ignore the home page design in the initial stages of development and concentrate on developing
the site design.
With this goal in mind, the first step is to examine the design and establish common elements,
preparing the design to become a template. Let’s take a look at sub-page.htm:

Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 21


The first step is to analyze the design in terms of CommonSpot elements, and separate the
common elements that will exist on the template from the content area of the design.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 22


By breaking up the design this way, we can see that areas 1-9 are all common navigation and
design areas, while area 10 represents the “content well”. With a plan in place, all that needs to
be done is to bring the html representing this design into the base template, and replace the
desired pieces with CommonSpot elements. Let’s take a look at that process, step by step.
Start by opening your code editor of choice and opening {yoursitedir}/templates/template-
basepage.cfm. Because this base template forms a partnership with your “base +1”, at this time
you should also open {yoursite}/template-base-template.cfm in your browser. If you are not
already logged in to CommonSpot, log in and switch in to author mode. The base+1 should
look like this in your browser:

1. Once you have your base template open in your editor, you’ll notice that the first
section of the template is commented out. This section contains instructions and tips
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 23

on developing the base template.

2. Next there will be a cfinclude like this one:

<CFINCLUDE TEMPLATE="/commonspot/pagemode/pagemodeui.cfm”>

This includes the CommonSpot UI, or the three icons found at the top of every page.
These icons can be moved wherever desired on the page, but without them content
cannot be edited.
3. Below this is presented descriptive text you should replace with your own code,
followed by a cfmodule call like this one:

<CFMODULE TEMPLATE="/commonspot/utilities/ct-render-named-element.cfm
elementtype="layout”
elementName="contentlayout”
basetemplatename="common”>

This cfmodule is calling “ct-render-named-element.cfm”, a module that will be used
anytime you wish to incorporate a CommonSpot element. However, this particular
call is unique in the sense that it is calling a CommonSpot layout element named
“contentlayout”. This will be the “white space” or “content well” of your site. The
reason for this is that all CommonSpot out-of-the-box content templates look to
define this particular element. Thus, your navigational design and site structure
should be built around this element.
4. To get started with your development, first delete the descriptive text in the template,
carefully retaining the contentlayout and the pagemodeui. Once completed, your
base template should look like this:
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 24


If you reload the base+1, you will see this:

5. Your templates are now ready to receive html. To get started, simply copy the html
code from your site design, from between the <body></body> tags, and paste it into
the base template. Remember that because CommonSpot uses
enablecfoutputonly=yes, you will need to enclose all your html with
<cfoutput></cfoutput> tags. Taking the code from the demo site design, we can
paste the code in and surround it by our <cfoutput></cfoutput> tags. Because we
are now inside of cfoutput tags, we must also be sure to double up all “#” signs in our
html code, to prevent ColdFusion errors. With that done, we can browse to the
base+1 and see something like this:
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 25


The paths to the images are naturally not correct, but the main structure of the template, and
thus the site, is already in place. The only task now is to replace those pieces of the design with
CommonSpot elements that are desirable, attach the needed style sheets, and fix any paths or
links that will remain hard-coded in the base template.
6.3. Replacing Content with CommonSpot
Elements
With the working design in place, the next step is to decide what parts of your design to bring
into CommonSpot. The idea is replace the content of your design with CommonSpot elements
while leaving the structure in your code. For example, a spacer .gif in a structural table of your
layout can stay in code, but the images of your header navigation should come into
CommonSpot. There are several reasons for this; ease of updating, avoiding the caching of the
base template for changes, and also incorporating CommonSpot’s internal systems into your
navigation so that when pages are moved or changed, or images are updated, CommonSpot’s
internal link management and image management can track them.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 26

1. The first step should be to replace your “white space”. Determining this is simply a
matter of deciding what part of your design is consistent on every page throughout
your site and what part represents the content area that will change page by page. In
our demo site design, we have already established this area to be the area we marked
as number 10. So, we can delete the html code for it from the base template and
replace it with the contentlayout:

</cfoutput><CFMODULE
TEMPLATE="/commonspot/utilities/ct-render-named-
element.cfm”
elementtype="layout”
elementName="contentlayout”
basetemplatename="common”><cfoutput>

2. The replaced section the base template will look like this:


3. Saving the base template and reloading the base+1 will look like this:

Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 27


Notice that the content area has been replaced by a layout element. This will be one element
that will not be edited in the base+1 at all, but rather be left alone to be filled by content in the
child pages.

4. The cfmodule call to ct-render-named-element is used to insert a CommonSpot
element in lieu of inline content. The elementype attribute accepts a set name that
determines the type of CommonSpot element to insert. A list of these elements can
be found in the commented area of your base template. The elementname attribute
accepts a name of your choosing. This name creates a new unique instance of the
element. The bastemplatename attribute should always be set to “common”.

Now, the same will hold true for the rest of the content in your design. For example,
the top row of images in the demo site represents the main navigation. We can delete
the html code creating it and replace it with an image grid element.

</cfoutput>
<CFMODULE TEMPLATE="/commonspot/utilities/ct-render-named-
element.cfm"
elementtype="imagegrid"
elementName="topheader"
basetemplatename="common">
<cfoutput>
5. The replaced code in our base template will look like this:
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 28


Saving and reloading the base+1 will look like this:


Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 29

6. The images of the html have been replaced by a single image grid element in
CommonSpot. This image grid can now be populated with the appropriate images
through the CommonSpot UI in the base+1.
7. This process can be repeated for each section of your design that should be brought
into CommonSpot. For example, if we refer once again to the numbered dissection of
the demo site design, the following candidates can be seen for substitution:
1. Single Image (without header)
2. Link Bar
3. Drop Down List of Links
4. Search Form
5. Single Image (without header)
6. Image Grid
7. Custom Element (global)
8. Breadcrumb
9. Formatted Text Block (without header)
8. These are just possible choices that can be made. For example, when actually
building the CommonSpot demo site, PaperThin made the choice to leave sections
1&5 as hard-coded images in the base template. For any hard-coded paths in the
base template, it must be remembered that the template code will be rendered
throughout the site, and so absolute paths should be used to reference the images:

This way, the images will render properly no matter where on the site the code is used.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 30


6.4. Populating “base +1” Template
As you replace content with CommonSpot elements, you will be able to refresh the “base +1”
template in your browser and see the UI for each element come inline to replace your content.
In order to bring your design back into place, you will need to populate this content in your
“base +1” template. While the structure of your design and the CommonSpot elements exist
within your base template, the content of those elements will be bound to this navigation
template. Since by default all existing content templates in CommonSpot will inherit from this
navigation template, content defined here will display throughout your site.
The steps to accomplish this are very simple.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 31

1. First, as you bring in each element, refresh the browser with your “base +1” to bring
up the element’s UI.
2. Next, edit the element normally to populate it with content. For example, we can
populate the image grid element that will serve as the demo site’s main navigation by
clicking on the ghost text (circled above) that is serving as the place holder for the
element, and interact with the element’s wizard (for more information on the image
grid, see the Image Grid Element section of the Content Contributor Guide. See the
Standard and Advanced Elements chapters in the Content Contributor Guide for
information on other CommonSpot elements):


3. We can then add each element in the grid as an entry in the element:
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 32


4. The image grid allows the selection of a main image, a roll-over image and a link
Define each entry of the image grid, and the navigation is done!
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 33


Refer to the CommonSpot Users Guide for details on interacting with each type of element.
5. Next, you need to determine the function of each element in relation to the rest of the
site. For example, the contentlayout will be populated on each page of your site, so it
needs to contain no content at the template level and full functionality at the page
level. Conversely, the imagegrid header needs to be fully populated at this template
level and pass no CommonSpot functionality to lower templates and pages, in order
to maintain the integrity of its design. In order to accomplish this, the element needs
to be ‘locked down’.
6. To ‘lock down’ the security for an element, navigate to the Element Inheritance
Security of the element, found under the Properties icon, and select “Restrictions”.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 34


7. In this dialogue you will get a list of the various functions of the element with check
boxes. Each check box you select will restrict that functionality from being available
at lower levels. Checking all of the boxes will ensure that the element cannot be
edited in any way at lower templates and pages.

8. Continue with this process of development in the base template and the base+1 until
you have replaced all the pieces of your design with CommonSpot elements as
appropriate and desired.
9. To complete the design of your templates, it is often necessary to incorporate a style
sheet. Style sheets in CommonSpot are enabled at the page or template level, in the
style sheet section of the page and template management menu.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 35


10. Once turned on, most element colors, alignments and other properties are controlled
through the use of styles. A default style “set” is invoked when styles are activated,
using the default.css provided by CommonSpot. Other style sheets can be added to
this style set as needed or desired. Simply save the style sheet into the
{yoursite}/style directory and navigate to the style sheet UI in page and template
management.
11. Once styles are enabled and the default style set is displayed, select “Style Sheets”
from the pencil icon next to the style set.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 36


12. From there you may select your style sheet from the list displayed:

Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 37

13. After finishing through the dialogues, styles will be enabled, and your .css will be
included in the CommonSpot pages. This will affect the class references in your base
template or in any custom code:

For further style functionality, including scheduled use of style sheets, registering classes for
end-user use and apply individual classes to CommonSpot elements, see the style sheet
reference in the Advance
d Base Template Development
section of this guide.
6.5. Advanced Base Template Development
The above process allows you to get a simple site design in place fairly rapidly. However, there
are times when the design of your site does not lend itself to such straightforward tactics.
Navigation that changes by subsite, dynamic code, or other similar variables may lead the
developer to believe that multiple templates are necessary. This is a mistake. Multiple base
templates complicate inheritance and lead to a messy, hard to maintain site. They are also
usually totally unnecessary. CommonSpot offers a variety of ways to make your base template
flexible. Here is a brief listing of a few of the more popular options. Refer to the documentation
referenced below for further details:
Head section customization
Often it is necessary for a developer to get at the head section of their site. This can be
accomplished through the use of the .head file in CommonSpot. See the section titled
‘Customizing the <head> Section’ in the Base Templates chapter in the Developer’s Guide for
details.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 38

Style Sheets
Cascading style sheets are increasingly necessary in Web site design. CommonSpot offers a
robust integration of cascading style sheets including conditional style sheet use and class
registration. See Chapter 6.1.21 of the Administrator’s Guide for details.
Render Options & Custom Metadata
Sometimes the design of a site’s very layout must be flexible. Navigation on the left on one
page, on the right on another, and not at all in still another place? No problem. Using
CommonSpot’s template render options or custom metadata gives you the flexibility to adjust
these attributes on the fly. See Chapters 7.1.5.2 & 10 of the Administrator’s Guide, 6.2.10 of
the Developer’s Guide, and Chapters 7 & 8 of the Template Developer’s Guide for details.
Template Variables
Another way to add to the flexibility of your design, template variables allow you to
incorporate subsite-specific variables into your code for automated adjustments to your base
template. See Chapter 3.6 of your Developer’s Guide for details.
Referencing ColdFusion variables and CommonSpot metadata
Referencing variables from ColdFusion and CommonSpot can be an extremely effective way to
add flexibility to your design. See Chapter 3 in the Developer’s Guide for details.
Scheduled Content
Navigation that changes by subsite or user can be one of the more common challenges in base
template design. There are several ways to resolve this, the scheduled element being the most
popular and most effective. See Chapter 1.42.6 of the Content Contributors Guide for details.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 39

Chapter 7 Developing Content
Templates
With your navigation and base templates in place, it’s time to consider how the contributors on
your site will interact with content. The tools that will guide them through the page creation
process and content insertion will be the content templates. Out of the box, CommonSpot
provides a number of content templates for immediate use by contributors in the “Simple” and
“Standard” templates. Because you used the “template-basepage.cfm”, the “template-base-
template.cfm”, and the contentlayout element, these templates already inherit your design. While
these content templates may be enough for some site implementations, they may not be for
others. For others still, they may be too much. Whatever the case, it is often necessary to provide
specialized content templates to your contributors that match your individual content needs. This
chapter is designed to walk you through that process. The contents of this chapter are:


Steps to Create a Content Template


Ghost Text


Element Inheritance

7.1. Steps to Create a Content Template
To create a content template, you must first create a page. Go through the page creation
process and choose a template for this page that most closely matches your content needs.
Usually this means selecting a fairly simply design on which you can expand. See Chapter 3 of
the Content Contributor’s Guide for more information on creating a page.
With a page in place, you will want to first drop in the elements that will make up the content of
the pages. For example, if a template was needed for news articles that would exist on your
site, you might first decide that the elements that would make up the content of your news
article would be a title, an image and a body. So along those lines, you could drop in a text-
block, an image element, and a formatted text block. Which elements you need will depends on
the different content types you will be using. Refer to the Content Contributor Guide for more
information on contributing content.
With the elements in place, you’ll want to set the attributes for those elements in ways that are
appropriate for the pages that will be derived from this template. Settings to keep in mind are:
• Properties: What layout, fonts, etc. should the elements have?
• Default Content: Should any of the elements be pre-populated with content? Is that
content going to be default or fixed?
• Styles: What classes need to be applied to the elements?
Once you have arranged the template and placed the elements to your satisfaction, publish the
entire page. With the content and the page in a current state, you are now ready to convert the
page to a template. From the page and management icon, choose “Save as template”.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 40



The resulting wizard will walk you through the process of converting the page into a template.
See the Template Developer’s Guide for more details on saving a page as a template.
Once converted, the template can be altered to provide the appropriate functionality to the
pages that will derive from it:
7.1.1. Ghost text
Each element in CommonSpot comes with default ghost text that prompts the contributor to
enter content. Something along the lines of “Click here to enter texblock content” is typical.
However, for a specialized template, it may be desirable to change this ghost text to
something more specific. For example, “Click here to enter the body of the article”. This can
be accomplished once by clicking the properties icon of the element and choosing “template
ghost text”. From here the desired ghost text can be entered.

Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 41

7.1.2. Element Inheritance
With the ghost text set and the properties set as desired, it’s time to decide which functionality
of the element needs to be exposed to the pages, and lock down the remainder. This is done
in Element Inheritance Security, through restrictions. Check all the aspects of the element that
are NOT desired to be accessible at the page level.
Once your template is complete, there is one more step to make it available to the public.
From the Page and Template Management icon, choose “Submit Template for Public Use”. Now
your template is available for general use by your content contributors. Use the Page Security
on the template, specifically “read” rights, to specify which contributors have access to use the
template.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 42

Chapter 8 Next Steps
With your base template in place, your base +1 populated, and your content templates ready to
go, what else is there? Depending on the complexity of your site, there can be a great deal left to
accomplish even before the heavy lifting of content importing. CommonSpot documentation is
designed to help you with all those tasks, but here are a few of the more common ones:

Users and Groups
One of the most important goals of a content management system is to allow your non-
technical staff to assume responsibility for creating and publishing content. In order to
accomplish this, you need to define users and groups of users in CommonSpot. See Chapter 8
of your Administrator’s Guide for details on create and managing users and groups.

Security
From read permissions to author permissions, to admin rights, CommonSpot security
determines which users and groups interact with what content and to what extent. See Chapter
18 of your Administrator Guide, and Chapter 13 of the CommonSpot User Guide for details on
setting up CommonSpot security.

Personalization
From individual elements to entire pages, CommonSpot has robust mechanisms in place to allow
you to serve up individualized and targeted content. See Chapter 6.1.22 of the Administrator’s
guide and 1.42.6 of the Content Contributor’s guide for more information on content
personalization.

Content Reuse
Although much of CommonSpot’s content is bound to the pages on which it is created, there are
ways to share and syndicate your content, namely through Custom Elements. See Chapter 11 of
the Administrator’s Guide for more information on custom elements.

Template and Elements
As you develop your site, you will likely want to create a series of templates specific to your
needs, to ensure a consistent look and feel. See the Template Develop’s Guide for more
information on templates. CommonSpot also provides more than 50 out of the box elements,
including text block elements, simple forms and datasheets, image elements, page set elements,
Flash, MS Word and many more. These items can be easily dropped onto templates and pages,
facilitating the content creation process. See Chapter’s 6, 7, and 8 of the Content Contributor’s
Guide for more information on elements.

Managing and Creating Pages
Fundamental to CommonSpot is the process for creating pages. See Chapter 3 of the Content
Contributor’s Guide for information on managing and creating pages. For details on authoring
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


CommonSpot Getting Started 43

content, see the Content Contributor’s Guide.

Approval Process
When there is a need for a workflow and control over the content that is published to a Web site,
there is a need for an approval process. See chapter 6.1.4 of the Administrator’s Guide for more
information on CommonSpot’s approval process.
Copyright 1998-2005 PaperThin, Inc. All rights reserved.


Copyright 1998-2005 PaperThin, Inc. All rights reserved.

CommonSpot Getting Started 44

Chapter 9 PaperThin Resources
PaperThin offers a full range of professional services to help you further leverage your investment
in CommonSpot. Whether it is architecting and designing your site, customizing CommonSpot's
inherent capabilities, building specialized components, integrating critical business applications
or helping you to install and train, PaperThin has the experience and knowledge to assist with
your efforts. The contents of this chapter are:


Contacting PaperThin


Technical Support


Sales


For more information about PaperThin‘s Professional Services visit us at
www.paperthin.com
.
9.1. Contacting PaperThin
PaperThin, Inc.
300 Congress Street, Suite 303
Quincy, MA 02169
Phone: 617.471.4440
Fax: 617.471.4465
http://www.paperthin.com
9.2. Technical Support
Technical Support is available Monday through Friday 7:00 a.m. to 7:00 p.m. EST, except
holidays. Full details of support plans and options can be found on our Web site at
http://www.paperthin.com/support.
9.3. Sales
Phone: 617.471.4440 (option 1)
Fax: 617.471.4465
E-mail:
sales@paperthin.com