JoomlArt Tutorials

Home

JA Nerine

(0 votes)

Written by MiCCAS

JoomlArt: JA Nerine Readme & bug report

1. Introduction

Have you heard about K.I.S.S concept in web design? It stand for "Keep It Simple Stupid". Although it is named "Simple Stupid", do you now how hard it is when creating simple web which still be subtle and elegant. We proudly release JA Nerine, Subtle and elegant template for corporation.

The clean and simple view of JA Nerine gives your company a reliable and stable appearance. When take time to see this template, you can see that our developers have used CSS and Javascript in the best method to make a streamlined JA Nerine main menu. "Less is More" approach make a consitent navigation help visitor easier reach their content need. Large Slideshow photo module help you illustrate your words to customer in friendly way.

Beside that, JA Nerine have 5 color options and many built-in typography style that make content creation process never be easier before.

2. Template Installation

a. In Administration area choose Installers->Templates - Site

b. Click browser and choose template in zip format which you have downloaded from JoomlArt.com and click Upload file & Install

c. Choose JA Nerine as your default template.

3. Menu Types Configuration

JA Nerine offers you 4 types of our traditional menu. The menus applied are JA Split Menu, JA Suckerfish Menu and JA Transmenu.

1. JA Split Menu: A vertical menu with sub menu items of current menu display in left column.

2. JA CSS Menu: Flat and fast drop down menu using CSS based markup.

3.JA Transmenu Menu: Famous animated, transparent JavaScript drop down menu.

4.JA Dropline Menu: Fancy animated vertical menu.

To choose your menu type, go to the 32 nd line in the "ja_nerine/ index.php" and change $ja_menutype to what you need.
1 is Split Menu, 2 is Suckerfish, 3 is Transmenu, 4 is Dropline Menu

4. Screen Resolution Configuration

JA Nerine allow you to set 2 types of screen resolution. You can easily config JA Nerine template's width by modifying the Template Configurations part in the "ja_nerine/index.php".

To choose which screen's width you want to use, go to the 24 th line of the "ja_nerine/index.php" file and change the value of $ja_width_default to 'wide' (1024x768), 'narrow' (800x600),

5. Font Resizer Configuration

You can also configurate the font resizer function. Go to "ja_nerine/index.php" and replace the value of $ja_font_size_default to the size you want. You can choose the font size ranged from 1 upto 6.

6. Color Configuration

JA Nerine comes with 5 colors, the default green and the alternate red color. To change default template color, go to line 26th in "ja_nerine/index.php" and change $ja_color_default to the color you want ('default', 'blue', 'orange', 'green', 'cyan')

7. Tools Configuration

To enable/disable the font and resolution resizer, you can use the variable $ja_tool in the 30th line

Set to 0 to disable all, 1 to enable resolution, 2 to enable font tool and 3 to enable both resolution and font, 4 to enable only color, 5 is to enable color and resolution, 6 is to enable color and font and 7 is enable all.

8. Typography

Here are the guideline help you using our pre-built typgraphies to decorate your content.

The New Blockquote (with open and close quote). Use
<div class="blockquote"><blockquote>Your quote goes here!</blockquote></div>

The Hilight Blockquote. Use
<div class="quote-hilite"><blockquote>Your quote goes here!</blockquote></div>

Rounded Speech Bubble. Use
<div class="bubble1"> <div> <div> <div> <div> Your Bubble goes here! </div> </div> </div> </div>Bubble </div>

Square Speech Bubble. Use
<div class="bubble2"> <div> Your Bubble goes here! </div>Bubble </div>

Rounded Thinking Bubble. Use
<div class="bubble3"> <div> <div> <div> <div> Your Bubble goes here! </div> </div> </div> </div>Bubble </div>

Square Thinking Bubble. Use
<div class="bubble4"> <div> Your Bubble goes here! </div>Bubble </div>

The traditional ones are:

The Sticky Note. Use
<p class="stickynote ">Your note</p> to form a sticky note

The Download Note.
Use <p class="download">Your note</p> to form a download box

The Block Number. Use <p class="blocknumber"><span class="bignumber">Number</span>Your content</p> to form a block with big number.

Highlight text. Use <span class="highlight">Your text</span>

Tips. Use <p class="tips">Your tip</p>

Source code. Use <div class="tips">Your code</div>. You can also use the <pre> tag instead.

Blockquote. Use <blockquote>Your quote</blockquote>. Note: for simple and semantic markup, the blockquote is designed with only the open sign.

Error message. Use <p class="error">Your error message</p>

Info message. Use <p class="message">Your info</p>

Drop cap style. Use <p>< span class="dropcap">D</span>rop cap</p>

9. Module positions

In this screenshot below have all module positions of JA Nerine. When you add a module, please choose suitable position for it.

10. JA SlideShow

a. In Administration area choose Installers->Modules

b. Browse your module zip file which you have downloaded from JoomlArt.com and click Install

c. Go to Site->Template Manager->Module Positions

d. Add new module position named "slideshow" by fill in a blank and click Save

e. Go to menu Module->Site modules and choose module named Slide Show to edit

f. Config your JA Slide Show module like instruction in video:

Click here to view video tutorial about JA Slideshow configuration

11. Tips & Tricks

To have best presentation like JA Nerine demo, you have to config content item not show on frontpage by these steps:
In administrator area, go to Menu~Mainmenu and click to Home
In right zone, you will see Headline, Intro, Link set all of them to 0 to invisible all content in frontpage.

And create your customs module, publish them in user1, user2, user5 modules.

12. Frequently Asked Questions

Q: I want to add a template position in to my Joomla!
A: Go to your Administration Panel, Site -> Template Manager -> Module Positions. Add your template positions and hit the Save button.

Q: Where can I change my footer?
A: If you want to change or remove something in the footer, just open the "ja_Quillaja/footer.php" then modify it to suite your needs.

Q: My images take a lot of white space and do not look good?
A: The may show some extra padding and margin. To solve this problem, go to your Joomla! Administrator -> Mambots -> Site Mambots and change the margin and padding parameters of MOS Image mambot to 0.

Q: Images without caption are stuck with text?
A: It is because Joomla! generates the code different when has and doesn't have its caption. So when you decide that the image will not having a caption, put it between the div tag like this <div class="mosimage" style="float: left;"></div>

Q: What's a module style? And module class suffix?
A: Almost modules offer you a parameter called Module Class Suffix. Set a value for this parameter and you will have your module's appearance differs from the others. JA templates often provide you some module styles which can be found in Module Styles area of the guide.

Q: I changed my default color/font/resolution but when I refresh the page, it didn't change?
A: JA template use client's cookie to save your preferences. If you made change to default value, please close the browser, open a blank new window and then clear the browser's cookie. You'll see the new preferences applied.

Q: Some of my menu looks horrible. Why?
A: Menus in JA templates are designed with the most semantic mark up are used over the net, it's the list style. If you made change to the menu type, go to you menu module and change the menu type parameter to Flat List. It will solve the problem.

Q: I want to change some graphic contents
A: PSD/PNG files and fonts can be found in the template's source package. Please download the file at our download page in case you need to modify something.

< Prev		Next >