Template Settings

Template Width Settings

Option to allow you to set the Width of your Template.

Example: Enter value 960 for 960px width.

Template Width

Body Style Settings

Select a Background Color or Select a Body Background Image for the body.

See Examples - Body Background

Body Color

Load Background Image

No Yes

Select Background Image

Block Holder Padding

Option to allow you to add padding around all content blocks.
NOTE: This is useful when you are using a Body Background Image or Container Background Images. It allows you to move the content in from the edges of the wrappers.

See Example - Block Holder Padding

Block Holder Padding

Font Face Settings

Body Font Size

Body Font

Article Head font

Module Head font

Hornav Menu font

Button Styling

Select the Background Color and Text Color for buttons.
See Example - Button Styling

Button Background Color

Button Text Color

Email/Print Button Group Styling

Select the Background Color and Text Color for Email/Print button group.
See Example - Email/Print Button Styling

Email/Print Button Group Background Color

Email/Print Button Group Text Color

Input Boxes Styling

Select the Background Color and Text Color for all Input Boxes.
See Example - Input Box Styling

Inputs Background Color

Inputs Text Color

Tags Styling

Select the Background Color and Text Color for Tags.
See Example - Tags Styling

Tags Background Color

Tags Text Color

Hornav Menu Settings

Select the Menu you want in the Navigation Bar in the Header. Select colors for Menu elements.
See Example - Hornav Menu Styling

Select Hornav menu

Hornav Link Background Color

Hornav Link Color

Hornav Link Hover Color

Dropdown Background Color

Dropdown Link Color

Dropdown Link Hover Color

Logo Image Settings

To create your own logo image simply edit the logo.psd supplied with your template download package and save it as logo.jpg in your joomla administration Media Manager. Now in the Select Logo Image parameter select your logo.jpg from the Media Manager. Logo can be positioned using the Logo Position Settings below.

Select Logo Image

Logo Image On

No Yes

Logo As Text Settings

If you do not wish to use an image for your Logo then you can simply add a Text Logo and Slogan below in the fields provided. Set Logo Image On to No in the Logo Image Settings. Logo can be positioned using the Logo Position Settings below.

Logo text

Logo font

Logo Text Color

Slogan text

Slogan Text Color

Logo Position Settings

Logo can be positioned using the X and Y parameters. Example: Enter value 20 for X to move Logo 20px along X-axis. Enter value 20 for Y to move Logo 20px Along Y-axis.

X Position

Y Position

Header Margins Left/Right

Option to allow you to add margin to left and right of header.
Note: This can be useful if you decide to adjust the block holder padding in the Global Template Styling parameters. It will allow you to bring all the elements in the header inline with the content in all Wrappers.

See Example - Header Margins Left/Right

Margins Left and Right

Social Icons Settings

Social Icons Style

Search Box Settings

Show Search

No Yes

Search Box Position from Right

Search Box Position from Top

Search Box Color

Search Box Text Color

Header Custom Module Styling

Note: These controls only apply if you have a Custom html Module created in the Module Manager and the Modules Position set to Custom. This can be useful for displaying a phone number, email address or a link or some other text in the header block.

To Create a Custom Html Module
----------------------------------------------------
1: In the Module Manager click New and select Custom html Module from the list provided.
2: Set Status to Published
3: Set Title to Hide
4: Set Postion to Custom
5: Under the Custom Output tab add the text you want to display.
6: Use the Options below to Style and Position the module.

Position from Right

Position from Top

Text Color

Link Color

Link Hover Color

Slideshow Layout

NOTE: The Full Width or Boxed option will only work for the slideshow included with the template.

To Configure the Slideshow
----------------------------------------------------
1: Install the slideshow module that came with your download.
2: Set Status to Published
3: Set Title to Hide
4: Set Postion to showcase

See Example - Slideshow Demo

Slideshow Fullwidth or Boxed

Navigation Color Settings

NOTE: This will only work with the slideshow included with the template. The Slideshow Navigation runs along the bottom of the slideshow.

- For a solid color select a Navigation Background Color and set Slideshow Navigation Opacity to No Opacity.
- For no color then select Transparent in the Slideshow Navigation Opacity.
- For a nice transparency effect set value anywhere form 0.1 to 0.9. This creates a nice effect when you have a background image uploaded for this container or a body background image uploaded and turned on in the Global Template Styling parameters.

See Example - Slideshow Navigation Opacity/Color

Navigation Background Color

Slideshow Navigation Opacity

Background Styling

Option to allow you to add a background image to the container. Note: The image you upload will be stretched to fill the container from left to right.

See Example - Container Background

Load Image

No Yes

Select Background Image

Container Color Settings

Note: The Container spans the full width of the users device.
- For a solid color select a Container Color and set Container Opacity to No Opacity.
- For no color then select Transparent in the Container Opacity.
- For a nice transparency effect set value anywhere form 0.1 to 0.9. This creates a nice effect when you have a background image uploaded for this container or a body background image uploaded and turned on in the Global Template Styling parameters.

See Example - Container Opacity/Color

Slideshow Container Color

Slideshow Container Opacity

Container Padding

This allows you to add Padding to the Top and Bottom of the Container.

See Example - Container Padding

Container Padding Top

Container Padding Bottom

Background Styling

Option to allow you to add a background image to the container. Note: The image you upload will be stretched to fill the container from left to right.

See Example - Container Background

Load Image

No Yes

Select Background Image

Container Color Settings

Container Color

Container Opacity

Container Padding

This allows you to add Padding to the Top and Bottom of the Container.

See Example - Container Padding

Container Padding Top

Container Padding Bottom

Wrapper Color Settings

NOTE: The Wrapper is the area that contains the blocks content.
- For a solid color select a Wrapper Color and set Wrapper Opacity to No Opacity.
- If you do not want a color used then select Transparent in the Wrapper Opacity.
- For a nice transparency effect set value anywhere form 0.1 to 0.9.

See Example - Wrapper Opacity/Color

Wrapper Color

Wrapper Opacity

Text/Link Color Settings

Applied to all Text and Links apart from Menu Links which are styled below.

Text Color

Link Color

Link Hover Color

Module Color Settings

Applied to all Module Heads in the Container.

See Example - Module Head Style

Module Head Color

Module Head Color On

No Yes

Module Head Text Color

Module Head Padding

This allows you to add Padding to the Left and Right of the Module Heads in this container. This is useful for the following reasons. If you decide to use a Background Color in the Module Head then you will need Padding to move the text in from the edge of the module. If you decide to have No Background Color in the Module Head then you can set Padding to 0px to bring Module Head Text inline with the Module Content.

See Example - Module Head Padding

Module Head Padding

Menus Color Settings

Applied to all Menu Modules in the Container

Menu Link Color

Menu Link Hover Color

Background Styling

Option to allow you to add a background image to the container. Note: The image you upload will be stretched to fill the container from left to right.

See Example - Container Background

Load Image

No Yes

Select Background Image

Container Color Settings

Container Color

Container Opacity

Container Padding

This allows you to add Padding to the Top and Bottom of the Container.

See Example - Container Padding

Container Padding Top

Container Padding Bottom

Wrapper Color Settings

Wrapper Color

Wrapper Opacity

Text/Link Color Settings

Applied to all Text and Links apart from Menu Links which are styled below.

Article Title Color

Text Color

Link Color

Link Hover Color

Module Color Settings

Applied to all Module Heads in the Container.

See Example - Module Head Style

Module Head Color

Module Head Color On

No Yes

Module Head Text Color

Module Head Padding

Module Head Padding

Menus Color Settings

Applied to all Menu Modules in the Container

Menu Link Color

Menu Link Hover Color

Background Styling

Option to allow you to add a background image to the container. Note: The image you upload will be stretched to fill the container from left to right.

See Example - Container Background

Load Image

No Yes

Select Background Image

Container Color Settings

Container Color

Container Opacity

Container Padding

This allows you to add Padding to the Top and Bottom of the Container.

See Example - Container Padding

Container Padding Top

Container Padding Bottom

Wrapper Color Settings

Wrapper Color

Wrapper Opacity

Text/Link Color Settings

Applied to all Text and Links apart from Menu Links which are styled below.

Text Color

Link Color

Link Hover Color

Module Color Settings

Applied to all Module Heads in the Container.

See Example - Module Head Style

Module Head Color

Module Head Color On

No Yes

Module Head Text Color

Module Head Padding

Module Head Padding

Menus Color Settings

Applied to all Menu Modules in the Container

Menu Link Color

Menu Link Hover Color

Background Styling

Option to allow you to add a background image to the container. Note: The image you upload will be stretched to fill the container from left to right.

See Example - Container Background

Load Image

No Yes

Select Background Image

Container Color Settings

Container Color

Container Opacity

Container Padding

This allows you to add Padding to the Top and Bottom of the Container.

See Example - Container Padding

Container Padding Top

Container Padding Bottom

Wrapper Color Settings

Wrapper Color

Wrapper Opacity

Text/Link Color Settings

Applied to all Text and Links apart from Menu Links which are styled below.

Text Color

Link Color

Link Hover Color

Module Color Settings

Applied to all Module Heads in the Container.

See Example - Module Head Style

Module Head Color

Module Head Color On

No Yes

Module Head Text Color

Module Head Padding

Module Head Padding

Menus Color Settings

Applied to all Menu Modules in the Container

Menu Link Color

Menu Link Hover Color

Container Color Settings

Container Color

Container Opacity

Container Padding

This allows you to add Padding to the Top and Bottom of the Container.

See Example - Container Padding

Container Padding Top

Container Padding Bottom

Wrapper Color Settings

Wrapper Color

Wrapper Opacity

Text/Link Color Settings

Applied to all Text and Links apart from Menu Links which are styled below.

Text Color

Link Color

Link Hover Color

Copyright

Footer Menu Settings

Select the Menu you want in the Footer of your website. Set Show Footer Menu to Yes or No. NOTE: No Sub Menu items will be displayed in the Footer Menu

Show Footer Menu

No Yes

Select Footer menu

Footer Menu Color Settings

Applied to all Menu items in the Footer Menu

Menu Link Color

Menu Link Hover Color

Instructions
1: Choose your desired layout from the dropdown list. This is applied in the Main Content Block where your articles and side columns are.
2: Enter widths for Side Column A and Side Column B. Note that widths are in percentages.
Example: For 25% enter the value 25 and not 25%

See Example - Layouts

Side Column Layout

Side Column A Width

Side Column B Width

Enter your custom css in the area provided.

Custom css

- If your Custom code has to be within the Head Tags of your index.php then simply paste the code into the Head Custom Code text area provided.

Head Custom Code

- If your Custom code has to be within the Body Tags of your index.php then simply paste the code into the Body Custom Code text area provided.

Body Custom Code