JCLASSIFY DOCUMENTATION

Here you'll find the latest documentation and information concerning everything about JClassify Template

Installation

How to install Bundle package?

First download the bundle package from your account.

  • Login to your Joomla! Admin.
  • Select "Extensions -> Extensions Manager -> Install ".
  • Browse the bundle package and click "Upload file and Install ".

Thats' it. Now, Joomla! will upload the bundle package on your server and install it.When this package is getting installed,following are installed along with it - Gantry Library , Gantry Component , JomClassiifeds Component , Gantry System Plugin , JCLASSIFY template , RokExtender Plugin , RokNavMenu Module , JomClassifieds Postad button Module. (If you have already installed Gantry template or JomClassifieds Component , it gets updated during this installation)

Then, Goto "Extensions -> Template Manager ->Set JClassify template as default."

How to install template?

Installing this template is similar to installing a extension in Joomla.

  • Login to your Joomla! Admin.
  • Select "Extensions -> Extensions Manager -> Install "
  • Browse the template package and click "Upload file and Install ".

Thats' it. Now, Joomla! will upload the template package on your server and install it. This process can take more than 1 minute.Finally, you should see a result of "Installing template was successful."And then, you need to install Gantry framework.

Then, Goto "Extensions -> Template Manager ->Set JClassify template as default."

How to install Quick start package?

First download the template package from your account.

  • Then Extract the zip package and transfer the content to your web server via FTP software, we recommend FileZilla.
  • Now you need to set up the database for your Joomla installation.
  • Go to your local or web- server and find PHPMyadmin
  • Type in the database name you like for your MYSQL
  • Create a user for the database
  • In browser, type: www.yoursitename.com
  • There is your fresh installer
  • Choose your language click on Next
  • Make sure all your server settings are green click on Next
  • Joomla Licence click on Next
  • Fill in the MYSQL database information you just created, host name, username and password and database name click on Next
  • FTP Configuration Leave it as it is if you do not want to us FTP layer click on Next
  • Type in your site name, email address and admin password to use in backend
  • Follow the message: Completely remove the installation directory from your server
  • Go to server and remove the installation file
  • Go to yoursitename and you are all set with a demo Joomla site.

Basic Configuration

Module Creation

Goto Extensions -> Module Manager -> New

Position Assignment

Select Jomclassifieds Post ad button , fill all required fields , assign menu in required pages and assign position for this module and Save & Close.

Select RokNav Menu, fill all required fields,assign menu in required pages and assign position for this module and Save & Close.

Similarly, assign positions for Search Module, Categories Module, Locations Module.

Template Configuration

Style

[ NOTE : In below styles, if both background color and image are set, only image will be displayed in front-end. ]

Logo Configuration :

Enable or disable logo as well as select the default logo style.Then,Select logo position,enter logo text, choose text color,hover color and font size.

Top Style :

Select text color,background color and background image for top position.Choose “Custom” to set background image.

Header Style :

Select text color,background color and header type for header position.

Drawer Style :

Select text color,background color and background image for drawer position.Choose “Custom” to set background image.

Showcase Style :

Select text color,background color and background image for showcase position.Choose “Custom” to set background image.

Utility Style :

Select text color,background color for utility position.

Feature Style :

Select text color,background color for utility position.

Main Top,Main Body,Main Bottom Styles :

Select text color,background color and background image for main top,main body and main bottom positions.Choose “Custom” to set background image.

Extension Style :

Select text color,background color for extension position.

Bottom Style :

Select text color,background color for bottom position.

Footer Style :

Select text color,background color and background image for footer position.Choose “Custom” to set background image.

Copyright Style :

Select text color,background color for copyright position.

Title and Body Font :

Select font family for title and body.

Features

Date :

The date feature controls the output of the current date display.From this option, you can enable or disable the use of client-side date, choose from several different date format options, and select a location for the date to display using any of the available module positions in the template.

Font Sizer :

The Font Sizer feature controls the output of the front end font sizer controls allowing users to increase or decrease font size. From this option you can enable/disable the display of the front end font sizer controls, as well as select a location for the font sizer to display in using any of the available module positions in the template.

Branding :

The Branding feature controls the output of the Gantry branding on the front end. From this option, you can enable/disable the display of the branding image and select which module position it loads in.

Copyright :

The Copyright feature controls the output of the copyright text. From this option, you can enable/disable the display of the copyright text and input custom copyright text to be displayed. You can even select a location for the copyright text to appear using any of the available module positions in the template.

To Top Scroller :

The To Top Scroller feature controls the output of a link/button that, when clicked, will smoothly scroll the page back to the top. From this option, you can enable/disable the display of the to top button, input custom text to be displayed on the to top button, and select a location for the to top button to display in using any of the available module positions in the template.

System Messages :

The System Message feature controls the output of the Joomla system messages. Joomla outputs system messages for various events, and as a feature, it's now possible to control the location of this output. From this option, you can enable/disable the display of Joomla system messages, as well as select a location for the Joomla system messages to display in using any of the available module positions in the template.

Reset Settings :

The Reset Settings feature controls the output of a link/button that, when used, will reset all of the stored cookies and return the front end site settings to default. From this option, you can enable/disable the display of the Reset Settings button, control the text output, as well as select a location for the Reset Settings button to display in using any of the available module positions in the template.

Google Analytics :

The Google Analytics feature allows you to enable Google Analytics tracking on your site in a quick and easy way. Just enable the feature and input your UA Key assigned to you by Google in the field provided.

Menu

Menu Control :

Enable or disable the menu as well as select the menu type.

Select a menu :

Select a menu group to display in the main menu.

Position :

Select the location to display the main menu.

Responsive Menu :

Select the rendering style of the menu as either Panel or Select box.

Enable ID :

Enable or disable the default Joomla menu active ID.

Module Cache :

Enable or disable the default Joomla module caching for the menu.

Layouts

This template comes with several layout positions to customize your user experience.For all pages, you will have 72 module positions to choose from. Below is a module map of the available positions.

Each of the major module rows/sections is represented with a slider to allow for dynamic control over how modules are laid out -- based on how many module positions are in use or published. By default, the layout will be an equal size for the published modules.

Number links from one to six sit on top of the slider which represent the number of positions you want to configure for. For example, if you are setting up the layout for a page which has four positions in use, you will want to first select the #4 link at the top of the slider for that position.

If you had modules in 4 different module positions: utility-a, utility-b, utility-c, and utility-d, that would mean your active positions would be 4. The layout widget will always show you the current number of active positions in bold. Below that number, you see a block representation of the current layout.

We use a system based on Twitter's Bootstrap. The layouts are based 12, and by default, the 12 column 3 | 3 | 3 | 3 of the default setting translates into an equal sized block for each of the four module positions you have active or published.

Based on the 12-column layout with 4 modules of equal width published, the front-end will look like this:

When you slide the slider bar below to select different widths for these 4 positions, a tooltip on the side will also show you the numeric value of the configuration.

In this case, you can see we have dragged the slider to the left and have chosen the layout 2 | 3 | 4 | 3, which means that module position utility-a is assigned 2 grids, utility-b is assigned 3, utility-c is assigned 4 and utility-d is assigned 3 grids. After hitting Apply or Save, this will cause the front-end's layout to change and display this:

You can see the 2 | 3 | 4 | 3 proportions have been applied to the layout. Gantry is so flexible that you can configure different layouts for different numbers of module positions. Joomla has the ability to show different modules on different menu items so you may, for example, have 4 modules published on your Home menu item, but only 2 modules published on one of your internal pages. To accommodate this, you can merely click the 2 in the Positions list and choose a layout that suits your needs:

This will translate into a 8 | 4 or worded another way -- a 2/3 and 1/3 distribution of the 2 modules:

Mainbody Layouts :

The layouts for the mainbody area is slightly different from the other module layouts. The primary difference is that the mainbody is generally displayed along with up to 3 sidebars. This provides the ability for a Gantry-powered template to effectively support a four-column layout. We researched a wide variety of sites and determined that more than four columns for a layout is very rare, and quickly becomes unreadable due to the limited amount of space available. Generally speaking, two or three columns is the preferred layout for a modern website.

The layout for this is controlled in the template parameters. As you can see below, the widget understands that there are three sidebar columns published. So, when the mainbody is taken into account, this creates a four-column layout. The current configuration is set to 6 | 2 | 2 | 2 where the mainbody is using six grid units, and the three sidebars each use two. This adds up to the 12-grid system we are using in this example.

If you drag the slider to the right, you will see the positions shuffle around and give different options for where the mainbody is displayed in addition to various widths for each. With four total columns, there is not much room to have widely-varying column widths, so let's turn off one of the columns by disabling the modules in the sidebar-c module position using our modulemanager. Below, you will see how the default layout is currently set to display when we have only two sidebars published:

As you can see, it's set for the two sidebars to be displayed on the right (each taking up two grid units) while the mainbody is on the left occupying eight grid units. Dragging the slider to the right will provide a wide variety of layout options. As you can see below, this example shows a layout of 3 | 6 | 3, where the mainbody is in the middle:

After clicking the Save or the Apply button in the toolbar, you will be able to see this layout applied to the frontend:

Advanced

Layout Mode :

Select between responsive and fixed modes.Fixed layout modes do not have mobile support.

Load Transition :

Enable or disable the page loading transition effects.

Display Component :

The Display Component option allows you to enable/disable the output of the Joomla component on the front page. This is useful for sites and templates that want to make use of a front page that consists entirely of modules, with only subpages showing the Joomla component output.

Mainbody Enabled :

The Mainbody Enabled option allows you to enable/disable the entire mainbody section. This is useful for sites and templates that want to make use of a front page that consists entirely of modules with only subpages showing the Joomla component output.

RTL Support :

RTL means “right-to-left” and is a key component when trying to deliver a website in an RTL language such as Hebrew, Arabic, Urdu, etc. Gantry has built in RTL support which will automatically “flip” the content layouts and ordering to support RTL. This option allows you to enable/disable the built-in RTL support which is automatically detected and displayed based on the language file setting.

Page Suffix :

The Page Suffix option allows you to enable/disable page suffix classes being appended to the body tag. With this option enabled, any page suffix classes used for particular pages in joomla will have that suffix added to the body tag to allow for styling and customization on a page by page basis.

Selectivizr :

Enable or disable Selectivizr support for IE8 providing support for additional CSS selectors for better compatibility.

Less Compiler :

Less is used for all the CSS, which is a server side compiler. These options allow you to determine the delay on that compiling process, whether CSS compression is also infused within it, or if you wish to debug the header. There is also a button to clear the LESS cache.