Knowledgebase

Joomlabamboo template and extension documentation

Ignite Documentation

Compatible with Joomla 2.5 / Joomla 3+ and uses the T3 framework .

Please note: This template uses the T3 framework. You can download the latest release of the T3 plugin directly from the T3 GitHub repository.

Need help getting started?

The following links may be helpful if you are new to Joomla, T3 or our templates.

 

Useful T3 documentation

If you are new to T3 please read through the following resources to better acquaint your self with how T3 works.

 
 

Starting with Ignite from a fresh installation.

The following steps outline the process involved for setting this template up in a new or existing Joomla installation. Please note: We recommend users use our quickstart packages if they have the opportunity to start completely from scratch.

Elements to install

  • Install the Ignite template and make it the default - Download
  • Install and enable the T3 Framework plugin - Download
  • Install JB Type - required for typography and font icons - Download
  • Install Zentools - slideshows, banners, grids etc - Download

Elements to modify

  • Change the position of the "Main menu" module to the "menu" position.
  • Set the "Show Title" setting of the main menu to Hide.
  • Remove the module and menu classes nav_pills and _menu in the advanced parameters for the menu module.
  • Change the position of the breadcrumb module to the "breadcrumbs" position.
  • Ensure that the module title for the breadcrumb module is also set to hide.
  • Depending on your needs you may like to set this module to not appear on the front page via the menu assignment settings in the module.

What's next?

At this stage you will have a very basic looking template ready for you to customise, add your content and start setting up the other modules you can see on the demo for the Ignite template.

For more information on replicating the front page layout or other extensions used on this site please read the information provided on the frontpage and extensions tab.

Using Virtuemart with Ignite.

Please note that there is an extra step required for using this theme with Virtuemart.

So as to not load unnecessary css rules in your template and at the same time take advantage of the Theme Magic / Less styling for this theme, it is necessary to manually include the virtuemart less file. Unfortunately there is no easy way to do this from within the T3 interface and so it is necessary to do this either live on your server or after unzipping the files on your hard drive.

After installation follow these steps:

  • Locate the templates/Ignite/less/ folder
  • Open the template.less file.
  • Look for the following line: //@import "extensions/vm.less";
  • Change this to @import "extensions/vm.less";
  • hika-commented

Remove the Hikashop less file from the less compiler.

  • Locate the templates/Ignite/less/ folder
  • Open the template.less file.
  • Look for the following line: @import "hika.less";
  • Change this to //@import "hika.less";
  • hika-commented

After performing the actions above please visit the template administrator and hit the compile less to css button.

We apologies for the extra step involved in using this theme with Virtuemart.

Available module positions

Please note that Ignite uses two distinct template layouts to separate the frontpage and sub page layouts. These different layouts are defined in the template settings under the layout tab. The demo uses the home layout for the frontpage menu item while the default layout is set to default for all other pages.

For more help with this please read the How to assign a template to a specific page in Joomla 3.

Default layout

Ignite-modulepositions

Home layout

Ignite-Home-Layout

Template colour schemes

The following colours are the primary and secondary colours used in the ignite template styles.

blueblue

 
 

bluered

 
 

ecogreendark

 
 

orangeblue

 
 

orangegreen

 
 

redblue

 
 

redbluedark

 
 

redgreen

 
 
 
 

Module Classes

About module class suffixes

Module classes are a core Joomla functionality that allow the user to specify how a specific module will appear. The class itself is added to the module in the module parameters.

Combining module classes:

Module classes can be combined to take advantage of multiple complementary styles. An example of a module class suffix using a combination of classes: "hot primary1 top50".

Structural classes

Structural classes can be used to change the general layout or structure of a module.

  • nopadding - this class removes all padding that may be set by default by the template.
  • The following classes are micro adjustment classes that allow you to adjust the top offset of a module in increments of 25px. They start at 25 and move through to 500px offsets in 25px increments.
  • top25
  • top50
  • top75
  • top100
  • top125
  • top150
  • top175
  • top200
  • top225
  • top250
  • top275
  • top300
  • top325
  • top350
  • top375
  • top400
  • top425
  • top450
  • top475
  • top500

Appearance classes

Our themes use a combination of two colours to determine the colour scheme for each template style. In general the colours are determined by the following formula:

  • primary1 - uses the base primary colour
  • primary2 - uses a colour 15% darker than the default primary colour.
  • primary3 - uses a colour 15% lighter than the default primary colour.
  • secondary1 - uses the base secondary colour.
  • secondary2 - uses a colour 15% darker than the default secondary colour.
  • secondary3 - uses a colour 15% lighter than the default secondary colour.
  • dark
  • light
  • inset
  • shadow
  • shadow2
  • border
  • corner
  • hot
  • new
  • icon icon-[icon name]

Mobile classes

Module classes for mobile viewing (mediaqueries classes).

ClassMobile max-767pxTablets 768px to 979pxDesktop min-980px
.visible-phone Visible
.visible-tablet Visible
.visible-desktop Visible
.hidden-phone Visible Visible
.hidden-tablet Visible Visible
.hidden-desktop Visible Visible

Frontpage Overview

ignite-frontpage

Description

Frontpage setup

The Ignite template uses two distinct template layouts. Please note that the home page layout is quite different to the main or default layout so in order to replicate the demo site configuration you need to ensure that you have the home layout assigned to the template style you have assigned to the front page menu item.

Also please note that the quickstart package for the Ignite template does not contain the required files for the Hikashop extension. You can download the free version of Hikashop on the Hikashop site.

  • Menu The menu position holds a standard Joomla menu module. You can assign the template to use the T3 mega menu in the template settings. The width of the menu can be controlled under the theme parameters in the template admin.
  • Cart The Hikashop cart module is published to the module position called cart which sits to the right of the menu. The width of the cart module can be controlled under the theme parameters in the template admin. Please note that for the best display the Hikashop cart should be set to use the min0cart option int eh module settings.
  • Logo The logo is generated by the template and controlled in the template settings. The default template uses text as the logo type and the google font called Merriweather Sans.
  • Tagline The tagline is also controlled via the template and can be configured by using the theme menu item in the template admin.
  • SearchThe core Joomla search module is published to the search position. In order to prevent the search label from showing you need to add a single space in the module settings for the search label.
  • Slideshow An instance of the Zentools slideshow is published ot the slideshow position.
  • Slideshow-aside There are two modules assigned to the slideshow-aside position. The top module is a custom html module while the module with the subscribe button is the ACY Mailing subscribe to newsletter module.
  • Feature-1 The Feature-1 position contains an instance of the zentoosl mosule using a grid layout. The grid is set to remove the margin between items and also sets the title image as the overlay.
  • Tabs There are three modules published to the tabs position. They automatically render in the tab layout using the title for the module items for the tab title triggers. The demo uses two instances of the Hika shop content module to display featured and best selling items while the about us module is an instance of the Joomla custom html module.
  • Bottom1, Bottom2, Bottom3 The three modules above the white footer are custom html modules with various text, links and images used to render the content. The icons for the credit cards can be found in the quickstart package or can be downloaded directly from here.
  • Footer The footer position contains an instance of the Joomla core menu module and the Zen Social module.

Extensions used on the demo site

Useful tutorials for working with the T3 Mega Menu

Main Menu