Quick Start Guide

Logo

The logo JSN Epic is default sample logo and you are free to replace with your own. The logo image file is called logo.png and located in folder joomla_root_folder/templates/jsn_epic_pro/http://demo.joomlashine.com/joomla-templates/jsn_epic/images/. There are 3 stages involved in changing the default logo to your own:

Stage 1: Prepare your own logo image file

First, you need to prepare your own logo image file in some graphic editor like Adobe Photoshop or Fireworks. We recommend you to save your logo in format PNG-8, but you can use any other as well. Don’t forget to give some white margin space around the logo. Also you need remember logo’s width/height dimension to set them up in template parameters later.

The included JSN Epic logo source file logo.psd can be perfect starting point.

Stage 2: Upload logo image file to your server

Once your logo file is ready, it’s time to upload it to your server. You can upload it to any folder under your Joomla! root folder by using standard Joomla! Media Manager or by FTP client.

Stage 3: Setup template parameter to use new logo

If you uploaded your logo to template’s images folder overwriting the original file, then you don’t need to do anything thing additionally. Otherwise you need to setup JSN Epic PRO to apply your new logo.

1. Go to template manager by menu Extensions -> Template Manager.
2. Click on template name JSN_Epic_PRO.
3. Here in the Template Edit page you will see the list of template parameters in section Parameters. You need to configure following parameters:
   • Logo Path ? path to your logo image file starting from your Joomla! root folder. For example if you named your logo image file as mylogo.png and placed it in folder /http://demo.joomlashine.com/joomla-templates/jsn_epic/images/stories, then the logo path should be /http://demo.joomlashine.com/joomla-templates/jsn_epic/images/stories/mylogo.png;
   • Logo Width ? the width of your logo image file;
   • Logo Height – the height of your logo image file;
4. Additionally you can setup following logo parameters:
   • Logo Link ? URL where logo image should link to (! without preceding slash !).
   • Logo Slogan – Slogan text to be attached to the logo image ALT text for SEO purpose.
5. Click button Save.

Top Icon Menu

The top menu you see on JSN Epic PRO demo site is a very innovative Icon menu system called Icon Menu. By combination XHTML, CSS and Javascript Icon Menu allows you to assign up to 20 predefined icons to menu items and arrange them in a horizontal line. This is perfect for top position in any kind of websites. Please make following steps:

1. In module manager click on the menu module you want to use as top menu module. By default, Joomla! 1.5 comes with various menu modules and there is Top Menu module among them. That might be the perfect choice.
2. In module’s configuration page setup following parameters:
   • Title: Top Menu (or any other you like)
   • Show title: No
   • Enabled: Yes
   • Position: top
   • Menu Assignment: All
   • Menu Name: topmenu (you might want to use another menu source here)
   • Menu Style: List
   • Start Level: 0
   • End Level: 1
   • Always show sub-menu Items: No
   • Menu Tag ID: empty or any other you like
   • Menu Class Suffix: -icon
3. Now you need to pick what icons to show in the menu. As stated before there are 20 predefined icons for you to choose. You need to setup template parameter Menu Icons by specifying icons’ name separated with a comma. In our example template parameter Menu Icons should be ?home,cart,download?.

For more information about all available menu styles please refer to JSN Epic PRO Configuration Manual.

Main Suckerfish Menu

The main drop-down menu is adaptation of popular Suckerfish menu to Joomla! CMS. By just combination XHTML and CSS it allows you to have clean accessible XHTML code structure and simple yet effective drop-down menu effect. Please make following steps:

1. In module manager click on the menu module you want to use as main menu module. By default, Joomla! 1.5 comes with various menu modules and there is Main Menu module among them. That might be the perfect choice.
2. In module’s configuration page setup following parameters:
   • Title: Main Menu (or any other you like)
   • Show title: No
   • Enabled: Yes
   • Position: toolbar
   • Menu Assignment: All
   • Menu Name: mainmenu (you might want to use another menu source here)
   • Menu Style: List
   • Start Level: 0
   • End Level: 0
   • Always show sub-menu Items: Yes
   • Menu Tag ID: empty or any other you like
   • Menu Class Suffix: -suckerfish

For more information about all available menu styles please refer to JSN Epic PRO Configuration Manual.

Font Size Changer

Font size changer is brand-new feature introduced in JSN Epic PRO v2.0. By default it’s turned on so you don’t have to make any additional actions. If you want to disable font size changer please make following steps:

1. Go to template manager by menu Extensions -> Template Manager.
2. Click on template name JSN_Epic_PRO.
3. Here in the Template Edit page locate the parameter Show Font Resizer and set it to No.
4. Click button Save and refresh your website front-end to see the result.

Favicon is small icon standing on the left of address bar of your browser. By default Joomla! has the icon as shown in screenshot above. On your website you might want to use your own icon, like the one we are using on our site joomlashine.com. Here is instruction how to do that. The process consists of 2 main stages:

Stage 1: Create your own favicon file

Technically favicon is regular 16px * 16px icon file with exact name favicon.ico. In most cases favicon is the sized-down version of the company logo saved in icon format. In some cases the logo is too specific and favicon need to be built from the scratch. You can use professional icon editor software like Axialis IconWorkshop and Iconcool Editor or to use online favicon generators. The first method gives you better quality, but takes more efforts. The second method is easier, but quality is not the best.

Stage 2: Upload favicon file to your server

After you got favicon file, it’s time to upload it to your server. You need to upload the icon file to folder joomla_root_folder/http://demo.joomlashine.com/joomla-templates/jsn_epic/images/ overwriting the default file. Feel free to make experiments. Anytime you can get back default favicon file from Joomla! installation package.

Extended menu module in Joomla! 1.5.x

In Joomla! 1.5.x JSN Epic does NOT utilize any 3rd party menu’s extensions menu to display menus. It uses Joomla! 1.5 built-in menu system and you do NOT need to install Extended Menu as you should in the case of Joomla! 1.0.x

JSN Epic PRO template installation

In the download package you can find template installation file called jsn_epic_pro_2.0_j15.zip under the folder for_joomla_15. This is standard Joomla! 1.5.x template installation file which can be installed in Joomla! administration normally as following:

1. In Joomla! administration go to menu Extensions -> Install/Uninstall
2. Once you are on Extension Manager click Browse button and select template installation file jsn_epic_pro_2.0_j15.zip. After that click on button Upload File & Install.
3. Installation file will be uploaded to your server and installed in Joomla! CMS. When it’s done click Continue link to finish module installation process.

Get ready

After installation what you got does not really look like the demo website. Please don’t worry, in next 10 – 20 minutes everything will line up as they should. Basically we need to configure 6 blocks of elements to get desired look. Let’s take a look at screenshot below.

Let’s start with the Header area. But before that, let’s discuss one little yet important thing called Favicon.