User Guide

Overview of the Template Structure of eeSiteKit

eeSiteKit’s advanced template system is made up of approximately 75 different templates. This overview will give you a basic understanding of how the system works.

ExpressionEngine’s template engine is an amazing system that simplifies database queries, PHP, XHTML, web security and many other components of a dynamic publishing system, making these advanced technologies much more accessible. eeSiteKit builds within EE’s native template engine focusing and enhancing its capabilities for common web development tasks. When used within this site, the term “templates” should not be confused or related in any way with other publishing or development products. When working with eeSiteKit, think of templates as parts of a larger system.

Creating A Dynamic Page: At the most basic level, a page in eeSiteKit has four layers that stack up in a surrounding box to make each page. The layers stack up like this:

—header_html
—header
—(home,landing,category,single_entry)
—footer

We do it this way to limit redundant code as much as possible, as having less code overall and having code for many pages of your site in one place becomes a huge time-saver during the development and life of the site.

Within each of those main templates are mini-templates with special jobs that we include on an as-needed basis through the use of customized embed tags.

Templates are organized into five main template groups that hold most of the functional and display templates for your site:

1. kit_display (page display templates where 99% of all design structure is applied)
2. kit_system (kit feature-engines and dynamic link-building templates; eeSiteKit’s modular functionality templates)
3. kit_css (all CSS templates and internal script templates)
4. kit_language (language templates)
5. kit_form (pre-coded forms)
6. kit_display_light (for the advanced developer)

kit_display: We tried to group all of the templates that have your site’s display code in them (the div structure of your site) in the kit_display template group. This group, or optionally the kit_display_light template group, is where you’ll spend most of your time setting up a website in eeSiteKit. The YAML Simple Project structure is built into this template group for you and is pre-configured to give you a starting point that looks and functions just like demo.eesitekit.com. If you would like to use your own, or some other design CSS/XHTML system, then you should swap out the kit_display group for the kit_display_light group where just about all the display code has been removed from the templates allowing you to start with the main weblog tags.

kit_system: Some advanced functionality gets a little messy to look at, so rather than put it in your display templates, we’ve tried to move most of the messy code into the kit_system group. With a few exceptions, you may never need to edit or touch the code in the kit_system templates directly. The code in this group is typically called through the use of custom embed tags in ways that allow you to re-use it in several different display templates.

kit_css: By default we’ve set up the YAML CSS system for you. There are a few paths you’ll need to set by hand to configure the default CSS, then it’s ready to go.

kit_language: eeSiteKit is now “Internationalized.” It supports a single Host Language and multiple Alternate Languages at the same time. Language templates are in the templates section of the EE control panel so they are easy to access during development and come with a default Host Language template for “english_usa” that you may edit and reuse in future sites, and/or use as an example for creating a Host Language template in your language.

kit_form: Creating accessible forms that display consistently across all browsers can be a bit challenging so we’ve provided pre-coded forms (and YAML form CSS) for most of EE’s modules. These forms may be used as-is, or styled to fit your custom design.

kit_display_light: This is an optional div-less template group for those who will be adding their own page structure or who use Grid 960, Yahoo Grids or any non-YAML system. It can be used to replace the “kit_display” group and used with eeSiteKit’s custom embed tags to quickly configure any pre-designed grid or templates. We used the new kit_display_light templates as the starting point of this website.