Hifitesten

Page title

<title>{sitename} - {title}</title>

For each page using this template, these tags are replaced with the site name you specify in Site Admin/Global settings and the title you specify when you add/edit each page.

Read more about the {sitename} and {title} tags in Extensions/Tags in the Admin Panel.

Metadata

{metadata}

This tag adds to your page any metadata that you have specified in Site Admin/Global settings and also page specific metadata that you can add under the Options tab when adding/editing a page.

It is also used for knowing the base folder for your site when using pretty URLs. So don't remove this if you use Pretty URLs!

Read more about the {metadata}tag in Extensions/Tags in the Admin Panel.

Stylesheets

{stylesheet}

This tag links to all stylesheets that you have attached to a template. It means that you only have to add this tag once and all attached stylesheets will be linked to automatically.

Read more about the {stylesheet} tag in Extensions/Tags in the Admin Panel.

Relational links

{cms_selflink dir="start" rellink=1}
{cms_selflink dir="prev" rellink=1}
{cms_selflink dir="next" rellink=1}

These are relational links for interconnections between pages, which is good for accessibility and Search Engine Optmization

Read more about the {cms_selflink} tag in Extensions/Tags in the Admin Panel.

Page width in Internet Explorer

{literal}
<script type="text/JavaScript">
<!--
//pass min and max -measured against window width
function P7_MinMaxW(a,b){
	var nw="auto",w=document.documentElement.clientWidth;
	if(w>=b){nw=b+"px";}if(w<=a){nw=a+"px";}return nw;
}
//-->
</script>
<!--[if lte IE 6]>
<style type="text/css">
#pagewrapper {width:expression(P7_MinMaxW(720,950));}
#container {height: 1%;}
</style>
<![endif]-->
{/literal}

This isn't a tag really, but displays how to insert JavaScript in a CMSMS template.

The default templates use elastic page width. But Internet Explorer doesn't understand min-width and max-width, so for that browser the min and max page width is set with this JavaScript. For other browsers the page width is set in the stylesheets beginning with "Layout: ..."

Skip links for accessibility

{anchor anchor='main' title='Skip to content' accesskey='s' text='Skip to content'}

Anchor links (links to an anchor in the same page) are inserted with the {anchor} tag. In the default templates this is used for skip links that are visible to screen readers, but hidden with CSS to visual browsers.

Read more about the {anchor} tag in Extensions/Tags in the Admin Panel.

Header with logo image that links to default page

{cms_selflink dir="start" text="$sitename"}

In the <h1> tag (hidden by CSS) is a link to the page that is selected as the default page. The dir="start" parameter in the {cms_selflink} tag is used for this. To get the site name as the text for the link, the $sitename variable is used.

Read more about the {cms_selflink} tag in Extensions/Tags in the Admin Panel.

Search

{search}

To insert a search form on your site, simply use the {search} tag. Search is actually a module and should therefore be called as a parameter in the {cms_module} tag, like this: {cms_module module='search'}. But to simplify matters, we did a wrapper tag so that it's easier to remember.

Read more about the Search module in Extensions/Modules in the Admin Panel.

Breadcrumbs

{breadcrumbs starttext='You are here' root='Home' delimiter='»'}

Breadcrumbs is a path to the current page. In the default templates we have chosen to put the text 'You are here' before the path and force 'Home' to always be the root in the path, even if it isn't. With the delimiter parameter you can select the delimiter that separates entries in the path.

Read more about the {breadcrumbs} tag in Extensions/Tags in the Admin Panel.

Navigation

{menu template='simple navigation.tpl' collapse='1'}

This is how you insert a menu where you want it to appear. Like the {search} tag, this is actually just a wrapper tag, as the Menu Manager is a module.

In the default templates the menu manager template that is used for the menus are stored in files. That's why you see the .tpl extension in the templare parameter. But you can easily import menu templates to the database and edit them directly in the Admin Panel. Then you simply omit the .tpl extension in the tempalte parameter.

Read more about the Menu Manager module in Extensions/Modules in the Admin Panel.

News

{news number='3' detailpage='news'}

This tag will display the last three news articles. When clicking a news article to read the details, it is opened on the page with the page alias 'news'. That's what the detailpage parameter is doing.

Like all core modules there is a wrapper tag for the News module, to make it easier to use.

Read more about the News module tag in Extensions/News in the Admin Panel.

Print button

{print showbutton=true script=true}

The {print} tag is used to insert a print link. With the showbutton parameter set to true we have told the tag to output a button instead of text. The script parameter set to true means a the print dialog window opens when clicking the button, for immediate printing.

The {print} tag prints everything that is in your {content} tag, that is only the content for a page.

Read more about the {print} tag in Extensions/Tags in the Admin Panel.

Page content

<h2>{title}</h2>
{content}

Maybe the most important tag in your template. Where you put the {content} is where the content for your page will appear.

We have also chosen to put the page title on every page (the {title} tag), so that you don't have to put that in the content for every page.

Read more about the {content} and {title} tags in Extensions/Tags in the Admin Panel.

Previous/next links

{anchor anchor='main' text='^ Top'}
{cms_selflink dir="previous" label="Previous page: "}
{cms_selflink dir="next"}

Some more internal links. These are using the dir parameter to link to the previous and next pages in the page hierarchy (separators and section headers will be omitted as they are no pages).

Page footer

{global_content name='footer'}

Instead of bloating your template with lots of code you can put some code in a Global Content Block. Then call that Global Content Block with the {global_content} tag. It's also useful for content or HTML code that is reused on several pages or templates.

In the default templates we have put the footer text in a Global Content Block with the name 'footer'. You find the Global Content Blocks in the Content menu in the Admin Panel.

Read more about the {global_content} tag in Extensions/Tags in the Admin Panel.