The following documentation explains the installation and configuration process of VP ProMart Joomla Template.

Installation

In the download section of VP ProMart you will find two zipped packages:

1. Template Package
2. Quick Start Package

Template Package

This is a Joomla Installer Package which includes the VP ProMart Template (tpl_vp_promart-j2.5.zip) and VM Simple Slideshow Product Module (mod_vm_simple_product_slideshow.zip). You can install the package (pkg_vp_promart-j2.5.zip) itself through your Joomla Extension Installer and which will install the Template and the Module together to your site making your life little easier. After installation you can view this package as "VP ProMart Package " at your extensions list as a Package. If you uninstall the same then it will also uninstall the template and the module from your site.

Alternatively you can also unzip/unpack the package file at your Computer first and install the template and the module one at a time through the Joomla Extensions Installer.

IMPORTANT: It is very important that you disable VirtueMart CSS and VirtueMart jQuery option in your VirtueMart Configuration area after installation of the template in your site. The template has its own jQuery library and VirtueMart Style sheet. So you do not need VirtueMart CSS and VirtueMart jQuery when you are using VP ProMartMart template. If you do not disable these options you may face JavaScript errors and CSS conflicts.

Quick Start Package

This is the Quick Start package of the template built on Joomla 2.5.9 and VirtueMart 2.0.18a. This will give you an exact clone of the demo site.

How to Install Quick Start Package?

A Quick Start package is a complete Joomla Installation package which includes Joomla, VirtueMart and all Demo contents. You do not need to install Joomla separately for this. The installation process in exactly same as standard Joomla Installation process which you can find here: https://docs.joomla.org/J2.5:Installing_Joomla

During the installation process you will find a button called "Install Sample Data" which you need to click to install the demo contents at your site.

Quick Start Package Installation Process:

1. Download the quick start package from the download section of our site.
2. Upload this zipped file to the public_html of your site i.e the root folder of your site using FTP or file manager in your hosting account cPanel.
3. Extract this zip file using the extract button in your root folder.
4. Go to phpMyAdmin in cPanel and create a database taking note of the username, password and name of the database.
5. Open your favourite browser type your domain and the normal Joomla installation process will start. Follow all the steps and when you come to the database site fill in the database details you created in step
6. Remember to install sample data because then only the demo contents will get installed in your site.

After the installation is completed open your Joomla database using phpMyAdmin tool and follow the below steps. Change jos with your database prefix as it will be different for each Joomla Installation.

1. Open jos_users table.
2. Find record with Super User name and click on edit icon.
3. Change Super User id value to 883 and click on "Go" button.
4. Open jos_user_usergroup_map table.
5. Find the record with group_id value 8, change user_id value to 883, then click on "Go" button.
6. If you are logged into the backend please logout and login again.

Configuration

If you are using the Quick Installer Package then these steps are not required for you as quick installer gives you a preconfigured site. However we recommend you read through this documentation which will help you to understand the features and functionality of the template.

When the installation is completed please follow these steps:

Template Settings

Go to Template Manager and open the template. You can switch between the template styles, assign your Logo, change the background etc from here. Please check all the options. They are pretty simple to understand and should not need any further explanantion. See the below screenshot for ready reference. If you need any help then you can always contact us over our Support Forum.

Modules

The Template comes with 17 Module Positions. And you can check the demo site to see them in action and for better understanding. List of all these module positions are give below:

1. top-menu
2. language
3. currency
4. mini-cart
5. menu
6. search
7. banner
8. top
9. breadcrumbs
10. left
11. main-top
12. main-bottom
13. right
14. bottom-1
15. bottom
16. footer
17. debug

Here is a quick list about the Important Modules and its respective positions. You need to publish/enable these modules at respective positions as per the list.

#	Module Name	Module Position
1.	Main Menu Module	menu
2.	Top Menu Module	top-menu
3.	VirtueMart Mini Cart Module	mini-cart
4.	Joomla Language Switch Module	language
5.	VirtueMart Currency Module	currency
6.	VM Simple Slideshow Product Module	banner
7.	Breadcrumbs Module	breadcrumbs
8.	Search Module	search
9.	VirtueMart Product Module	main-top/main-bottom
10.	Footer Module / Footer Menu	footer

VM Simple Slideshow Product Module

This Module has been developed by us and being introduced along with VP ProMart. It allows you to show VirtueMart Product (Featured, Latest, Random or Top Ten) with a Professional Slideshow. We are using this module at the banner position of the Home page. If you open this module for your Module Manager then you will see the following options.

Under the Basic Options you can alter the settings for the Slideshow just like standard VirtueMart Product Module. Apart from that it includes two new options:

1. Which Image to be used in Slideshow: Your product can have multiple images and you can decide to show which of these images to be used for the Slideshow. Examples: '0' stands for the 1st image, '1' stands for the 2nd image, '2' stands for 3rd image. Default value is '0'. We recommend to keep it as it is. Alter this only when all your products has multiple images.
2. Display Style: VP ProMart has its own HTML Override for this Module. So changing this feature is disabled with the template.

Since VP ProMart has its own HTML Override for this Module, you need to select Load Style CSS and Load jQuery options to 'No'. Please remember to enable Load Javascript option.

VirtueMart Features

We have introduced few new features for VirtueMart in VP ProMart. We will explain the use of these features one by one.

Quick Look

When you mouse over a product in Product Listing Pages or in VirtueMart Product Module then you will see a button appeared as Quick Look. We you click on this then a smaller version of the Product Details page will appear in a Modal window from where you can either add the product to the cart or go complete product details page.

Full Width for Product Details and Cart Page

The side modules are not always required to be shown in Product Details and Cart Page. VP ProMart allows you to disable this the side modules (Position: left & right) from the Template settings.

Product Discount

You can decide to show/hide Product Discount in percentage from Template settings.

Custom Fields

VP ProMart extends the usage of Custom Fields to an extreme level. This usage actually allows you show the product information in much for detailed and convenient manner to the visitor. We will spend some time to under them.

First lets take a screenshot of the Product Details Page:

1. Normal Custom Fields: If you are using any normal custom field (non-cart attribute) like string, image, text area, editor etc keeping Layout position blank then those fields will appear automatically in the tabular content area.
2. Normal Custom Fields with Layout position 'sidebar': If you add any normal custom field (non-cart attribute) like string, image, text area, editor etc keeping Layout position as sidebar then those fields will appear automatically in the top side of the Product Details Page as a Link. The name of the Custom Field will appear as a Link with suffix *. When you click on the link then the Custom Field content will appear in a Modal Window where Custom Field Description will be used for the Title of the Box.
   
   
   
3. Cart Attribute Custom Fields: While creating a Custom Field if you select the option Cart Attribute as Yes then it becomes a Cart Attribute type Custom Field. See the screenshot below for reference:
   
   
   You use Custom Field Type as String or Image or Cart Variant for Cart Attributes. The Layout position for any Cart Attribute should be kept blank as it will automatically shown just above the Add to Cart Button.
   In VP ProMart we have added a special feature by which you can extend the Description of any Cart Attribute by link the same to another Custom Field. Basically what it allows you to create a Custom Layout Position just where the normal description is show. Then you can create a Normal Custom Field with that new Custom Layout position.

How does the Description Field of a Cart Attribute work in VP ProMart?

• Option-1: Description Text: Normal Description.
  It will show the text just below the Cart Attribute in the Product Page.
• Option-2: Description Text: [mycustomposition].
  When you wrap the text by [ ] It will not show this text below Cart Attribute. Instead it will create a new Custom Layout Position where you can add another normal Custom Field as we did earlier for sidebar Layout Position. In this case the name of Custom Layout position will be mycustomposition instead of sidebar.
• Option-3: Description Text: Normal Description || [mycustomposition].
  Some time you may need to show normal text description for the Cart Attribute (as it is required for Custom Field Type - Cart Variant) but also want to add a Custom Layout Position where you can explain it in detailed. In that your text description will first then and the name of the new custom field position will be last. You need to separated them by || as shown above.