Documentation Download as PDF

Modifying a Theme via FTP

For most users, the Theme Editor will provide enough functionality for day-to-day modifications of the design. However, more advanced users may require greater control over the template files. Full control when editing templates is achieved by editing files locally on your computer and uploading via FTP. This is simple for anyone who is comfortable with HTML and CSS as well as FTP. Each theme is completely self-contained in its own directory so one needs only to download the files from their current theme’s directory and upload new/modified file to this directory to update the theme. All themes are located in /templates. This folder contains a directory for each theme as well as the following directories:

  • /templates/common – This directory holds JavaScript framework files that would be redundant to have in each individual theme folder.
  • /templates/default – These are the theme files for the administration panel. Editing is rarely if ever necessary.

Template File Descriptions

All filenames in released themes are self-explanatory, for the most part. Below is a table detailing the purpose of each standard template file (outside of the /core directory which contains files that are only for experts to edit because of essential template markup):

Template Description
404.html Displays the standard File Not Found page.
article.html Displays an article or page. Variables include title, body, date, etc. Custom article fields can be accessed like articlecustom_[custom field name] or topiccustom_[custom field name].
error.html Displays a system error.
file.html Displays a file download page. Variables include title, summary, filesize, downloadlink, etc.
footer.html Displays the bottom wrapper of each HTML page (by default).
form.html Displays a frontend form (ex. contact form) as created/managed in Content > Forms in the control panel.
frontpage.html The site's home page. By default, most Caribou site's are blog style and therefore the front page closely reflects a standard topic page.
gallery.html Displays the main page for an image gallery with all thumbnail images of the gallery and other variables such as title and summary.
gallery_image.html Displayed when the user accesses a single gallery image. By default, the gallery is sortable with Next & Previous links.
header.html Displays the top wrapper for all pages (by default). Navigation is likely outputted here dynamically. Also includes a logo.
restricted.html Displayed to a user upon a user permission error (ie. content has been restricted to a certain user group and this user is either not logged in or not in the user group). By default, this page simply loads the user_login.html template with a "restricted" error message.
results.html Displays product and content search results from a search.
search.html Displays an advanced search page with topic, publish date, and keyword fields.
store_cart.html Displays a user's shopping cart.
store_category.html Displays either the store frontpage (with all sub-categories and products) or a specific store category page (with all sub-categories and products).
store_product.html Displays a single product page. Includes an "Add to Cart" form, product images, full description, etc.
thankyou.html Displayed to a user upon successful purchase or free trial signup for both store purchases and subscriptions.
topic.html Displays a main topic page.
user_home.html Displayed at the user's Account Management homepage. Includes all relevant account management links, a list of active subscriptions, etc.
user_login.html Displays a login form as well as links for user registration or forgotten password retrieval.
xml_feed.xml Displays an RSS feed as setup in the control panel in Content > Feeds.

Template Variables

There are thousands of variables available in the Caribou system and many are page-specific. To understand what variables are available for use in each template (e.g. when viewing an article, or displaying a topic page), use the following tips:

  • Look at the existing template. Templates are generally very inclusive in their use of variables to show template editors what sort of data is available.
  • Use the Theme Editor. Navigate to the page in the Theme Editor and select “edit this template”. On the right hand side will be a list of all variables available in the template.
  • For content files, examine /includes/class.content.php to see the array returned for each piece of content. These arrays are passed on to the templates and can be used in anyway. For an example, check out the extremely simplified code snippet below:
    class Content
    {
    	function Article () {
    		// database and processing code would be here
    		$array = array(
    			‘title’ => $article[‘title’],
    			‘body’ => $article[‘body’],
    			‘authorusername’ => $article[‘authorusername’],
    			‘date’ =>format_date($article[‘date’])
    			);
    		return $array;
    	}
    }

    By examining this function, it’s clear that variables “title”, “body”, “authorusername”, and “date” are available in the template. Your article.html template file may look something like:

    {include file=”header.html” title=$title}
    <h1>{$title}</h1>
    <div class=”byline”>Published {$date} by {$authorusername}</div>
    <div class=”body”>{$body}</div>
    {include file=”footer.html”}
  • For non-content items such as store items, use the above process to examine /includes/class.store.php.