Topics

Theme Template Structure

Overview
This guide will show how to set up a theme in Exponent CMS 2.0. It covers how to best interact with the system, and make the most out of your Exponent project.

Parts and Pieces
An Exponent website ban be broken down in to two major components: themes and views. Themes (also known as Theme Variations and Subthemes) comprise the overall structural framework (HTML and CSS defining columns, header, foot, etc..), of the website, while views (smarty templates) display a particular module’s content (news, text, blog, etc..). The theme file itself, located in /themes/mynewtheme/index.php, intermingles HTML with some Exponent specific PHP functions to form the base for your website's theme.

Themes
Theme files are the shell if your site. Comprised of mostly HTML, they require the use of three (3) php function calls, with an optional fourth. The main idea is to give a theme designer complete control over their layout, only plugging into CMS functionality where needed. The four (4) functions (class methods of expTheme) are:

  • expTheme::head(); // required
  • expTheme::main(); // required
  • expTheme::module(); // optional
  • expTheme::foot(); // required
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<?php
    expTheme::head(array(
        "xhtml"=>true,
        "normalize"=>true,
        "css_core"=>array("common"),
        "css_links"=>true,
        "css_theme"=>true
    ));
?>
</head>
<body>
    <?php
      expTheme::main();
    ?>
    <?php
      expTheme::foot();
    ?>
</body>
</html>

expTheme:head(array);
This required theme function is used to open the page and takes an array with 5 required keys, 4 of which pertain to the CSS portion in Exponent’s Theming Engine.

expTheme::head(array(
    "xhtml"=>false,
    "normalize"=>true,
    "css_core"=>array("common"),
    "css_links"=>true,
    "css_theme"=>true
));
?>

expTheme::main();
This required theme function call Is the meat and potatoes of Exponent functionality, acting as a 'sectional' container which displays all the contents (and controls) of its included modules.

expTheme::module(array);
This optional function is a unified way to 'hard-code' modules into the theme. expTheme::module() method allows for hard coding modules. expTheme::module() takes 1 parameter, an array, describing what module to hard code on the page.

// hard coding a controller
expTheme::module(array(
   "module"=>"links", // the name of module to display
   "action"=>"showall", // the action (class method) to run
   "view"=>"quicklinks",  // the view to display (action is implied showall_quicklinks)
   "source"=>"footer", // the source, the name of the content object
   "scope"=>"global",  // the scope, either 'sectional', 'top-sectional', or 'global' (by default)
   "chrome"=>false // show or hide the chrome on this module (red chrome for hard-coded modules)
));

expTheme::foot();
This required theme function call is used to close out the page and place the appropriate css and javascript entries..

Loading Help