Example template with tree menu

(Difference between revisions)
Jump to: navigation, search
Line 6: Line 6:
 
I create a new module for every web site. For example, let's say I am creating a site www.example.com.
 
I create a new module for every web site. For example, let's say I am creating a site www.example.com.
  
First I create a new folder <tt>/sites/example</tt>, set its "Title" (it is displayd then in workplace as the name of the site),
+
First I create a new folder <tt>/sites/example</tt>, set its "Title" (it is displayed then in workplace as the name of the site),
 
edit <tt>opencms-system.xml</tt> to addd mapping for it, restart tomcat.
 
edit <tt>opencms-system.xml</tt> to addd mapping for it, restart tomcat.
  
 
Then I create the module. I go to '''Administration''' - '''Module management''', click '''New module''', fill '''Package name'''
 
Then I create the module. I go to '''Administration''' - '''Module management''', click '''New module''', fill '''Package name'''
as <tt>com.example.site</tt>, check all checkboxes for creating folders..
+
as <tt>com.example.site</tt>, check all checkboxes for creating folders.
  
 
Then I go to '''Module Resources''' and I add a new resource <tt>/sites/example</tt> so that the site pages are part of the module.
 
Then I go to '''Module Resources''' and I add a new resource <tt>/sites/example</tt> so that the site pages are part of the module.
Line 38: Line 38:
  
 
The '''file="search"''' causes that the title of the index.html file be inherited from the parent folder, so it cannot be incosistent.
 
The '''file="search"''' causes that the title of the index.html file be inherited from the parent folder, so it cannot be incosistent.
 +
 +
== Template structure ==
 +
 +
A basic page template then may look like this:
 +
<source lang="html4strict">
 +
<%@page buffer="none" session="false"  %>
 +
<%@ taglib prefix="cms" uri="http://www.opencms.org/taglib/cms" %>
 +
<cms:template element="head">
 +
<html>
 +
<head>
 +
    <title><cms:property name="Title" file="search" escapeHtml="true"/></title>
 +
    <cms:editable/>
 +
</head>
 +
<body>   
 +
<h1><cms:property name="Title" file="search" escapeHtml="true"/></h1>
 +
</cms:template>
 +
<cms:template element="body">
 +
        <cms:include element="body" editable="true"/>
 +
</cms:template>
 +
<cms:template element="foot">
 +
</body>
 +
</html>
 +
</cms:template>
 +
</source>
 +
 +
This page has no menu, but it does have a header, a footer, a body with a h1 heading matching the page title, and an area for body content.

Revision as of 12:06, 22 January 2010

Here is an example of a page template, which has a navigational menu generated as a tree from folder structure.

Contents

Location of template

A new module for a site

I create a new module for every web site. For example, let's say I am creating a site www.example.com.

First I create a new folder /sites/example, set its "Title" (it is displayed then in workplace as the name of the site), edit opencms-system.xml to addd mapping for it, restart tomcat.

Then I create the module. I go to Administration - Module management, click New module, fill Package name as com.example.site, check all checkboxes for creating folders.

Then I go to Module Resources and I add a new resource /sites/example so that the site pages are part of the module.

Template and resources location

The template then should be located in the /system/modules/com.example.site/templates/ folder.

The images, CSS and JavaScript files it uses shoudl be located in the /system/modules/com.example.site/resources/ folder. It is good to set the export property on that folder to true, so they are exported from database to a static file to improve speed.

Page title and index.html files

I was solving the problem of index.html and navigation in OpenCMS for years and here is my solution.

The problem is, that when you nave a folder with set navigation, it can have a Title and a NavText properties. But it should also contain a file index.html which can also have a Title and a NavText. These can be inconsistent with the setting of the folder.

My solution is , that I set Title and NavText on the folder, but I do not set Title and NavText on the index.html.

In the page template, I use

<title> <cms:property name="Title" file="search" escapeHtml="true" /></title>

The file="search" causes that the title of the index.html file be inherited from the parent folder, so it cannot be incosistent.

Template structure

A basic page template then may look like this:

<%@page buffer="none" session="false"  %>
<%@ taglib prefix="cms" uri="http://www.opencms.org/taglib/cms" %>
<cms:template element="head">
<html>
<head> 
    <title><cms:property name="Title" file="search" escapeHtml="true"/></title>
    <cms:editable/>
</head>
<body>    
 <h1><cms:property name="Title" file="search" escapeHtml="true"/></h1>
</cms:template>
<cms:template element="body">
        <cms:include element="body" editable="true"/>
</cms:template>
<cms:template element="foot">
</body>
</html>
</cms:template>

This page has no menu, but it does have a header, a footer, a body with a h1 heading matching the page title, and an area for body content.

Personal tools
Namespaces
Variants
Actions
Navigation
Toolbox