1
Template Creation Tutorial
Overview: The Files
Template Control File: The Template Control File (.tcf) will generate a form of text your user will want
inserted directly into the new page, such as title and keywords. You may have as many or as few form
fields as you like.
New Page Template: The New Page Template contains the HTML for your new blank template. It must
be saved with the extension .tmpl, but it can be named anything you like. This page also contains the
codes that will tell the Template Control File (.tcf) what and where to insert the text the user defines.
New Page Thumbnail: The New Page Thumbnail image is a small picture that represents your new
template; it will appear on the "Create New Page" page, where it and all other thumbnails will be listed
alphabetically. It can look like anything you want it to, but it must be saved as a .gif file, and it must have
the same file name as the Template Control File (.tcf).
Step One: Creating a "Template Control File"
1. Open your choice of text editor.
2. Copy and paste the following code to use as an example (the parts in red are editable -- or, you could
remove an entire line):
<title>New Page Creation</title>
<variable-list>
<variable name="title" prompt="Page Title" alt="Give your new web page
a title."></variable>
<variable name="subtitle" prompt="Subtitle" alt="Give your new web
page a subtitle."></variable>
<variable name="metakey" prompt="Keywords" alt="Words that categorize
your new page for search engines."></variable>
<variable name="metadesc" prompt="Description" alt="Describe your new
page in about 40 words."></variable>
</variable-list>
<template-list>
<template prompt-prefix="New File"
preferred-redirect="yes">templatename.tmpl</template>
</template-list>
3. Edit the code you just pasted to reflect what you want users to enter into their new page. For
example, if you have no use for a subtitle, you might remove the following line completely:
<variable name="subtitle" prompt="Subtitle" alt="Give your new web
page a subtitle."></variable>
2
In addition, you can add your own variables to the Template Control File. Say you want the user to be
able to insert their name at the bottom of the page. You would create a variable line that looks
something like this:
<variable name="name" prompt="Your Name" alt="Enter your name to be
displayed on the page."></variable>
Where each of these variable values shows up on the actual page is something we'll look at when
creating the New Page Template.
4. Save the file as whatever file name you like, with the extension .tcf . It is suggested you use something
descriptive of the page it goes with. For example, if your new page is for the "Admissions" section of
your site, you may want to name it admissions.tcf .
Were you to use the coding exactly as is seen in the example in #2, this is what it would look like when
parsed by your browser:
Step Two: Creating the New Page Template (HTML)
1. Open the text editor of your choice, and open the HTML file you want to base your New Page
Template on.
2. Remove all text you don't want to be pre-existing when the user creates their new page.
3. Add the appropriate tagging to server-side includes and regions you want the user to be able to edit
in OmniUpdate. Please note that include files must exist on both the staging and live servers. The
tagging for includes looks like this:
3
<!-- com.omniupdate.div label="IncludeName" path="includeurl.html" -->
<!--#INCLUDE VIRTUAL="includeurl.html" -->
<!-- /com.omniupdate.div -->
And your editable regions should have this code:
<!-- com.omniupdate.div label="Area Name" group="z-areaname"
button="Editing Button Number" -->
<!-- com.omniupdate.editor csspath="cssurl.css"
cssmenu="cssmenuurl.txt" -->
Editable text in here.
<!-- /com.omniupdate.div -->
4. Because the Template Control File allows users to include some pre-defined text on their new page,
you'll need to insert an echo tag wherever that text will go. For example, if you have a field in the .tcf for
the user to enter the title that looks like this:
<variable name="title" prompt="Page Title" alt="Give your new web page
a title."></variable>
...then in your New Page Template HTML, wherever you want that title to go, you will need to put an
echo tag that looks like this:
<!--%echo var="title" -->
This echo tag can go inside tables, DIVs, etc. -- wherever the plain old text would go.
5. You'll need to save your New Page Template with the same "New File" name you used for the
Template Control File (.tcf). In your .tcf file should be this block of coding:
<template-list>
<template prompt-prefix="New File" preferredredirect="
yes">templatename.tmpl</template>
</template-list>
You can name this New Page Template (.tmpl) file whatever you like, as long as it's the same as the file
name between the template tags. For simplicity's sake, you might consider giving all three files -
Template Control File, New Page Template, and New Page Thumbnail -- the same name.
Step Three: Creating New Page Thumbnails
1. Open the image editing program of your choice.
2. Create an image that represents your new page. There are no restrictions on size or appearance. Two
popular options are to have it look like a small screen
pertaining to the new page, as in the following examples:
3. Save the file as a .gif file. Be sure that the file name of your
Template Control File (.tcf).
Upload & Implementation
1. Once created, the three files -- .tcf
Where you store the templates will be up to you. In most cases, you will upload the template to the
production server, typically in a folder called "wsatemplates". If you have SuperAdmin access, you have
the option of uploading the template files to the OMNI
on the staging server.
2. You'll need to direct OmniUpdate to the folder in which you
this, you must visit Setup > Web Sites > Edit:
Then you'll need to change the folder under "Templates" to reflect where your template files are stored:
4
capture of the page, or to simply have text
.gif matches the file name of your
tcf, .tmpl, and .gif -- need to be uploaded to the template directory.
lder OMNI-INF/templates folder, found in your root folder
you've decided to store your templates. To do
've
5
3. Users, when visiting the "Create New Page" page, can n
uploaded. If you want to assign certain templates to certain folders on the site, you'll need to create
template groups. Within OmniUpdate, visit the "Setup" tab,
Click on "New Template Group" to start.
You can have from one to as many templates as you'd like within a single group. It's generally helpful to
start by putting each template into a group of its own.
4. To assign a template to a certain folder, visit the
the "Access" button to the right of it.
6
now pick from any of the templates you've
and then click on the "Templates" button.
"Page Editor" tab, browse to that folder, and click on
ow
Select the radio button "This folder and all existing items within"; then, at the bottom, check the
"Update" option next to "Templates", and then select the te
its items/subfolders from the drop-
7
template you want to apply to that folder and
-down list. When you've made your selection, click "Save".
mplate
Finish
Your templates are now ready to use! To create a new page with your n
1. Click on the "File Manager" tab, browse to a folder to which you have assigned a template, and click
on the "New Page" button at the top.
2. Click on the image representing the template you want to use. Remember, which templates are
available is determined by you when creating te
3. You will now be given a short form for you to enter pre
title and keywords); after pressing the "Create" button at the bottom of the form, you'll be taken to your
new page to begin editing.
8
new template:
er" template groups, as described above.
pre-defined variables concerning the page (like
Template Creation Tutorial
Overview: The Files
Template Control File: The Template Control File (.tcf) will generate a form of text your user will want
inserted directly into the new page, such as title and keywords. You may have as many or as few form
fields as you like.
New Page Template: The New Page Template contains the HTML for your new blank template. It must
be saved with the extension .tmpl, but it can be named anything you like. This page also contains the
codes that will tell the Template Control File (.tcf) what and where to insert the text the user defines.
New Page Thumbnail: The New Page Thumbnail image is a small picture that represents your new
template; it will appear on the "Create New Page" page, where it and all other thumbnails will be listed
alphabetically. It can look like anything you want it to, but it must be saved as a .gif file, and it must have
the same file name as the Template Control File (.tcf).
Step One: Creating a "Template Control File"
1. Open your choice of text editor.
2. Copy and paste the following code to use as an example (the parts in red are editable -- or, you could
remove an entire line):
<title>New Page Creation</title>
<variable-list>
<variable name="title" prompt="Page Title" alt="Give your new web page
a title."></variable>
<variable name="subtitle" prompt="Subtitle" alt="Give your new web
page a subtitle."></variable>
<variable name="metakey" prompt="Keywords" alt="Words that categorize
your new page for search engines."></variable>
<variable name="metadesc" prompt="Description" alt="Describe your new
page in about 40 words."></variable>
</variable-list>
<template-list>
<template prompt-prefix="New File"
preferred-redirect="yes">templatename.tmpl</template>
</template-list>
3. Edit the code you just pasted to reflect what you want users to enter into their new page. For
example, if you have no use for a subtitle, you might remove the following line completely:
<variable name="subtitle" prompt="Subtitle" alt="Give your new web
page a subtitle."></variable>
2
In addition, you can add your own variables to the Template Control File. Say you want the user to be
able to insert their name at the bottom of the page. You would create a variable line that looks
something like this:
<variable name="name" prompt="Your Name" alt="Enter your name to be
displayed on the page."></variable>
Where each of these variable values shows up on the actual page is something we'll look at when
creating the New Page Template.
4. Save the file as whatever file name you like, with the extension .tcf . It is suggested you use something
descriptive of the page it goes with. For example, if your new page is for the "Admissions" section of
your site, you may want to name it admissions.tcf .
Were you to use the coding exactly as is seen in the example in #2, this is what it would look like when
parsed by your browser:
Step Two: Creating the New Page Template (HTML)
1. Open the text editor of your choice, and open the HTML file you want to base your New Page
Template on.
2. Remove all text you don't want to be pre-existing when the user creates their new page.
3. Add the appropriate tagging to server-side includes and regions you want the user to be able to edit
in OmniUpdate. Please note that include files must exist on both the staging and live servers. The
tagging for includes looks like this:
3
<!-- com.omniupdate.div label="IncludeName" path="includeurl.html" -->
<!--#INCLUDE VIRTUAL="includeurl.html" -->
<!-- /com.omniupdate.div -->
And your editable regions should have this code:
<!-- com.omniupdate.div label="Area Name" group="z-areaname"
button="Editing Button Number" -->
<!-- com.omniupdate.editor csspath="cssurl.css"
cssmenu="cssmenuurl.txt" -->
Editable text in here.
<!-- /com.omniupdate.div -->
4. Because the Template Control File allows users to include some pre-defined text on their new page,
you'll need to insert an echo tag wherever that text will go. For example, if you have a field in the .tcf for
the user to enter the title that looks like this:
<variable name="title" prompt="Page Title" alt="Give your new web page
a title."></variable>
...then in your New Page Template HTML, wherever you want that title to go, you will need to put an
echo tag that looks like this:
<!--%echo var="title" -->
This echo tag can go inside tables, DIVs, etc. -- wherever the plain old text would go.
5. You'll need to save your New Page Template with the same "New File" name you used for the
Template Control File (.tcf). In your .tcf file should be this block of coding:
<template-list>
<template prompt-prefix="New File" preferredredirect="
yes">templatename.tmpl</template>
</template-list>
You can name this New Page Template (.tmpl) file whatever you like, as long as it's the same as the file
name between the template tags. For simplicity's sake, you might consider giving all three files -
Template Control File, New Page Template, and New Page Thumbnail -- the same name.
Step Three: Creating New Page Thumbnails
1. Open the image editing program of your choice.
2. Create an image that represents your new page. There are no restrictions on size or appearance. Two
popular options are to have it look like a small screen
pertaining to the new page, as in the following examples:
3. Save the file as a .gif file. Be sure that the file name of your
Template Control File (.tcf).
Upload & Implementation
1. Once created, the three files -- .tcf
Where you store the templates will be up to you. In most cases, you will upload the template to the
production server, typically in a folder called "wsatemplates". If you have SuperAdmin access, you have
the option of uploading the template files to the OMNI
on the staging server.
2. You'll need to direct OmniUpdate to the folder in which you
this, you must visit Setup > Web Sites > Edit:
Then you'll need to change the folder under "Templates" to reflect where your template files are stored:
4
capture of the page, or to simply have text
.gif matches the file name of your
tcf, .tmpl, and .gif -- need to be uploaded to the template directory.
lder OMNI-INF/templates folder, found in your root folder
you've decided to store your templates. To do
've
5
3. Users, when visiting the "Create New Page" page, can n
uploaded. If you want to assign certain templates to certain folders on the site, you'll need to create
template groups. Within OmniUpdate, visit the "Setup" tab,
Click on "New Template Group" to start.
You can have from one to as many templates as you'd like within a single group. It's generally helpful to
start by putting each template into a group of its own.
4. To assign a template to a certain folder, visit the
the "Access" button to the right of it.
6
now pick from any of the templates you've
and then click on the "Templates" button.
"Page Editor" tab, browse to that folder, and click on
ow
Select the radio button "This folder and all existing items within"; then, at the bottom, check the
"Update" option next to "Templates", and then select the te
its items/subfolders from the drop-
7
template you want to apply to that folder and
-down list. When you've made your selection, click "Save".
mplate
Finish
Your templates are now ready to use! To create a new page with your n
1. Click on the "File Manager" tab, browse to a folder to which you have assigned a template, and click
on the "New Page" button at the top.
2. Click on the image representing the template you want to use. Remember, which templates are
available is determined by you when creating te
3. You will now be given a short form for you to enter pre
title and keywords); after pressing the "Create" button at the bottom of the form, you'll be taken to your
new page to begin editing.
8
new template:
er" template groups, as described above.
pre-defined variables concerning the page (like
No comments:
Post a Comment