Joomla Templates Club 406,261 posts

[BigHug Friend BigHugJoin date: September 2012Posts: 60Downloads:17Uploads:277 Thanked: 11 times in 1 posts]

#138118

JA Cooper – Userguide for Joomla! 1.5.x

I. INTRODUCTION

1.1. BASIC TERMS

JoomlArt Template: JoomlArt template is uniquely designed for Joomla CMS, defining module positions that form the layout structure, adding color themes and additional functional add-ons to enhance the template.

Built-in extensions: Depending on each template, we develop and integrate our own extensions to enrich the functional aspects. All these extensions are included in the template download package. In certain cases, we integrate third-party extensions, we might provide a download version of these extensions or url where you can download necessary files yourself.

Template download package: When download templates from JoomlArt template download section, you will get a zipped file. Get this file unzipped, you will see four folders:

• Extensions: contain all extensions built in the template
• Quickstart: is a Joomla CMS with our template integrated already as per our demo
• Template: contain template files only
• Source file: contain graphic elements of the template in PSD format

The use of these folders is clarified in section “GETTING STARTED” below.

1.2 GETTING STARTED

You can getting JoomlArt template installed using either Installation via Installer or Quickstart Installation:

Installation via Installer: Applicable when you already install a Joomla CMS on your server. You will need zipped files in “Extensions” and “Template” folders mentioned above.

Quickstart installation: Applicable when you need a fresh Joomla CMS with our template built in as per our demo. The zipped file in “Quickstart” folder is sufficient to fulfill the Quickstart installation.

Difference between the two installation options:
Quickstart installation: is a complete Joomla CMS with our template built in together with all contents and extensions as per our demo
Installation via Installer: you already installed your Joomla CMS, now you just need separately install template, extensions and add contents from scratch.

II. INSTALLATION GUIDE

2.1 Installation via Installer
Step 1: Download and extract the zipped file (using zipped file in “Extensions” and “Template” folder)
Step 2: Install and configure the template (using zipped file in “Template” folder)
Step 3: Install and configure built-in extensions (using zipped file in “Extensions” folder)NOTE:

• If you are new to Joomla, you might not be sure on which extensions need being installed, please don’t worry. Simply install all extensions included in the “Extensions” folder, then go to section III. Configuration below for further instruction.
• After installing the template and extensions via Installer, your front-page seems corrupt not like what you see on our demo, you need follow our guideline in section III. Configuration below to get things in neat layout as per our demo.

For full instruction how to install template and extensions, view here:
– How to install Joomla! template guide
– How to install Joomla! extension guide

2.2 Quickstart Installation
Step 1: Download and extract the zipped file (you will need zipped file in “Quickstart” folder)
Step 2: Upload the whole files in Quickstart folder to your server
Step 3: Conduct installation as normal Joomla! installation

For full instruction how to install Quickstart package, view here:
– How to install JoomlArt Quickstart package

III. CONFIGURATION

• This configuration guide is applied only for Installation via Installer
• The instruction is to get the template ready as per our demo

3.1 TEMPLATE CONFIGURATION
Log in your site Admin panel, select Extentions >> Template Manager, click on template name , you will see:

You can change all JA Cooper parameters as you wish.

1. Logo type: Logo display in site, has two types: Image and Text
2. Logo text: text displayed in logo if you choose Logo type is Text.
3. Slogan: Slogan displayed below logo
4. Font size : Increase/Decrease font size (from 1 to 6).
5. Color Variation: include 4 color themes (Default, Metal, Luxury, Cacbon)
6. Show Font tools: Show/Hide font tools
7. Show color tools:Show/Hide color tools
8. Date format: format of displayed date
9. Menu Type: type of menu displayed in site (Mainmenu/Topmenu…..)
10. Menu Module: include Disable/Split/Css/Moo menu.

You just simply change above-mentioned parameters, then refresh your front-page to see how the changes effect.

3.2 EXTENSION CONFIGURATION

Make sure all extensions are installed properly. In JA Cooper, following extensions are included:
Note: [xx] stands for module position

• [ja-slideshow] JA Slideshow 2 module
• [content-slide] JA Content Slider module
• [ja-news] JA News module
• [user6] JA Tabs module
• [user1, user2, user8] JA Bulletin module
• JA Tabs plugin

Reference: JA Cooper default module positions are available Here.

With the extensions installed following our guideline in section II – Installation Guide above, you need to access configuration area of such extensions to set the position and related parameters. Details of configurations are as follows:

3.2.1 JA Slideshow 2 module(mod_jaslideshow2.zip)
[position: ja-slideshow]

JA Slideshow 2 in our demo:

Steps to configure: In Admin panel, go to Extensions >> Modules Manager and click on module name (JA Slideshow 2) to go to configuration page.

Default settings of JA Slideshow 2 on demo:

Parameters Explanation:

• Images Folder URL : URL to folder contain images in slide show. For example: images/stories/slideshow/ then photos in the slideshow directory will be showed.
• Start Item: Start item
• Main Item width: Width of main item
• Main Item height: Height of main item
• Show Description: Show/Hide description. Description includes options: Description only/Description with Readmore.
• Show Description when: Choose how to show description. Include options: Always show description/show when mouse over image/show when image animated.
• Readmore Text: Text to display in Readmore button
• Animation Duration: Main image animation duration.
• Animation Type: Animation effect you want to display, has two options: Moving/Fading
• Effect: Animation effects, only used with Wipe/Push animation.
• Container Width: Only apply for Moving animation type
• Navigation: Choose navigation type, include Number/thumbnails options.
• Thumbnail Width: Width of thumbnail (if you choose thumbnail option for Navigation)
• Thumbnail Height: Height of thumbnail (if you choose thumbnail option for Navigation)
• Thumbnail Spacing: Vertical space:Horizontal space
• Number of thumbnails: Number of thumbnail items is displayed (if you choose thumbnail option for Navigation)
• Control buttons: Show/hide control button
• Auto play: Has two option Yes/No to set Auto or not auto play. If choose Yes, the slideshow will auto switch base on time interval
• Interval: Time (in seconds) for next play/run
• Thumbnail opacity: Opacity for thumbnail
• Description background opacity: Opacity for description background
• Next/Prev Images opacity: Opacity for the displayed part of next/previous images.
• Description for each item: Write description content using HTML code according to below syntax:

Content of description

For examples:

<h3>Risus eleifend</h3>
<p>Risus eleifend eu consequat elit nisl Nam turpis augue sollicitudin auctor. Ut id vitae neque metus elit parturient nisl netus gravida tristique. Pretium sagittis lacinia enim netus lacinia dis augue netus est lorem.</p>
<p>At convallis Sed nibh at sagittis enim consectetuer mauris porttitor nisl</p>

You need to copy your image folder into your_site_path/image/stories and fill the image_folder _path into Image folder param as per screenshort below:

And set other parameters as you wish.

3.2.2 JA Content Slider (mod_jacontenslider.zip): Slide your contents with category
[position: ja-contentslide]

This module will display your content in a slide. When you move your mouse over the image beside slide, the slide’s direction will change with that direction in image and slide will move faster. Then, when you move your mouse out the image, the slide will keep new direction and the slide will move with old speed.

JA Content slider in our demo:

Steps to configure: In Admin panel, go to Extensions >> Modules Manager and click on module name (JA Content Slider) to go to configuration page.

Default settings of JA Content Slider on demo:
Parameters Explanation:

• Include Mootools library: Choose if you want to include mootool library or not. This module require mootools library ver 1.1x to functions, if your page already included motools library, you don’t need to include it again.
• Title: Choose show or hide content title
• Read More: Choose to show or hide Read more… link
• Intro text: Choose to show or hide content’s intro text
• Show image: Show the images in the content or not
• Category: The category that JA Content Slider will display its contents
• Linked Titles: Make the title link able or not
• Number Characters: How many characters will be display, set to 0 for unlimited.
• Height of div: Height of the div will be displayed
• Width of div: Width of the div will be displayed
• Height of image: Height of images will be displayed
• Width of image: Width of images will be displayed
• Number Element: How many element (items) will be displayed.
• Auto run slide: The slide will run automatically or not.
• Direction: Direction for the Auto Run
• Use compression js file: Use the compressed javascript file or not
• Use Ajax: Set to use Ajax to get content or not
• Rolling delay time: The time in millisecond for items change.
• Animation time: the time in millisecond for animation.

You need to choose Category that JA Content slider will display its contents in Category param as per screenshort below:

You can:

• Slide your content with your width and height properties.
• You can set the number of content will display in a tab.
• You can set the categories contents will display.
• You can set display title, link title, introtext, read more text links or not.
• You can set the slide to auto run or not. Default is yes.
• Set direction of slide. Default is left
• Set to use zip javascript file or not. You should chose yes for this option.
• And the last is set time for rolling delay time and animation time.

3.2.3 JA News module(mod_janews_j15.zip)
[position: ja-news]

JA News in our demo:
Steps to configure: In Admin panel, go to Extensions >> Modules Manager and click on module name (JA News) to go to configuration page.

Default settings of JA News on demo:
Parameter explanation:

• Module Class suffix: A suffix to be applied to the css class of the module (table.moduletable), this allow individual module styling
• Hidden classes: Classes that have property such display: none. Separated by |
• Article order: Order by created date or modified date.
• Group by category or section: News displayed on front page grouped by Category or Section
• Category (Section) ID: News belongs to Category (Section) ID will be displayed on front page. Set Category (Section) ID line by line. In each line you can put ID and color theme separated by a colon. Syntax for this is: <ID>:<color>, for example:
  

  13:red

14:orange
8:deepblue
12:cyan
5:green
9: pink
11:lime

• Show category (Section) title: Show/Hide category (section) title.
• Intro items: Number of intro items
• Link items: Number of link items
• Max chars: Maximum character number displayed
• Show image: Show/Hide news’s image
• Image Align: Set align of image
• Auto resize: Auto resize image or not
• Show front page article: Show/Hide front page article
• Image width: Fixed width of image in pixel (set to -1 if you want to leave image’s default size).
• Image height: Fixed height of image in pixel (set to -1 if you want to leave image’s default size).
• Columns: Number of column per row (Set to zero if you want to disable other news items)
• Show readmore: Show/Hide Readmore button on news

You need to choose Category/Section that category/Section and its contents will be displayed front page in Category (Section) ID as per screenshort below:
And set other parameters as you wish.

3.2.4 JA Tabs

3.2.4.1 JA Tabs module(mod_jatab_j15.zip)
[position: user6]

JA Tabs module used to display your specific content, categories, section as well as modules in TABS. You can specify module position to display, or using JA Tabs syntax for advanced features

JA Tabs in our demo:
Steps to configure: In Admin panel, go to Extensions >> Modules Manager and click on module name (JA Tabs) to go to configuration page.

Default settings of JA Tabs on demo:
You can select what will be displayed in JA Tabs block. It can be modules, content, module, Article ID or Articles-Category ID

• If Modules selected, you can choose module position in Select a position dropdown list. All modules from that position will be displayed in tabs.
• If Content selected, you can input your JA Tabs string to the Enter content code textarea.
• If Module selected, you can input list of module to the textbox List module
• If Article ID selected, you can input list of Article IDs into textbox Article ID list. All articles which have inputted ID in textbox will be displayed in tabs.
• If Articles-Category ID selected, you can input list of Category IDs into textbox Category ID. All articles which have inputted category ID will be displayed in tabs.

To understand the JA Tabs string syntax, please follow this link: JA Tabs Userguide

3.2.4.2 JA Tabs Plugin (plg_jatab_j15.zip)

JA Cooper came with JA Tabs plugin, an advanced tool in creating and presenting your content as well as modules on frontpage. All of them can be well align in tabs.

For the syntax of JA Tabs and how to use it, please follow this guide here:
JA Tabs Userguide

Notes: to display JA Tabs module on frontpage, you must enble JA Tabs plugin first

To have JA Tabs like demo, please follow these steps

• Using Custom module to create two articles: GROUP 1 STUFF, GROUP 2 PANEL, GROUP THREE SELECTION, GROUP 4 ASSORTMENT and publishes these modules on jatabs position. (Follow this guide to create custom module)
• On parameters configuration of JA Tabs: Choose Type tabs: Modules and select a position: jatabs (that means: modules on jatabs position will be displayed on JA Tabs module).
• 
• Now, your JA Tabs is similar to our demo

JA Cooper supports some default style for tabs. You can choose style by going to Extensions >> Plugin Manager >> JA Tabs for Joomla! 1.5 to choose style as per screenshort belows:
3.2.5 JA Bulletin module(mod_jabulletin.zip)
[position: user1, user2, user8]

JA Bulletin in our demo:

Steps to configure: In Admin panel, go to Extensions >> Modules Manager and click on module name (JA News) to go to configuration page.

Default settings of JA Bulletin on demo:
Parameters Explanation:

1. Type: Show Latest articles or Most read articles.
2. Front Page Articles: Show/Hide frontpage article
3. Count: number of article will be displayed
4. Category ID, Section ID: Input category/section ID, that means published articles belong to Category/Section will be displayed
5. Show Image: If enabled, an image in each article will be retrieved and shown. The image will be resize to the input size in next parameters.
6. Image Width: resized image width
7. Image Height: resized image height
8. Show Date: Show/Hide last updated date.

JA Bulletin showes lastest and most popular articles on user1, user2 and user8 position. Follow these below steps to create JA Bulletin:

• Install JA Bulletin module
• Go to JA Bulletin parameter, set Title is Lastest Post and position is user1
• Choose Type: Lastest News and set other parameters. So newest articles will be displayed on user1 position
• On Module Manager panel, tick Lastest News module and choose Copy to copy module as per screenshort as belows:

• Go to Copy of Lastest News module, rename to Top View, set on user2 position and choose Type: Mostread. So articles that are most read will be displayed on user2 position.
• Continue copy module > Go to copy module > rename to Lastest editor reviews, set on user8 position and choose Type: Lastest News, Module Class Suffix: _h32, and input Category ID/Section ID into Category ID/SectionIDparam that means lastest articles from inputed categories/sections will be displayed on this module.

3.2.6 Custom module

We used Custom module of Joomla! to create articles on demo page such as: TOP VIEW AUTO on user5, SAMPLE MODULE on user5, LASTEST VIDEO on user7, ADVERTISTMENT on user9 and TAGS CLOUD on user10

You can check How to create Custom module guides for more details.

IV. ADDITIONAL TUTORIALS

4.1 JOOMLA BASIC

• Get Started with Joomla
• Absolute Beginners Guide to Joomla

4.2 JOOMLART BASICTypography

JA Cooper came with a rich typography to give users more ability to customize content look and feel. Please check all JA Cooper typography here at JA Cooper Typography

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_justicia/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 {mosimage} 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 {mosimage} 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;”>{mosimage}</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.

1 user says Thank You to BigHug for this useful post

1. kurtsteiner

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#291457

Thanks.
BTW…demo server appears to be down.

[imsleepy Friend imsleepyJoin date: January 2009Posts: 451Downloads:0Uploads:0 Thanks: 94 Thanked: 45 times in 1 posts]

#291461

Does posting of Userguide mean it is now stable or still beta?

[imsleepy Friend imsleepyJoin date: January 2009Posts: 451Downloads:0Uploads:0 Thanks: 94 Thanked: 45 times in 1 posts]

#291462

<em>@jbrett 112174 wrote:</em><blockquote>Thanks.
BTW…demo server appears to be down.</blockquote>

Downloads, or at least some of them, appear to be down as well.

[kurtsteiner Friend kurtsteinerJoin date: December 2008Posts: 26Downloads:0Uploads:0 Thanks: 9]

#292766

Hi,
many thanks – i like your work !

one thing:

3.2.2 JA Content Slider (mod_jacontenslider.zip): Slide your contents with category
[position: ja-contentslide]

You use the same image twice, so i can not see the rest of the module values 😉

[solsantiec Friend solsantiecJoin date: March 2008Posts: 20Downloads:0Uploads:1 Thanks: 2]

#294347

what is the diference for this templeate and the bussines edition???

[Luiz FernandoMolina Friend Luiz FernandoMolinaJoin date: December 2005Posts: 63Downloads:37Uploads:2 Thanks: 16 Thanked: 2 times in 1 posts]

#300986

Whatever happenned to JA News FrontPage? How does one configure it?

[raffo333 Friend raffo333Join date: April 2009Posts: 2Downloads:0Uploads:0]

#301375

Hello, and thank you for the tutorials, but i have a problem, how can i determinate which images to display in the content slider, and how to add the link of each image ?..

[railer Friend railerJoin date: October 2007Posts: 236Downloads:102Uploads:9 Thanks: 17 Thanked: 24 times in 1 posts]

#326356

This user guide doesn’t have the actual parameter settings used in the demo. The headings such as: “Default settings of JA Slideshow 2 on demo:” are empty. Is that intentionally omitted, or is it just my browser (Firefox/Mac)?

Please add them in so I can duplicate the layout properly.

Thanks,
Railer

[Anonymous Moderator JA DeveloperJoin date: September 2014Posts: 9914Downloads:207Uploads:152 Thanks: 1789 Thanked: 2008 times in 1700 posts]

#326516

Hi railer

There are some problems with our image server. We are checking to fix it.

I will inform you when this issue is solved.

[kartboy Friend kartboyJoin date: February 2007Posts: 13Downloads:239Uploads:1 Thanks: 2]

#330617

any update on this?

[doktor101101 Friend doktor101101Join date: June 2007Posts: 11Downloads:0Uploads:0 Thanks: 6 Thanked: 2 times in 1 posts]

#330778

I could really use the images to configure the website. Can you make these available somewhere else?

[Anonymous Moderator JA DeveloperJoin date: September 2014Posts: 9914Downloads:207Uploads:152 Thanks: 1789 Thanked: 2008 times in 1700 posts]

#331098

Hi doktor101101

Currently we have not finished it yet. please try to install a quick start package and check our configuration in this package.

[webbiegirl Friend webbiegirlJoin date: October 2007Posts: 6Downloads:0Uploads:0]

#331958

When will the images be fixed for the userguides? I got an email several weeks ago saying you were wroking on it, but they’re still not working.

[christimcginley Friend christimcginleyJoin date: November 2009Posts: 19Downloads:0Uploads:0 Thanks: 5]

#332303

I’ve followed the instructions about how to configure JA Slideshow and have uploaded 4 images to the images/stories/slideshow folder and am pointing to that directory in the module. I’ve confirmed that those images exist in the folder correctly.

When I enable the module (I’d disabled it when I started the site because it wasn’t being used) the only thing that shows up is the dark background and not images.

Should I be enabling another module, component, plugin to make the JA Slideshow work? 😉

[Author]

Posts