General Documentation 2009 Template Documentation Landscape Documentation
Landscape Documentation
The Landscape Joomla template was released in September 2009.
The following steps will help you to work better with the Landscape template. Please follow the instructions and use this item as a guide for setting up your site and configuring the various options found in the template as well as the extensions and scripts that are showcased on the Landscape demo site.
Getting Started
Choosing between the template or the quickstart.
Installing the template.
Choose this option if you already have your site created or have at least made changes to the default Joomla installation and want to overlay this theme onto your site. For a complete installation of the demo site on your server please refer to installing the quickstart package.
Installing the template is achieved using the same method as installing any other template or extension.
Installing the quickstart.
The Joomlabamboo quickstart packages are complete replicas of the particular template's demo site. They are basically the same as the Joomla installation zip except they come with the template, watermarked images and extensions you see on the demo site. They are a quick and easy way to have your site setup and ready to edit.
You can read the tutorial on installing the quickstart packages here.
Extensions used on the demo site
Extensions used on the demo site include:
Installing the extensions
Installing the modules.
Installing the JB Library Plugin Once you have installed this plugin please ensure that the plugin is published. You can do this by doing the following: This plugin inserts a script reference into the head of the template that loads jQuery to load and enables all of the jQuery driven effects on the site to work properly. For more information see the content item for the JB Library plugin.
Configuring the Extensions
Configuring the Template
Snapshot of the template configuration
Menu Scripts
Panel Menu
This option must be enabled if you want to use the panel menu on your site. When enabled the option includes the accordion script in the template allowing the extended menu to take advantage of the funky action and create a sliding/panel menu with your Jooml amenu items. If you decide not to use the panel menu then its best for you to disable this option.
Superfish Transition Type
This option controls the behaviour of the animation on the superfish drop down menu. There are 7 transition settings to choose from - Vertical, Hotizonal, Fade, Horizontal and Fade, Vertical and Fade, Horizontal and Vertical and Fade, Horizontal and Vertical.
Theme Variations
Rainbow Style
This option allows you to select from the following options for the rainbow colour: Apple | Blue | Circus | Dirty | Green | Pale Pink | Pastel | Primary | Red | Rose | Spice | Sunrise | Vintage Blue | Vintage Red | Watermelon. The background image is controlled via class in the template_css.css file and the images are in the images/rainbow folder.
Menu Style
Select the colour for menu. Apple | Blue | Circus | Dirty | Green | Pale Pink | Pastel | Primary | Red | Rose | Spice | Sunrise | Vintage Blue | Vintage Red | Watermelon.
Bottom Tree Colour
Select the colour scheme for forest illustration at the bottom of the page. The image files are located in the template's images/bg folder.Choose between Blue | Green | Light Green | Mauve | Natural | Orange | Pink | Red | Tan | Yellow
Slider Settings
Panel Settings
Panel Closed Text
Select the text to be displayed when the panel is closed
Panel Open Text
Select the text to be displayed when the panel is open.
Internet Explorer 6 Warning
ie6 Warning
If you set this option to yes visitors using ie6 will be given a discrete warning that their browser is outdated and that the site may not work as expected in other more modern browsers.
Layout and module positions
The landscape template has a total of 36 module positions. Please use the image below as a guide. Please note the description of the positions are directly below the image.
Module position overview.
| Position |
Description |
|
panel1 panel2 panel3 panel4 |
The panel1 to panel4 module positions are displayed at the top of the site and are hidden via the JB Drop Panel. The panel trigger is automatically displayed whenever you have a module published to any of the four modules positioned here. The demo site has an instance of the core login module, lates news, popular items and the Example Pages menu displayed in these positions. |
| topmenu |
This position sites above the main logo area and on the demo site contains a default Joomla menu published as a flat list. It is aligned to the right but will stretch to the full width of the page. |
| menu |
The menu position is the main nav for the site. You need to publish the extended menu module in this position and use the settings according to the superfish article. The menu needs to be published as a flat list to display the same way that it does on the demo site. |
|
grid1 grid2 grid3 grid4 |
The first row of the grid contains the modules: grid1, grid2, grid3 and grid4. These modules divide evenly across the page according to how many modules you have published. For example four modules take up 25% of the width, three modules take up 30% of the width two modules take up 50% of the width and one module takes up 100% of the width. |
|
grid5 grid6 grid7 grid |
The second row of the grid contains the modules: grid5, grid6, grid7 and grid8. These modules divide evenly across the page according to how many modules you have published. For example four modules take up 25% of the width, three modules take up 30% of the width two modules take up 50% of the width and one module takes up 100% of the width. |
|
grid9 grid10 grid11 grid12 |
The second row of the grid contains the modules: grid9, grid10, grid11 and grid12. These modules divide evenly across the page according to how many modules you have published. For example four modules take up 25% of the width, three modules take up 30% of the width two modules take up 50% of the width and one module takes up 100% of the width. |
| left |
The left position sits to the left of the main content area. The demo site uses a standard Joomla menu module set to flatlist and expand menu items with active parent highlighting on some pages and where you see the accordion menu published its using the accordion menu script with the extended menu module. See the content item on the accordion menu item. |
| advert1 |
This module position sits above the main content. The demo site does not use this position. |
| advert2 |
This module position sits below the main content. The demo site does not use this position. |
|
grid13 grid14 grid15 grid16 |
The second row of the grid contains the modules: grid13, grid14, grid15 and grid16. These modules divide evenly across the page according to how many modules you have published. For example four modules take up 25% of the width, three modules take up 30% of the width two modules take up 50% of the width and one module takes up 100% of the width. |
|
grid17 grid18 grid19 grid20 |
The second row of the grid contains the modules: grid17, grid18, grid19 and grid20. These modules divide evenly across the page according to how many modules you have published. For example four modules take up 25% of the width, three modules take up 30% of the width two modules take up 50% of the width and one module takes up 100% of the width. |
|
grid21 grid22 grid23 grid24 |
The second row of the grid contains the modules: grid21, grid22, grid23 and grid24. These modules divide evenly across the page according to how many modules you have published. For example four modules take up 25% of the width, three modules take up 30% of the width two modules take up 50% of the width and one module takes up 100% of the width. |
| bottom |
The bottom position sits below the main template container. The demo site has a standard Joomla menu module publishedhere set to display as a flat list. |
| debug |
The debug position is the second last module position and can be used to test script and module output. |
| analytics |
The analytics module is at the very bottom of the page. In the template its placed just before the closing body tag which is an ideal place to position your analytics tracking code or anyother javascript that needs to be positioned at the bottom of the page. |
Menus
Superfish menu
1. Install Extended Menu module v1.06 for use on Joomla 1.5.
2. Install the module by using the Joomla module installer.
3. Publish the module to the module position called menu or in older templates to the top position.
4. Disable the module title.
5. Select the menu you want to use.
6. Select flat list as the menu type.
7. Set expand menu to yes.
8. Set use menu template to yes.
9. Set the menu path to superfish/menu.html if its not already set.
Here are some screenshots of the admin panel so you can see exactly the way we have created the drop down effect.
Panel Menu
The Panel Menu is an accordion like menu effect that utilises the extended menu module and presnt your menu items in a sliding panel based menu. Its ideal for displaying a large number of links with a small footprint. The setup for the accordion menu is pretty much the same as the superfish menu except for one key difference - instead of using the superfish/menu.html template the menu uses the accordion/menu.html template. 1. Install v1.05 of the extended menu module if you havent done so already. 2. Publish the module to either the left, right or inset position depending on your layout configuration. 3. Disable the module title. 4. Select the menu you want to use. 5. Select flat list as the menu type. 6. Set expand menu to yes. 7. Set use menu template to yes. 8. Set the menu path to accordion/menu.html if its not already set. Here is a snapshot of the settings used to generate the panel menu.
working with JB Slider
The Landscape template has a jQuery driven slider built into the template. Its incredibly easy to use and all thats required is for you to publish at least two modules to slide1, slide2, slide3 or slide4 module positions and the template will do the rest.
You have probably already seen the slider on the front page of the Landscape demo but here is a screenshot.
The icons in the slider are controlled via the template parameters - go to Extensions > Template Manager and click on the JB Landscape template. You can select from 77 different slider icons to use as triggers to slide your content into view. The icons themselves are located in the images/slidericons folder of the template so its relatively easy to open up an icon and edit or replace with a different image of your choosing.
Here is a screenshot of the parameters available in the template administrator.
The icons come from the amazing resource over at Icons etc - top quality free icons freely available for download. You can visit the demo site to preview all of the icons used in the JB Slider for the Landscape template.
working with JB Drop Panel
The JB Drop Panel is a flexible 4 module drop panel you can use on your site to create a secret panel area for hiding useful but not necessarily priority website content. Using the drop panel is as simple as publishing any module to the panel1, panel2, panel3 or panel4 positions.
The trigger for the panel automatically appears at the top right of the screen whenever any of these positions have modules published to them.
You can control the text for the button that triggers the drop panel in the template administrator. Changing the open and close text is as simple as changing two fields in the template administrator.
back to top
