Documentation

In the package, you have :

This manual
The template for Joomla 1.5 / 2.5 / 3.X
The slideshow module of this demo for Joomla 1.5 / 2.5 / 3.X

Template Settings

You can access to template manager with the top menu : "Extensions --> Template Manager --> joomspirit_67"

With "JoomSpirit_67 template", you can :

Set your website name and slogan
Set the width of your website, the left and the right column in px or % (fixed or fluid)
Choose your color theme : 8 themes available (4 light and 4 dark)
Choose the color of your active links
Choose your font for the menu + article title + module title , for the website name and another for the content
Display or not your social links
Choose the font size

Typography

Module Positions

Example for the "address" position : go to the module manager and create a new module with the option "custom html". Write your adress or/and copyright and choose the position "adress".

How to display your logo ?

In this template, you choose if you want insert your logo or just write your site name and slogan (by default) :

To change the site name and slogan, go to the template manager and change the text. It's the option by default
To insert your logo, you must create a new module (option "custom html"), insert your logo inside with the position "logo" and publish it. Warning : the maximum height for your logo is 70 pixels (the width is free).

How to configure the main menu ?

You must select your main menu in module manager and enter this settings :

position : "menu"
Always show sub-menu items : "yes"
Menu tag ID : "main_menu"

How to use the module position "slogan_footer" ?

Go to the module manager and create a new module with the option "custom html". Write your slogan and choose the position "slogan_footer".

Module class suffix : Options for displaying your modules in the "left", "right" or "user" positions.

I recommend you to read this explanation with the examples online for look each modules. You can see the same page here.

Without module class suffix : No styling for your list and the links.
With the module class suffix " submenu" : you add some CSS style for the list. It's ideal for your menu. I use this setting for the left menu here.
With the module class suffix " link" : you add an arrow before your link. I use this setting for the module "latest news" on the right side.
With the module class suffix " border" : you add a border around your module. I use this setting for the module user4, user5 and user6 below.
With the module class suffix " light" : you add a soft white background. I use this setting for user4 below.
With the module class suffix " grey" : you add a soft grey background. I use this setting for user4 below.
With the module class suffix " image". I use this setting for the image on the right side. Look the difference with the same module on the left side without the Module class suffix : no padding or margin around the module and a dark shadow around the image.
With the module class suffix " no-padding" : I create this last setting for remove the padding in a specific module and obtain a content with the same width of an image above. I use it for the menu on the right side (look the difference of width with the same menu on the left side).

Note : Don't forget the space before the module class suffix

Note 2 : The module class suffix for user7, 8, 9 below is " submenu"

Note 3 : You can enter several Module class suffix. Per example I enter " submenu no-padding" for the menu on the right side.

How to display the slideshow on the demo ?

For that, use the free module "Ari Image Slider" by Ari Soft

You can find this module in this package

Install the module and edit it :

choose the position : "image"

These are my settings for this demo :

How to determine the size of your images ?

The width of your images must be : width of website - 20 pixels . Example : with a standard website width of 980 pixels (you can change that in Template manager), teh width of your images must be 960 pixels.

The height is free.

How to display a text on the right side of the slideshow ?

You must create a new module (option "custom html"). Put your text inside and choose the position "text_image". You can change the width of this module position in Template manager (default : 300px)

How to hide the huge empty space below the slideshow like the Home page demo ?

For that, you mustn't load the middle site with the articles, component and module position "left", "right", user1, user2, user3, user4, user5 and user6.

You can display only the slideshow with module user7, user8 and user9 below. Exactly like on the Home page of the demo.

To make that, you must create a new module with the option Custom HTML. Choose the position "home_page", keep the content empty and choose a specific page in Menu assignment (don't publish this module on all pages !)