Morph

The swiss army knife of Joomla template frameworks.

Documentation

  • Banner

The anatomy of a themelet

The purpose of this overview is to give you a solid understanding of how a themelet is structured, so that you can better understand where the various files are located should you wish to customize your themelet.

Themelet folder structure

Below is a snapshot of the themelets file and folder structure, in relation to your Joomla site. The themelets folder is located in your morph_assets/themelets folder of your site root.

themelet folder structure


Themelet css

Most of the visual aspect of Morph is controlled from the themelets css, so customizing the look and feel of your Morph powered site is very much like customizing a normal Joomla template. The css filenames are pretty self explanatory, but here is a reference to ensure that finding the css you want to customize is quick and easy.

themelet css


Themelets xml (themeletDetails.xml)

The themelet's xml file includes all the themelet specific information that is used by Morph & Configurator, including the themelet name, author, version number, license type and all of the themelets default settings.

themelets xml


Custom css, javascript and php (custom.css, custom.js & custom.php)

All of these are used by Configurator to output the custom css, javascript or php that you add from within Configurator (via the built in code editor). It is important that you do not edit the contents of these files, as it will prevent the code editor from working. If these files are not present, the custom code option in Configurator will not be present, as it is only activated if those files exist.

themelets custom code


Themelet thumbnail

The themelet thumbnail is used as the preview image in Configurator (both in the top shelf when active and in the assets view). The recommended dimensions for the thumbnail are 200px x 133px.

themelet thumbnail

Wednesday, 29 June 2011

Introduction to Morph's architecture

Morph's architecture is quite different from most traditional Joomla! templates, so it's important to you understand the role that each of the three key parts play, as it will help you grasp the other key concepts that Morph introduces.

Fork on Github