How to change the "standard product" layout for the "top ten products" layout

[psalamon]

J2.5.11 VM2.0.20b
I have a customer site that need to have the product image 100% of the width, as sales depend on viewing the image.
Please need someone to tell me how to change the standard layout which only gives 25% of the width to the image, for the "top 10 products" layout which gives the image 100% of the width. (The detailed product view is OK).
I am attaching an image that explains my need.
(I tried to understand the posting about "views" but unfortunately I did not understand the explanation...)
thanks,
Peter

[attachment cleanup by admin]

[jenkinhill]

You do not have the default top 10 layout, so I assume you are using a commercial template with overrides. The default VM layout is almost identical to what you want to achieve!

Compare your override file which will be  [your-Joomla-template]/html/com_virtuemart/virtuemart/default_products.php  (although it is just possible that the template devlopers used a different name for that file)  with the default file at components/com_virtuemart/views/virtuemart/tmpl/default_products.php

I suggest you edit the default file if necessary to include any template specific classes and use the edited copy to replace the current override.

As a quick check before editing, try renaming the override file so it is not read by VM which will then use the default template file.

[psalamon]

Hi Kelvyn
The site uses a template I constructed with Artisteer 4;
I switched the template to Atomic, and get the same thing (see images of how products are shown for "top ten" and for regular products under a category).
Where can I learn the basics about templating for VM, what is an override, etc.?
Thanks for your time
Peter

[attachment cleanup by admin]

[jenkinhill]

It is important when testing modules in a different template to clear Joomla's cache first - Site/Maintenance/Clear cache
I have attached an image of the VM default top10 layout VM2.0.22a on Beez20.

Problem with Artisteer is that it does not generate the full standard Joomla set of css definitions, so although you have atemplate the problems start when you try to style extensions.

Reading material:
http://docs.virtuemart.net/tutorials/33-templating-layouts.html
http://www.ostraining.com/blog/joomla/overrides


[attachment cleanup by admin]

[psalamon]

Problem SOLVED!!!!
I played around with firebug, and tweeked line 135 of vmsite-ltr.css converting 30% into 100% and it did the trick.
see the images...
I still want to learn how to do this without tweaking forcefully the code, but actually changing the code "somewhere" to style it the way I want.
thanks!

[attachment cleanup by admin]

[Maxim Pishnyak]

I still want to learn how to do this without tweaking forcefully the code.

Could you more elaborate?

[psalamon]

Of course.
There are 3 types of products that are sold in virtual stores:
1. the ones that depend 99% on the image and 1% on the text. i.e. t-shirts, jewelry, fashion, etc.
2. The ones that depend 50-50% image and text. (i.e. cell phones, laptops, etc where the specifications are as important as the image
3. Books, music CD's, etc., where the textual content is important, the image is 1%.

The standard layout category-product that VM offers is the less used one, as the image is very small, and can only be appreciated when clicking for the details of the product... this should be ammended at the source, and there should be in the views an alternative layout like the one shown in my posting.
I have read many times the documentation regarding "overriding template" and I still do not get it... I would like to understand what is it I have to do in order to have this or that layout... without going into a blind chase, tweaking here and tweaking there...

[Maxim Pishnyak]

I assume we're talking about category page layouts.

"overriding template" means that you have a couple default1.php, default2.php etc in your templates/you_website_template/html/com_virtuemart/category/ folder

Each defaultXXXXX.php could be customized with the help of CSS rules.

Customized defaultXXXXX.php could be assigned to specific category.