Definition

Navigation:  Development > MVC (Model View Controller) > View > Theme >

Definition

Previous pageReturn to chapter overviewNext page

Each theme has a definition file to notify core system about the new template. This definition helps to register some necessary Hooks and Call Backs.

 

A definition is a XML file contain with bellow data

1.Theme and Author Information

2.Theme Logo

3.Page Manager Hook

4.Theme Setting file

5.Component to Install/Uninstall

6.Register Call Back

 

Theme and Author Information
First step of theme creation is definition file creation. See below definition file
 
/development/view/rainbow/definition/info.xml
 
Theme name and Author information we fill up to display in theme gallery in admin panel. Theme gallery location is:
 
Admin Panel > Preference > Theme > Manage Theme

 

Example:

<name>Rainbow</name>
<author>Reazaul Karim</author>
<author_uri>http://reazulk.wordpress.com</author_uri>
<description>The theme created based on 960 CSS Framework. Easy and simple to customize.</description>

 
 

Theme Logo

Theme logo is a image location in definition folder. This image display in template gallery.
 
Example:

<image>logo.jpg</image>

 

Page Manager Hook

We add a list of UI Hooks. This list display in Placeholder section of Page manger. Page manager can render Content or Link by using this hooks.
 
UI Hooks are group by category like Herder, Footer, Homepage etc.
 
See below example:
 
<pagemanager_hooks>
  <hook_group name="header" title="Header">
    <hook name="template_header_A">Header A</hook>
    <hook name="template_header_B">Header B</hook>
  </hook_group>
  <hook_group name="footer" title="Footer">
    <hook name="template_footer_menu">Footer Menu</hook>
    <hook name="template_footer_A">Footer Point A</hook>
    <hook name="template_footer_B">Footer Point B</hook>
</hook_group>      
</pagemanager_hooks>

 

Theme Setting:

We can add Theme Setting list, it is basically Site Setting Definition XML file with a lite of fields.

 

Example:

<settings>themesettings.xml</settings>

 

Component to Install/Uninstall

This tag allow us to install a Components when we install a theme. This feature is useful for a large scale theme with help of a component. We have separate options to install and uninstall component.

 

Example:

<components>
    <auto>
        <install>ThemeComponent</install>
        <uninstall>ThemeComponent<uninstall>
    </auto>
</components>   

 

Register Call Back

Theme Call Backs can be register using below tag:
 
<callback>Development_View_Rainbow_Definition_Register</callback>

 
We have to set file path in Call Back Tag. After creating the definition file the theme gallery will show it in the list with thumbnail.

 

Example of a full Definition File

 

<?xml version="1.0"?>
<theme>
    <name>Rainbow</name>
    <author>Reazaul Karim</author>
    <author_uri>http://reazulk.wordpress.com</author_uri>
    <description>The theme created based on 960 CSS Framework. Easy and simple to customize.</description>
    <image>logo.jpg</image>
    <pagemanager_hooks>
        <hook_group name="header" title="Header">
            <hook name="template_header_A">Header A</hook>
            <hook name="template_header_B">Header B</hook>
        </hook_group>
        <hook_group name="footer" title="Footer">
         <hook name="template_footer_menu">Footer Menu</hook>
            <hook name="template_footer_A">Footer Point A</hook>
            <hook name="template_footer_B">Footer Point B</hook>
        </hook_group>
        <hook_group name="leftcol" title="Left Column">
            <hook name="template_left_column_A">Left Column Section A</hook>
            <hook name="template_left_column_B">Left Column Section B</hook>
            <hook name="template_left_column_C">Left Column Section C</hook>
            <hook name="template_left_column_D">Left Column Section D</hook>
        </hook_group>
        <hook_group name="homepage" title="Home Page">
            <hook name="home_page_banner_top">Home Page Banner Top</hook>
            <hook name="home_page_banner_bottom">Home Page Banner Bottom</hook>
            <hook name="home_content_area_A">Home Content Area A</hook>
            <hook name="home_content_area_B">Home Content Area B</hook>
        </hook_group>
    </pagemanager_hooks>
    <settings>themesettings.xml</settings>
   <components>
      <auto>
         <install />
         <uninstall />
      </auto>
   </components>   
   <callback>Development_View_Rainbow_Definition_Register</callback>
</theme>