browse

The browse template group is one of the largest template groups in VirtueMart. It controls the layout of the product listing page for categories, manufacturers, and search results. The browse templates actually comprise two different types: the browse template proper and the templates for various elements on the browse page.

The browse page has a number of elements on it including the header, the navigation, the sort order, additional information such as featured products, latest products, related products, and so on. Also, it has the product summary list which is what we referred to as the browse template proper above.

Each category can have its own browse and product detail template which can be changed in the category edit page. This so called "browse" template is actually the browse template proper. There are quite a number of browse templates to choose from. This is the template that controls the layout of the product summary for each individual product. If there is no category template defined, the default template, as defined in the theme configuration, is used. The default template also applies to the case of the manufacturer product listing and search result listing.

For the other elements on the browse page, there is only one template within the same theme. That means, if you want to show a different view of the navigation depending on the category, there is no way that you can achieve this by writing a different template. You can do so only by customizing the template, however, as we shall see.

While we have no control over most of the elements on the browse page without hacking into the templates, there is one exception to this rule. VirtueMart does allow users to change the style of the browse page, based on the site's needs. Specifically, you can change the browse page style to table style, list style without using HTML table, or list style without HTML table, as we have explained in the VirtueMart configuration section above. Each of those styles has a corresponding template in the includes subdirectory under the browse directory. If you want to use a different style based on a user or category, you will need to hack into the template.

We will have more to say about the browse templates in Chapter 3, Product List Templates.

product_details

Just like the browse template group, the product_details group comprises two types of templates: the flypage template proper and the flypage elements template.

You can specify the flypage template proper based on the category in the category edit page. If no flypage template is selected, the default template, as defined in the VirtueMart configuration, will be used. In addition to this, you can override the flypage template through the URL request parameter. Let's assume you have two templates in the theme named as flypage.tpl.php and special.tpl.php and the default template is flypage.tpl.php. The URL

http://your_joomla_live_site/index.php?option=com_virtuemart&page=shop.product_detail&product_id=1&flypage=special.tpl will display the flypage using the special.tpl template instead of the default template or even the category template, if one has been defined.

The flypage template proper is probably the most commonly customized VirtueMart template. There is a lot of stuff that you can customize here. You have all the product fields in the data table at your fingertips. You can choose to show or not show any of those fields. You can also control whether to show product type parameters, the price, the add-to-cart button, the product review, product review form, related products, more images, recent products, and so on.

Many of the elements on the flypage have their own template. The addtocart element templates are found in the includes subdirectory. You can change the way the advanced attribute or the custom attribute are displayed. If you don't want to use a drop-down for your advanced attribute, for example, you can use a radio button instead by customizing the addtocart_advanced_attribute.tpl.php template. The same will apply to the custom attribute. We will work on an exercise of this type in Chapter 4, Product Details Templates. The display of child products is also determined by the addtocart templates. By default, child products are displayed as a drop-down. However, you can choose a different style for individual products on the product edit page.

Other than the addtocart templates, some flypage element templates are placed in the common template group instead.

basket

The basket templates will control the layout of the cart contents on the shopcart page as well as the cart section throughout the checkout pages. There are four templates in this group, two for the case where the cart contents will be editable and two for the case when the cart contents are read only. The read-only templates are used in the final confirmation page. Otherwise, the cart will be editable. The read-only template files have a prefix of ro_ (stands for read only) in their names.

In each of the two cases, the template labeled as b2c (that is, business to consumer) will show tax information, if the shopper is logged in when the tax rate can be calculated. The template b2b (business to business) will not show tax information until the very end.

As from version 1.1.5, VirtueMart introduces a new template in the basket group for PayPal express checkout. This template will show PayPal features to enable a shopper to checkout through the PayPal express module instead of the normal VirtueMart checkout path.

checkout

Checkout is actually a different VirtueMart module for handling all stuff during the whole checkout process. There are a number of pages related to this and most of the related templates are placed in the checkout template group.

First, there is a login/registration page where shoppers will need to provide billing information to the system. The login form has its own template and is placed under the common template group. However, the layout of the login/registration form is controlled by the template login_registration.tpl.php in the checkout group. Actually, the display of user data is done mostly in the ps_userfield class. So, if you want to change the user field display, do not look at this template. You will need to customize ps_userfield.php instead. However, if you have a problem with the accordion effects for the login and registration form, this is the right template to look into.

After billing information is available, either through login or input through the registration section, the shopper may be required to enter the shipping information. This brings up the get shipping address page. There is a template get_shipping_address.tpl.php to control the layout of this page. VirtueMart also has a template customer_info.tpl.php to control the layout of the shopper information and a template list_shipto_addresses.tpl.php to list the shipping addresses.

Similarly, there is a template for getting the shipping method and for getting the payment method. As shipping requirement varies greatly among the providers, it may not be wise to dictate the final format of the detailed display. Thus, you will find that the template list_shipping_methods.tpl.php basically does nothing. The detail of the shipping method display is the responsibility of each individual shipping method. In case you need to customize the display of the shipping rates, you may need to hack into the shipping method code instead of the templates.

The display of the payment method is pretty much similar. VirtueMart thus controls the display tightly through its own template list_payment_methods.tpl.php and its own code in the ps_checkout class. In case you have a custom need, you can modify the template. However, you will need to hack into the class file for any detailed changes.

After the payment method is selected, all the information for the order is pretty much available. VirtueMart will show a confirmation page to get confirmation from the shopper before committing the order. The page layout is controlled by the template get_final_confirmation.tpl.php. There is a lot of processing logic included in this template, so customizing this template is not easy for novice coders. Perhaps, what you can modify is moving around the different sections of coding on the script to lay out the elements differently.

The last template we need to mention in the checkout group is the template checkout_bar.tpl.php, which controls the checkout bar showing up during the course of checkout.

order_emails

order_emails is the simplest template group in VirtueMart. There are only two templates within this group. The template confirmation_email.tpl.php controls the layout of the order e-mail or otherwise known as the invoice to the shopper and administrator. There is a wealth of data passed to the template and there are lots of customization possibilities. We will go into the detail of this template in Chapter 10, Additional Customization Possibilities.

The other template enquiry_email.tpl.php in this group concerns the reply to a shopper when he/she sends a question to the store admin. This is a very raw e-mail. If you constantly have enquiries of this sort, you will definitely want to customize this template to make the reply look better.

common

The common template group contains templates that are shared among different pages or even different modules. Thus, the nature of the templates varies greatly.

Basically, you can guess the function of the template by looking at the filename. Some of these templates will be referred to throughout the book. We will give some explanations on them when they are used, especially for those more complicated templates. Otherwise, you can check the details in the Appendix, VirtueMart Template Reference.

pages

The pages template group controls the layout of the VirtueMart page that has the same name. Not all pages have a corresponding template. However, if a page does, you will have some fine control over its layout. The pages that have a template are:

Again, we won't go into the detail of each template here. Explanation will be given for those more complicated ones when they are referred to throughout the book. Otherwise, you can check the Appendix, VirtueMart Template Reference for details on each template.