Warning
1. The content of this page is mostly obsolete. 2. Should this be on themes.tiki.org instead as per Where ?
Smarty
Tiki uses Smarty template engine
HTML
Minimal Conforming HTML5 Template
Copy to clipboard
<!DOCTYPE html> <html> <head> <title>Conforming HTML5 Template</title> </head> <body> </body> </html>
General layout of a template:
Tiki's main template file is tiki.tpl
Tiki CSS Layout schema
Plugin Image
The "id" parameter is not allowed unless "file_galleries_redirect_from_image_gallery" preference is enabled.
Older stuff
[+]
Template includes
Title
Smarty : templates/tiki-edit_blog.tpl
Copy to clipboard
{title help="Blogs" url="tiki-edit_blog.php?blogId=$blogId" admpage="blogs"} {tr}Edit Blog:{/tr} {$title}{/title}
Find
Smarty : templates/tiki-admin_forums.tpl
Copy to clipboard
{if $channels or ($find ne '')} {include file='find.tpl' _sort_mode='y'} {/if}
Include TPL
Smarty : templates/tiki-view_tracker.tpl
Copy to clipboard
{include file='tracker_item_field_input.tpl'} <= Using simple quote calling TPL without variable {include file="$checkbox.tpl"} <= Using double quote when calling TPL with variable
Remarksbox
Smarty : tiki-mods.tpl
Copy to clipboard
{remarksbox type="tip" title="{tr}Tip{/tr}"} {tr}Tiki "mods" are additional features not included in the public release. Learn more at <a target="tikihelp" href="htt+p://mods.tiki.org">mods.tiki.org</a>.{/tr} {/remarksbox}
Buttons
Smarty : tiki-syslog.tpl
Copy to clipboard
<div class="navbar"> or <div id="page-bar"> {button _text="{tr}Log SQL{/tr}" href="tiki-sqllog.php"} </div>
or (if not in navbar or page-bar)
Smarty : tiki-syslog.tpl
Copy to clipboard
{button _text="{tr}Log SQL{/tr}" href="tiki-sqllog.php"}
Tables
Definition of a table
Smarty : tiki-syslog.tpl
Copy to clipboard
{cycle values="even,odd" print=false} <table class="normal"> <tr class="head"> <th>......</th> </tr> <tr class="{cycle}"> <td>.......</td> </tr> ... </table>
Table can have different classes
- normal: is usually a 100% large, with a border, the table is used to list items
- formcolor: is usually a 100% large, with a border, the table is used in a form
td classes and styles
td can have a class depending of the type of the content
- checkbox: for a column with checkboxes for selecting some values
- action: for a list of action (usually can not be wrapped - or have a limited size
- char: for a single character e.g. {text-align: right}
- integer: {text-align: right}
- icon: for one icon
- email: {text-align: "@"}
- floatnum: {text-align: "."}
- date: ...should we add "longdate" and "shortdate" ?
- username: for names. E.g in bold
- norecords: for table with no records
- id: for id {text-align: center}
- ...
By default a td with no class is for text = left align
Notes:
- Avoid inline styles if possible (inline styles are possible if they are required to keep the page structure consistent). No inline style should specify size, colour or fonts.