A guide to the basic Elemental customisation options that can be configured in the template "index.php" file with a description of each of the available options and how they affect the presentation of the template.

Basic Customisation

Elemental features several built in configuration options that have been designed to be easily changed with a single control. You can take advantage of these customisation options by making changes in the Elemental "index.php" file. Here is a breakdown of the available options:

$default_style = "style1";
// custom | [style1... style10]
$primary_style = "blue";
// blue
| brown | darkgrey | green |

red
| sienna | slate | white |

slate | purple | yellow
$secondary_style = "blue";
// blue | beige | grey | green |

lightgrey
$menu_style = "sienna";
// sienna | red | green | darkgrey
blue
| beige
$body_style = "beige";
// beige | white | grey
$template_width = "975";
// width in px | fluid
$side_width = "200";
// width in px
$menu_name = "mainmenu";
// mainmenu by default
$menu_type = "moomenu";
// moomenu | splitmenu | module
| suckerfish
$default_font = "default";
// smaller | default | larger
$show_pathway = "true";
// true | false
$enable_rokzoom = "true";
// true | false

Default Color Style

Elemental has 10, premade styles that can be easily selected from the option shown below. Simple change the settings between the two " " tags to your style of choice. In conjunction with the premade styles, you have the option of creating custom built style from combination of a primary style, secondary style, menu style and body style.

 $default_style = "style1";
// custom | [style1... style10]

Primary Color Style

The primary color style refers to the style of Elemental's header and footer. As shown in the following, you have an array of 10 styles which load with your other settings allowing for maximum configuration and personalisation.

$primary_style = "blue";
// blue
| brown | darkgrey | green |

red
| sienna | slate | white |

slate | purple | yellow

Secondary Color Style

Continuing with the custom style configuration is secondary color style. This setting is responsible for the styles driving the sidebars and bottom module positions of your website. You have 5 options to choose from to allow your individual tastes to be represented in your website

$secondary_style = "blue";
// blue | beige | grey | green |

lightgrey

Menu Style

As suggested by the name, this options controls the parameters surrounding the menu navigation bar. Similarly with the above setting, you have 5 parameters to choose from. Just mix 'n' match your menu styles with the others to create your perfect template

$menu_style = "sienna";
// sienna | red | green | darkgrey |

blue | beige

Body Style

This is the final configuration option in respects to the visual aspects of the template. The setting is responsible for the background and mainbody colors.

$body_style = "beige";
// beige | white | grey

Template Width

Sometimes, one size just doesn't fit all; and Elemental is designed to allow you to display the template in any default width you desire. All you have to do is enter the width size that is perfect for your needs, and the template will do the rest:

$template_width = "975";
// width in px | fluid

Side Column Width

Along with the template width, you can also easily customize the width of the side column (either right or left depending on the orientation) by changing the width in the following line:

$side_width = "200";
// width in px

Menu Name

The following parameter controls which Joomla! menu is loaded for the horizontal navigation bar. Therefore, you can create your own custom menu to load independant from any menu module on your site. The possibilites are endless.

$menu_name = "mainmenu";
// mainmenu by default

Menu Type

Elemental has the 3 options for the horizontal navigation bar. You can either, select moomenu, the latest addition to the Rocket Theme arsenal; or suckerfish or splitmenu, the popular classic or have no menu at all and have the area as a separate module position

$menu_type = "moomenu";
// moomenu | splitmenu | module | suckerfish

Template Width

Sometimes, one size just doesn't fit all; and Elemental is designed to allow you to display the template in any default width you desire. All you have to do is enter the width size that is perfect for your needs, and the template will do the rest:

$template_width = "975";
// width in px | fluid

Default Font Size

Based on your own personal preference, or the preference of your users; you can easily set the default font size of the text in your site by editing the following line:

$default_font = "default";
// smaller | default | larger

Show Pathway

Sometimes sites just look better with no pathway, and we've provided a convenient toggle to allow you to disable this for your site

$show_pathway = "true";
// true | false

Enable RokZoom

We've provided a convenient toggle to allow you to disable this for your site

$enable_rokzoom = "true";
// true | false