Publish Template

Before users can create pages using Publish Application, at least one template need to be uploaded from publish admin panel. Claromentis recognise editable areas by detecting custom tags with prefix e_

Formula : e_xxxx

Example: e_title, e_content, e_picture

To upload the template it is essential that the components of the template, images, javascripts, css files (these need to be stored in a single sub folder) and the screenshot in .jpg or .gif format be zipped into a single archive. Example Archive Content:

/images
template.html
screenshot.jpg

String editable area is ideal for a short text which requires no user formatting. Commonly used for page titles where formatting is controlled by template. Html codes are permitted.

<txt name="e_string" pub_type="string">type string here</txt>

Text type is the most common editable area for typical page content. Claromentis utilises FCK Editor to provide WYSIWYG functionailty, some of which is like “MS Word” like editing which most of us are familiar with. With this type of editor text can be formatted, tables added, image manipulated, they can also can be inserted from within your document store.

<txt name="e_main_text" pub_type="text">type content here</txt>

Plain text editable area is a Text type editable area without FCK Editor. With this type, user has to write html codes to do formatting.

<txt name="e_content" pub_type="plain_text">plain text here</txt>

Used for images, suitable for fixed size images only. Image has to be uploaded from local computer. There is no ability to resize the image as well as pick an image stored in the document repository.

<img src="images/filename.jpg" name="e_banner">

Include filea are commonly used by web developers as an effective way to avoid code duplication. For example web page headers can be made into separate files which then can be included in the main content page. With this method only one header file is needed to be maintained rather than on every single page. This is a special type of editable area where users can then define other file to be included on the page itself.

<txt name="e_page_header" pub_type="include_file">header.php</txt>

Most of public website has invisible head tag such as title, and Meta tags. This type of tag can also be made editable. Only applicable to non-frame layout.

Example code to make html title editable by Publish

<title name=”e_pagetitle”>My Web page</title>

Publish recognises Meta tags for description and keywords on the template and make them editable by default. e_tags is not required.

<meta name="description" content="The best fruit shop in the world">
<meta name="keywords" content="fruit, apple, online shop, e-commerce, grapes, oranges">

You can insert special edit me tag which allows user to edit the page simply by clicking on “edit me” link at the bottom of the page. This link will only visible to the user who has at least edit right.

<div name="e_cla_editme" style="font-size:10px; margin-top:10px;"><a href="#" name="e_cla_editme_link">[+] edit me</a></div>

You can display several page properties on the page itself such as the owner of the page, what version and when it was last modified.

 
<div class="infobox">
This page is maintained by: <a name="e_cla_owner_href"><txt name="e_cla_owner">Owner name</txt></a>, 
Current version is: <txt name="e_cla_version"></txt>, 
Last Modified : <txt name="e_cla_lastmodified"></txt>, by <a name="e_cla_lastmodified_by_href"><txt name="e_cla_lastmodified_by">Editor name</txt></a>
</div>

Page tools can be used to replace Edit Me link, it provides more range of actions which can be performed on the page.

<component name="e_cla_page_tools" tools="edit_page, monitor, notifyme, email, view_properties, add_page">

Since 5.3, CSS for typeface used in publish page is managed globaly from top level folder properties.

A template can call this global CSS by inserting code below at the top of the template structure.

<link name="cla_publish_css">

During the creation of the template, sometime a designer would like to place all CSS classes and ID which control the layout of the page in one centralised location. If you would like to use centralised stylesheet for the layout, this can be done by uploading CSS file directly on the server for example to this location.

/interface_{custom}/css/pages.css

and add link to this stylesheet from the template:

  <!--@head@
  <link href="/interface_{custom}/css/pages.css" rel="stylesheet" type="text/css">
  -->

by using

  <!--@head@
  -->

the link to the stylesheet file will be placed within <head></head> tag to comply with standards.

<link name="cla_publish_css">
<!--@head@
<link href="/interface_{custom}/css/pages.css" rel="stylesheet" type="text/css">
-->
<div>
<h1 name="e_title" pub_type="string">Type Title Here</h1>
</div>
<div>
<txt name="e_empty" pub_type="text">Type Content Here</txt>
</div>
<div name="e_cla_editme" style="font-size:10px; margin-top:10px;"><a href="#" name="e_cla_editme_link">[+] edit me</a></div>