Morph

The swiss army knife of Joomla template frameworks.

Free Download

Documentation

  • Banner

Page Layouts

To say Morph's page layouts are flexible is an understatement. Learn the basics about Morph's Layout System, how to take advantage of the page class suffixes and how you can set different sidebar widths per component and/or page.

Introduction to Morphs Layout System (PageFX)

One of Morph's most powerful features. Learn how you can set different layout combinations for any pages or components on your website. For example, switch the left sidebar from 200px to 300px wide in a matter of seconds without touching any code.

How to customize the width of your site

All layouts in Morph use the (Yahoo) YUI CSS grid framework, which has 4 default layouts (doc widths): 750px, 950px, 974px and 100%. These are easily set using Configurator (General tab). However, if you want to set you own custom site width, this tutorial will teach you how.

Setting different sidebar layouts per component

Morph really gives you unparalleled flexibility in developing your sites different layouts. This tutorial shows you how to set the default inner and outer sidebar layouts for each of your installed components, and also gives you an understanding of how the sidebar defaults cascade works.

Customize your sites background on different pages with page class suffixes

If Morph's many automatic body classes aren't enough for you, this tutorial shows you how to create an additional class that is automatically appended to the body element. Learn how to add a page class suffix via the "Parameters (System)" tab of any menu item to create a "hook" for alternate styling.

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