fancybox with productimage virtuemart

31 Posts

philippe.t posted this 14 March 2016

hello
How to display productImage with function fancybox in the in page category where there is list the products

I see in /public_html/templates/yourtemplate/html/com_virtuemart/categor/default_template.php

when you add code productImage there is this code:

<?php if (isset($productItems->productImage)) : ?>
<?php if ($productItems->productImage->imagesExists) : ?>
<?php
$offsetHeight = isset($productItems->productImage->offsetHeight) ? $productItems->productImage->offsetHeight : 0;
$offsetWidth = isset($productItems->productImage->offsetWidth) ? $productItems->productImage->offsetWidth : 0;
$height = 'height:' . (VmConfig::get ('img_height') + $offsetHeight) . 'px;';
$width ='width:' . (VmConfig::get ('img_width') + $offsetWidth) . 'px;';
if (is_object($productItems->productImage->image))
$imgHtml = $productItems->productImage->image->displayMediaThumb('class=" bd-imagestyles"', false);
else
$imgHtml = str_replace('<img', '<img class=" bd-imagestyles" ', $productItems->productImage->image);
?>
<a class=" bd-productimage-10" href="<?php echo $productItems->productImage->link; ?>">
<?php echo $imgHtml; ?>
</a>
<?php endif; ?>
<?php endif; ?>

How to add a productImage just direct to image in fancybox and not direct to productdetail?

regards
philippe.t

hello How to display productImage with function fancybox in the in page category where there is list the products I see in /public_html/templates/yourtemplate/html/com_virtuemart/categor/default_template.php when you add code productImage there is this code: <?php if (isset($productItems->productImage)) : ?> <?php if ($productItems->productImage->imagesExists) : ?> <?php $offsetHeight = isset($productItems->productImage->offsetHeight) ? $productItems->productImage->offsetHeight : 0; $offsetWidth = isset($productItems->productImage->offsetWidth) ? $productItems->productImage->offsetWidth : 0; $height = 'height:' . (VmConfig::get ('img_height') + $offsetHeight) . 'px;'; $width ='width:' . (VmConfig::get ('img_width') + $offsetWidth) . 'px;'; if (is_object($productItems->productImage->image)) $imgHtml = $productItems->productImage->image->displayMediaThumb('class=" bd-imagestyles"', false); else $imgHtml = str_replace('<img', '<img class=" bd-imagestyles" ', $productItems->productImage->image); ?> <a class=" bd-productimage-10" href="<?php echo $productItems->productImage->link; ?>"> <?php echo $imgHtml; ?> </a> <?php endif; ?> <?php endif; ?> How to add a productImage just direct to image in fancybox and not direct to productdetail? regards philippe.t

Last edited 14 March 2016 by philippe.t

virtuemart fancybox displayMediaThumb productImage

Vote to pay developers attention to this features or issue.

6 Comments

Order By: Standard | Newest

Support Team posted this 09 February 2017

Hi,

No, Themler provides only cloudzoom option and you can not change that in the application.

Sincerely,
Hella

Hi, No, Themler provides only cloudzoom option and you can not change that in the application. Sincerely, Hella

86 Posts

Giuma posted this 08 February 2017

Hello Aileen,

thanks for your response.

here I shared my experience on productImage display with fancybox, if this can to serve for everybody.

I am inspired by
/public_html/components/com_virtuemart/views/productdetails/tmpl/default_images.php

In themler , I follow your advice
2.custom scripts should be added under Home >> Settings >> Additional HEAD HTML
write this javascript code
![enter image description here][1]

And in the page products add Insert>>CMS Code >> where you want
and write this php code
![enter image description here][2]

regards
philippe.t

[1]: http://s10.postimg.org/wia8y2qtl/Fancybox_product_Image_HEADHTML_Javascript.jpg
[2]: http://s28.postimg.org/xqnqscy71/Fancybox_product_Image_CMSCode.jpg

Hello it's possible to have a popup in product details gallery and not zoom?

> Hello Aileen, > > thanks for your response. > > here I shared my experience on productImage display with fancybox, if this can to serve for everybody. > > I am inspired by > /public_html/components/com_virtuemart/views/productdetails/tmpl/default_images.php > > In themler , I follow your advice > 2.custom scripts should be added under Home >> Settings >> Additional HEAD HTML > write this javascript code > ![enter image description here][1] > > And in the page products add Insert>>CMS Code >> where you want > and write this php code > ![enter image description here][2] > > regards > philippe.t > > [1]: http://s10.postimg.org/wia8y2qtl/Fancybox_product_Image_HEADHTML_Javascript.jpg > [2]: http://s28.postimg.org/xqnqscy71/Fancybox_product_Image_CMSCode.jpg Hello it's possible to have a popup in product details gallery and not zoom?

Support Team posted this 24 March 2016

Hello Philippe,
thank you for sharing the solution!

Regards,
Aileen

Hello Philippe, thank you for sharing the solution! Regards, Aileen

31 Posts

philippe.t posted this 22 March 2016

Hello Aileen,

thanks for your response.

here I shared my experience on productImage display with fancybox, if this can to serve for everybody.

I am inspired by
/public_html/components/com_virtuemart/views/productdetails/tmpl/default_images.php

In themler , I follow your advice
2.custom scripts should be added under Home >> Settings >> Additional HEAD HTML
write this javascript code

And in the page products add Insert>>CMS Code >> where you want
and write this php code

regards
philippe.t

Hello Aileen, thanks for your response. here I shared my experience on productImage display with fancybox, if this can to serve for everybody. I am inspired by /public_html/components/com_virtuemart/views/productdetails/tmpl/default_images.php In themler , I follow your advice 2.custom scripts should be added under Home >> Settings >> Additional HEAD HTML write this javascript code ![enter image description here][1] And in the page products add Insert>>CMS Code >> where you want and write this php code ![enter image description here][2] regards philippe.t [1]: http://s10.postimg.org/wia8y2qtl/Fancybox_product_Image_HEADHTML_Javascript.jpg [2]: http://s28.postimg.org/xqnqscy71/Fancybox_product_Image_CMSCode.jpg

Support Team posted this 21 March 2016

Hello Philippe,
although we cannot provide step by step solution we may provide you a brief description.
1.here is the howto for FancyBox in general
http://fancybox.net/howto

2.custom scripts should be added under Home >> Settings >> Additional HEAD HTML

3.use developer tools in browser to look up the proper selector (css class names) specific for your theme.

Regards,
Aileen

Hello Philippe, although we cannot provide step by step solution we may provide you a brief description. 1.here is the howto for FancyBox in general http://fancybox.net/howto 2.custom scripts should be added under Home >> Settings >> Additional HEAD HTML 3.use developer tools in browser to look up the proper selector (css class names) specific for your theme. Regards, Aileen

Support Team posted this 16 March 2016

Hello Philippe,
I'm not sure about the solution.
I'm passing this question to our engineers. We'll contact you.

Regards,
Aileen

Hello Philippe, I'm not sure about the solution. I'm passing this question to our engineers. We'll contact you. Regards, Aileen

You must log in or register to leave comments