General Documentation 2008 Template Documentation Top Shop Documentation
Top Shop Documentation
The TopShop Joomla template was released in October 2008.
The following steps will help you to work better with the TopShop 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 TopShop 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.
An extra step when configuring Virtuemart Quickstart packages
When installing the quickstart package with Virtuemart there is one extra step in the process that needs to occur before your Joomla?Virtuemart simple shop is ready to be populated. Virtuemart stores the site url in a file called virtuemart.cfg.php - this site url does not update in some cases and so the VM config file needs to be edited. You can find this file in the administrator/component/com_virtuemart folder for your joomla installation.
1. Open the file and scroll down to lines 35 and 36. Where you may see a reference to the localhost. Replace this text with the url of your site.
eg: http://192.168.1.5:8888/joomla/quickstart/J158_simpleshop/ should become http://www.yoursite.com/
Once this occurs and the setting takes hold the images for the quickstart will appear and you will be able to successfully navigate through the Joomla installation.
Extensions used on the demo site
Extensions used on the demo site include:
- Extended menu - Superfish and Panel menus
- Virtuemart Carousels
Installing the extensions
Installing the modules.
Layout and module positions
Top shop has a good array of module positions available for you to use on your Joomla site.
It is possible to create a two column layout with two larger columns - this is what you can see on the front page - or you can have a more standard left column alignment with a larger main content body to the right.
We have made the setup of this template as simple as possible so there is no need to worry about applying class suffixes etc in order to get your site looking like a shop. Here is a quick overview for the module positions available and the module variations.
- In order to achieve the layout as shown on the front page of the demo you need to publish a module to the advert1 position and ensure that there are no modules published to the left position.
- In order to create the sub page variation, ensure that there are no modules published to advert 1 and that there is at least one module published to the left position.
- The cart will automatically appear like the demo when you publish it to the User2 position and will automatically generate the shopping cart styling.
- The Suckerfish menu is published to User3.
- The Virtuemart Carousel is published to User 5.
- The front page of the demo has a module published to Advert 1 and no modules published to the left position.
- The sub pages have an extended menu published to the left position and no modules published to advert1.
- The menu at the bottom of the demo site is a standard Joomla menu published to the bottom menu and has the flat list style applied to it. In Joomla 1.5 this is known as a legacy flat list.
The image below highlights the modules available for the front page layout option.
The image below highlights the modules available for the sub page layout option.
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.
