Installing Joomla Template

To install an exported and zipped template via the Joomla administration panel in Joomla 2.5 pleasedo the following:

1. Go to Joomla Administrator (www.your-site.com/administrator) -> Extensions -> ExtensionManager

2. In the "Extension Manager" choose the first option "Upload Package File"3. Click the "Choose..." button to select the zip file from your computer4. Click the "Upload & Install" button5. Go to Extensions -> Template Manager6. Find the template in the list and put a star next to it7. Click the "Make Default" button.

NOTE: If the name of the template you would like to install already exists, you should rename ordelete the existing template before installing a new template with the identical name. Such procedureis typical for Joomla. An old template cannot be replaced automatically with the new template withthe same name.

Actually, many servers use the default limit of 2 MB on the maximum file size. If this is the case withyour server, some template files are considered too big and cannot be uploaded by usingthe"Upload&Install" button. Then to install the template please follow the steps below:

1. Upload your .zip file to a temporary folder on your server (e.g. via FTP).2. Unzip your template package.3. Log in to your Joomla Administration and select Extensions -> Extension Manager -> Install.4. Under the "Install from Directory" option enter the full path to the folder on server where

your unzipped file is located.5. Click the "Install" button.

Alternatively you can use the "Discover" tab to install templates that have not gone through thenormal installation process:

1. Unzip the template package to a folder on your computer.2. Open your Joomla installation directory (e.g. using the FTP File Manager).3. Go to /templates directory.4. Upload the template folder (with the extracted files) to the /templates directory on your

server.5. Log in to Joomla Administration and navigate Extensions -> Extension Manager -> Discover.6. Click the "Discover" button to let Joomla find the manually uploaded template folder.7. Check the box next to the template, which has appeared in the list.8. Click the "Install" button.

After the installation by any of the shown ways you can activate the template like this:

1. Log in to your Joomla Administration and select Extensions -> Template Manager.2. Select your newly uploaded template from the list of available templates for your site and

put a star next to it.3. Click the "Make Default" button to activate your template.

If you want to import content, don't forget to enable "Include Content" before exporting thetemplate from Artisteer.

To install content imported from Artisteer please do the following:

1. Go to Extensions -> Template Manager, and open your template2. Click "Import Content from Template" under the Basic Options

3. Click the "Import" button.

For more information please visit http://docs.joomla.org/How_to_install_templates

Joomla Positions

Joomla module positions are placeholders in a template. They identify positions within the templatewhere output from modules assigned to a particular position will be displayed.

In Artisteer 4 for Joomla 1.6-2.5 templates you can choose to use one of the following positionnaming options:

"position-1, position-2…" for new Joomla 1.6-2.5 position naming like in the default Beez2template

"left, right, top, bottom" for Joomla 1.5-like position naming (for compatibility purposes)

If you would like to upgrade the existing website from Joomla 1.5 to Joomla 1.6, 1.7, 2.5 you mayselect the “right, left, top, bottom” type of naming, which will be compatible with the latest Joomlaversion thus freeing you from recurring block adjustments.

Adding Modules to Header

In Artisteer 4.0 you can add modules to the Header and style/position them with CSS code. Please,follow the steps below:

1. Add a module to the Header by assigning it to position-30 (or header) in the ModuleManager.

2. Go to Advanced Options and set the module class suffix to " my-module-1" (spacebeforemy-module-1 is required).

3. Add a similar CSS code to the template.css file (Template Manager -> Templates -> [yourtemplate] -> Edit CSS/template CSS):

.art-header > .my-module-1 { top: 20px; left: 50%; }

Headline and Slogan Text

Starting with Artisteer 3.1 the Headline and Slogan text in Artisteer -> Header -> Title becomes thedummy text, which will not be displayed in the installed Joomla templates. The Headline and Slogantext in Artisteer serve for design purposes only. You can fill in the text fields and preview the resultbefore exporting the template. To add actual Headline and slogan content to your website log in toJoomla Administration, select Template Manager > Template name > Basic Options > Headline andSlogan fields and fill in the content.NOTE: The Headline and Slogan controls should be added previously in Artisteer, so that thecorresponding fields will appear in Joomla under Basic Options.

Utilizing Menus

Applying Artisteer style to your menu

Please use the following steps to utilize menu style designed with Artisteer:

1. Go to Joomla Administrator (www.your-site.com/administrator) -> Extensions -> ModuleManager

2. Open an existing menu or create a new one and place it into the "user3" ("position-1")position

NOTE: the "user3" position can contain only a single menu, or none.

For more information please visit http://docs.joomla.org/Screen.modules.15

Creating Multilevel Menu

Here are the steps you should follow to create a multilevel menu in your Joomla Website:

1. Enable multiple menu levels in Artisteer->Menu -> Submenu -> Levels -> Multilevel.2. Go to Joomla Administration (www.your-site.com/administrator) and enable multiple levels

in your menu module (Extentions -> Module Manager v click to edit menu (e.g. Top Menu) -> Basic Options -> "Show sub-menu Items").

3. Make sure that you have menu items at lower levels defined in Joomla.

Creating Vertical Menu

Starting with Artisteer 2.4 you can use an art-vmenu Module Class Suffix to apply Artisteer verticalmenu style to your menu module.To do this, please follow these steps:

1. Log in to Joomla Administration and go to Extensions -> Module Manager.Select the module you want to edit.

2. Go to Advanced Options and specify the art-vmenu suffix.3. Keep in mind that you should disable caching if you create a click-open vertical menu

Note: If you have replaced the default “art-” prefix in Artisteer (Export Options) with a custom prefixe.g. “andrew-”, you also need to add the custom prefix in Joomla (Module Class Suffix field) to applythe vertical menu style.

To create a Vertical menu with sub-items:

1. Enable Multiple menu levels in Artisteer > Vertical Menu tab -> Submenu -> Levels. Makesure that the sample Vertical Subitem works for you within the template previewed inArtisteer.

2. Create a menu with sub-menu items in Joomla.Sub-menu items should have parent items specified for them.

3. Enable multiple levels in your menu module ("Show sub-menu Items").4. Use art-vmenu Class Module Suffix to apply the designed vertical menu style to the desired

menu modules

Note that subitems will not appear on mouse hovering but only when you click on the parent item(except for menus with open levels, where all sub-items are visible).

Creating Vertical Menu with Separators

Separator is one of the four menu item groups along with Internal Link, External Link, and Alias. Unlikeregular menu items separators do not link to a particular web page; they are used to sort out themenu items.

Starting from version 3.0, Artisteer templates for Joomla support Vertical Menus with separators. Toenable menu separators, please update Artisteer, open your .artx project, re-export the templateand apply it to Joomla.

Also, make sure that your Vertical Menu levels are activated in Artisteer before the template isexported (Vertical Menu -> Subitem -> Levels -> Expand on Click/ All Open)

To create a custom Vertical Menu with separators:

1. Log in to Joomla Administration and open your custom menu (Menus-> [custom menu

name])2. Press “New” to add a menu item and select a separator menu item type, or click the existing

menu item, Menu Item Type -> Select, and save it as a text separator.

3. Open the item, which is to be placed inside the separator, and select the separator as itsparent item.

Creating Blog Layout

Starting from Artisteer 4 you can create your own layout of the blog page content. For this pleasedo the following:

1. Open the blog page you want to edit.2. Go to Edit -> Content and customize the layout and styling of your Blog Page Content.

3. Enable "Include Content" and export the template to Joomla.

4. In Joomla go to the Extensions -> Template Manager -> Styles -> [your template name] ->

and switch the "Blog Layout Type" to "Artisteer".

Note: If you choose the "Default" blog layout type, the layout, created in Joomla, will be applied.

Customizing the Footer

Starting with Artisteer 4 the footer is considered to be part of a website content and can beimported along with the other website content.

Alternatively, you can customize the template footer via Joomla administration by placing one ormultiple modules into the "copyright" position ("position 27"). This will replace the default copyrighttext included in the template footer with the new content provided by the module.

Starting with version 4.1 Artisteer generates Footer module positions in the following ways:

1. In case you haven’t changed any of Edit tab -> Content options, the default position-27(footer) module position will be used (as in previous Artisteer versions).

2. If you have changed any option of the Footer layout from the Edit tab -> Content inArtisteer before export (for example, changed Cell Padding or Content Layout etc.), thenArtisteer generates Footer module positions by Content Layout cells in Footer. In this case the following positions will be used — in accordance with the position namingoption chosen:

a. Position-32, position-33 etc. in case you use position naming option “position-1,position-2, …”;

b. Footer1, footer2 etc. if position naming option “left, right, top, bottom, …” ischosen.

To see the module positions available in your template in Joomla:

1. Please go to Joomla Administration -> Extensions -> Template Manager -> Options andenable Preview module positions option.

2. Add the "?tp=1" parameter to the end of a site's URL in the browser address bar on thefront end.For example: http://www.my-site.com/index.php?tp=1

Here are sample steps to configure custom footer:

1. Go to Joomla Administrator (www.your-site.com/administrator) -> Extensions -> ModuleManager.

2. Click "New", select "Custom HTML", then select "Next".3. In the module details specify:

Show Title: HidePosition: copyrightCustom Output: (the desired footer content)

4. Save your changes.

You can now use the newly created module for further footer customizations without utilizingadditional modules.

Joomla Module Style

Artisteer 3.0 and later versions allow using Custom Module Сlass Suffixes. So, now you can use yourown Module Class Suffixes along with the standard Artisteer suffixes, such as art-article, art-block orart-nostyle. The feature works quite similarly to the standard custom module class suffix feature indefault Joomla templates except for it requires the appropriate syntax.

To enable a Custom Module Suffix, please follow the steps below:

1. Define your custom .CustomSuffix1 and .CustomSuffix2 classes in template.css file.

2. Log into your Joomla Administration and go to Extensions -> Module Manager. Select the moduleyou would like to edit and go to Advanced Options. In the Module Class Suffix parameter box typeyour custom class suffix with a leading space (if you enter the custom suffix without a leading space,the Artisteer css class will not be modified and your suffix will be ignored).

Basically you can use:

1. [space] CustomSuffix1 CustomSuffix2to obtain the block classes like:<div class="art-block CustomSuffix1 CustomSuffix2"> ... </div>

2. [one of Artisteer suffixes] [space] CustomSuffix1 CustomSuffix2

to remove Artisteer block styles and apply post styles, or no style to the block. In that casethe resulting block code will look like:<div class="art-article CustomSuffix1 CustomSuffix2"> ...</div>

or <div class="art-nostyle CustomSuffix1 CustomSuffix2"> ... </div>

3. The latter case (with art-nostyle suffix) will remove all Artisteer styles and apply yourCustomSuffix1 CustomSuffix2 classes/styles to the block.