Virtuemart 2.0.8 How to set the image size

[Slixis]

Hello,
On my website I use virtuemart 2.0.8. When I click on details of the products, I get a larger image that appears when one does not click on the zoom (see here: http://www.afrikstore.com/index.php?option=com_virtuemart&view=productdetails&virtuemart_product_id=4&virtuemart_category_id=4&Itemid=439 ).
I want the image size is small initially and enlarges when you click on zoom like here ( http://demo.virtuemart.net/index.php?page=shop.product_details&category_id=11&flypage=flypage_default.tpl&product_id=28&option=com_virtuemart&Itemid=12&vmcchk=1&Itemid=12 ).
How can I do this?
Thank you for your assistance.

[John2400]

mmm<

The small to large image presentation is standard with VM.

You should not have to do anything to get this on your site -. Change your template for a minute and see if the image changes. Also if you upload an image initially - make it a little smaller - try not to upload images of '4 meg' as an example try under the 400kb and also version 2.0.8 ? version as there is version 'e' out at present.

[Slixis]

Hi John2400,
Thank you for your informations.

I found a solution for those who have the same problem with virtuemart 2.0.8
You edit the file defaut_images.php (components/com_virtuemart/views/productdetails/tmpl/defaut_images.php )

And replace:

<div class="main-image">
<?php echo $this->product->images[0]->displayMediaThumb('class="productimage" border="0"', true, "class='modal'", true); ?>
</div>


with

<div class="main-image">
<?php echo $this->product->images[0]->displayMediaFull('class="medium-image" id="medium-image"', false, "class='modal'", true); ?>
</div>

this may perhaps be useful to other members.

[rvbgnu]

Hi Slixis,
To avoid any loss of your modification with the next VM update (and it is true for any Joomla core file and extensions), you use the template override feature:
- instead of editing defaut_images.php (components/com_virtuemart/views/productdetails/tmpl/defaut_images.php ), copy it to templates/[your_template_name]/html/com_virtuemart/productdetails/defaut_images.php ; create the folders if necessary
- edit this new file as you wish, it should not be overwritten by any updates, except if it already exists in your template
- when you update VirtueMart, just a quick diff to compare if you need to update it to avail of a new feature.

More info here
http://docs.joomla.org/How_to_override_the_output_from_the_Joomla!_core
and here
http://dev.virtuemart.net/projects/virtuemart/wiki/Hints_for_the_use_of_the_template_system

[vis18neu]

This solution doesn't work at my site, I cannot figure out why I cannot enlarge the main/only product image. Only medium image is shown, without the possibility to zoom in /enlarge the photo. What could be the problem?

[vis18neu]

I thought that the problem might be in using VM upgrade so I've just tried completely fresh Joomla (2.5.6) and VM (2.0.8e) installation - I have the same problem. If a product has only one image, product details page opens with that image and without the option to enlarge it. What could be causing this, even in fresh installation?

[John2400]

Vision,

When you are in the category section and you see all the products - there you can click on the thumbnail and it will enlarge.

* if you the click on the details of one product and you jump to the product page - and you see just one image. From there - there is no second click to enlarge the image -  But < BUT  -- the image should be quite large.

Now - from this point you can purchase -zoom software - or try the post that is floating around that tells you how to set it up for free.

here is one : http://www.magictoolbox.com/magiczoom/
http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/
https://www.flexiblewebdesign.com/Virtuemart-Extensions/Flexible-Virtuemart-Zoom-Effect-on-Product-Page

[rvbgnu]

I thought that the problem might be in using VM upgrade so I've just tried completely fresh Joomla (2.5.6) and VM (2.0.8e) installation - I have the same problem. If a product has only one image, product details page opens with that image and without the option to enlarge it. What could be causing this, even in fresh installation?

No thumbnail below the large product image? I think that's the normal normal behaviour since 2.0.8:

VirtueMart 2.0.8 released, Good wine needs time to mature, Cheese too, and Virtuemart 2 is no exception
[...]
Fixes:[...]
When only one product image is available, it will not display the small little image any longer
[...]

from http://virtuemart.net/news/list-all-news/421-virtuemart-208-released-good-wine-needs-time-to-mature-cheese-too-and-virtuemart-2-is-no-exception

Then, if your original image a very large (more than 600 or 700 pixels wide, if you add, in your own custom css stylesheet, something like

Code Select Expand

img.medium-image {width: 350px;}
for a simple template
OR depending of your template complexity and the number of different product details pages you are using

Code Select Expand

.productdetails-view img#medium-image {width: 350px;}

It should look better 
And if you want to keep the thumbnail below, even if there is only one image to display, and clicking on the thumbnail opens a modal box with the large image, keep in your template override the code like describe further up (that's what I am using and it works great !)

[vis18neu]

I've never said I want to keep the thumbnail bellow the image, I had a problem with not being able to click on that one single image to enlarge it. I've resolved it by changing default_images.php file, now I have one image but I can click on it to enlarge it.

[Georgios Kolomvos]

If you just want the thumbnail to be shown below the main product image, even if the product has only one image, then modify the file components/com_virtuemart/views/productdetails/tmpl/default_images.php

at about line 33 from

Code Select Expand


if (!empty($this->product->images) and count ($this->product->images)>1) {


to

Code Select Expand


if (!empty($this->product->images) and count ($this->product->images)>0) {


i.e. change >1 to >0 only so that the thumbnail is shown when the number of product images is >0.
It's that simple