VirtueMart Forum

VirtueMart 2 + 3 + 4 => Templating & Layouts => Topic started by: skhn123 on April 19, 2014, 09:26:45 AM

Title: swap product thumbnail image in category/ product details layout page on hover
Post by: skhn123 on April 19, 2014, 09:26:45 AM
Hello Everyone.
i am using latest VM and Joomla 2.5.17

I searched in forum and i have found these thread but none of these are of my use.
http://forum.virtuemart.net/index.php?topic=86854.0
http://forum.virtuemart.net/index.php?topic=95474.0
http://forum.virtuemart.net/index.php?topic=86854.0

i want to change the main product image to second (additional image) on mouseover. i want to implement this function in category layout and product details layout both.

Here is my code for image display in category page:
<a title="<?php echo $product->product_name ?>" rel="vm-additional-images" href="<?php echo $product->link?>">

<?php
echo $product->images[0]->displayMediaThumb('class="browseProductImage"' false); ?>

</a>


And these are codes for product details page:
<div class="width46 floatleft">
<?php if (!empty($this->product->images)) {
$image $this->product->images[0];
?>

<div class="main-image">
<?php
echo $image->displayMediaFull("",true,"rel='vm-additional-images'");
?>

<div class="clear"></div>
</div>

<?php
$count_images count ($this->product->images);
if ($count_images 1) { ?>

    <div class="additional-images">
<?php
for ($i 0$i $count_images$i++) {
$image $this->product->images[$i];
?>

            <?php
                //echo $image->displayMediaFull('class="product-image" style="cursor: pointer"',false,"");
echo $image->displayMediaFull("",true,"rel='vm-additional-images'");
            ?>

<?php } ?>
        <div class="clear"></div>
    </div>
<?php } ?>
</div>


Any help??

Thanks.
Title: Re: swap product thumbnail image in category/ product details layout page on hover
Post by: skhn123 on May 24, 2014, 15:20:28 PM
Please anyone help me on this.
Title: Re: swap product thumbnail image in category/ product details layout page on hover
Post by: GJC Web Design on May 24, 2014, 16:09:35 PM
Doubtful you will get an answer - this isn't a bug or a configuration issue etc.. you are asking someone to come up with bespoke code for your requirements...
It has to be coded and tested etc etc ...
Title: Re: swap product thumbnail image in category/ product details layout page on hover
Post by: skhn123 on May 26, 2014, 14:15:14 PM
I know that #GJC Web Design. thats why i am asking if someone has done it before, so they can help me out. i have seen some examples but those are for older version i and dont know how to use that in new VM version.

if you have any idea please do share. it will be very helpful to me cause am stuck right now.

thanks
Sadique Khan
Title: Re: swap product thumbnail image in category/ product details layout page on hover
Post by: GJC Web Design on May 26, 2014, 14:17:56 PM
Basically get the second image in the template - put it in a div - probably behind the current image and swap their visibility on mouse over
Title: Re: swap product thumbnail image in category/ product details layout page on hover
Post by: skhn123 on May 26, 2014, 14:21:06 PM
Thanks for such quick reply but that's the major part of my problem that how to call 2nd image of a product.
Title: Re: swap product thumbnail image in category/ product details layout page on hover
Post by: GJC Web Design on May 26, 2014, 14:47:11 PM
foreach($this->product->images as $img) {
      $newimg[] = $img->file_url;
   }
   print 'Debug Line '.__LINE__.' $newimg <pre>'; print_r ($newimg); print "</pre><br />\n";

[attachment cleanup by admin]
Title: Re: swap product thumbnail image in category/ product details layout page on hover
Post by: skhn123 on May 26, 2014, 15:13:57 PM
can you tell me where exactly you put these code in default.php  :-[

i put it in my product details > default.php

right after these lines:

<div class="width46 floatleft">
<?php if (!empty($this->product->images)) {
$image $this->product->images[0];
?>

<div class="main-image">
<?php
echo $image->displayMediaFull("",true,"rel='vm-additional-images'");
foreach($this->product->images as $img) {
      
$newimg[] = $img->file_url;
   }
   print 
'Debug Line '.__LINE__.' $newimg <pre>'print_r ($newimg); print "</pre><br />\n";
?>

<div class="clear"></div>
</div>


but its not working  :(
Title: Re: swap product thumbnail image in category/ product details layout page on hover
Post by: GJC Web Design on May 26, 2014, 15:28:30 PM
components/com_virtuemart/views/productdetails/tmpl/default_images.php - your obviously NOT using the "latest" vm as you state

will work anywhere in that file as it is a $this

must work in yours as $this->product->images is just above it - unless it's empty
Title: Re: swap product thumbnail image in category/ product details layout page on hover
Post by: skhn123 on May 26, 2014, 15:34:41 PM
Actually my template has an override of components/com_virtuemart/views/productdetails/tmpl/default.php and it dont include codes from default_images.php it has code for product image in itself.

i have attached my default.php file as txt file. you can take a look in it if its ok.

[attachment cleanup by admin]
Title: Re: swap product thumbnail image in category/ product details layout page on hover
Post by: GJC Web Design on May 26, 2014, 16:04:52 PM
see no reason why it wouldn't work - does on mine
Title: Re: swap product thumbnail image in category/ product details layout page on hover
Post by: skhn123 on May 26, 2014, 16:07:43 PM
its okey now. its working. thanks for your help.  ;D
Title: Re: swap product thumbnail image in category/ product details layout page on hover
Post by: bart1983 on February 16, 2017, 15:35:59 PM
I have quite similar problem.
On VM 3.0.18.7
I need to put another one picture but in category view (two pictures for one product in category)
The method described above works in product details etc (I tested it), but when I implement it in category view I got error with calling $this, maybe someone did the trick and would be so kind to answer for that :).
There was one topic about that (I found when I was searching), but somebody made changes in core file components/com_virtuemart/cateogry/view.html.php (and I try to avoid that).
OK, I keep searching, and if I find something, will write.
Thanks in advance.