VM2 Linelab Slideshow is new way of displaying images and image descriptions. This jQuery Slideshow is cross browser compatible and bug free.
Virtuemart 3 compatible.
Joomla 3.x compatible.
Demo: http://www.linelabox.com/linelabox/?template_layout=6c75971a28ed7a6f409b4a532f41bd3f
Download: http://www.linelabox.com/joomla-modules/linelab-archive/category/2-free-joomla-extensions
How to Install: Download vm2_product_slideshow.zip > unzip and upload via FTP to folder of your default Joomla 2.5 template. Done!
To decrease the width of the slideshow open assets/css/pikachoose/base.css
Edit Line 4:
.pikachoose {width: 520px; margin: 0 auto;}
.pika-stage, .pika-textnav {width: 500px;}
Happy downloading :)
Any comments would be appreciated.
Quote from: VirtueArtcz on July 19, 2012, 22:49:32 PM
Any comments would be appreciated.
I just tried it on my new VM2 gallery site (not live yet) and it works with my slightly customized template, but I wonder if you need to include the fancybox.js, because that one is already included in VM2 and used for the backend media manager. (BTW - for some reason the slideshow seems to have frozen my Firefox browser window while I was away from my computer for about half an hour)
Personally I would be more interested in a sliding caption integrated into the lightweight VM2 facebox like this one: http://css-tricks.com/slide-in-image-captions/ (http://css-tricks.com/slide-in-image-captions/)
...but if my time permits, I might add a more detailed comment on Monday (have to leave now).
:)
Hi Jjk, Image slider doesn't work with default fancybox.js.
Hi again,
if I would use the Slideshow (I'm happy with a lightbox only), I would try to keep the fancybox navigation arrows inside the image by default (similar to VM2 backend media list), because otherwise they require extra space in the product details view, which many users might not have in that view due to the layout and therefore images might be scaled down. Also, I would disable the text 'Previous/Next' buttons because I think one navigation method is sufficient and they take away space, too. Next I would try to open the image directly into the lightbox when one of the thumbs are clicked. Compared to a pure fancybox override (without slideshow), the user has to click a thumbnail twice instead of once to open an image in the lightbox.
However, I suppose these things are a matter of taste and many others will be happy with how it works now.
Very nice ! Thanks for your contribution(s) to Virtuemart 2.
Any advice on adding this to the category page ?
i tryed to use the solution in your link, but i don't want the slideshow in a page but only the "next prev" buttons in image popup! i can't resolve this.. you can find a solution whit this script?
Hi Ciriman, Good idea. We will create a POPUP Slideshow including thumbnails (additional images) as soon as possible. Thanks for your patience. :)
Quote from: VirtueArtcz on July 31, 2012, 16:52:36 PM
Hi Ciriman, Good idea. We will create a POPUP Slideshow including thumbnails (additional images) as soon as possible. Thanks for your patience. :)
would need only to perform as in the previous version of VM. at the click of a thumb I can go to the next or previous image extra of the main item. (main picture included). I hope you can answer soon, thanks for your dedication and patience.
Thank you! I realy use it :) and use it for all my website :)
Thank!
Hi, can I just confirm where to upload the various files?
For assets:
yourdomain/components/com_virtuemart/assets (and then in the relevant folders)
For html:
yourdomain/templates/"templatesetasdefault"/html/com_virtuemart/productdetails
As I have done this but it does not work, have I done something wrong?
Many thanks,
Nick
Quoteunzip and upload via FTP to folder of your default Joomla 2.5 template
I did that as well but it still didn't work, i.e:
yourdomain/templates/thedefault/
ok, so the plot thickens, it works on the standard atomic joomla template but not the template I use from Gavickpro, any suggestions??
Hi,
Demo looks nice. This is something I realy want to use.
I have copied all files into the given folders, but all I get is all pictures in large size. I can click each image. Then I see the image alone with white background.
Can anyone help me?
Maxdeal
I really want to use this on my template however the template that I am using has a default.php file in the com_virtuemart folder that clearly contains code to either override the default_images.php folder for this slideshow. Here is the code relating to product images from the default.php file:
<div class="width40 floatleft">
<?php // Product Main Image
if (!empty($this->product->images[0])) { ?>
<div class="main-image">
<?php echo str_replace('<a', '<a class="modal"', $this->product->images[0]->displayMediaFull('class="product-image"',true,"class='modal'",true)); ?>
</div>
<?php } // Product Main Image END ?>
<?php // Showing The Additional Images
if (!empty($this->product->images) and count ($this->product->images)>1) { ?>
<div class="additional-images">
<?php // List all Images
foreach ($this->product->images as $image) {
echo '<div class="product-thumb">' . $image->displayMediaThumb('class="product-image"',true,'class="modal"',true,true) . '</div>'; //'class="modal"'
} ?>
</div>
<?php } // Showing The Additional Images END ?>
Does anyone know how to sort this out?!
Quotei tryed to use the solution in your link, but i don't want the slideshow in a page but only the "next prev" buttons in image popup! i can't resolve this.. you can find a solution whit this script?
Quote from: VirtueArtcz on July 31, 2012, 16:52:36 PM
Hi Ciriman, Good idea. We will create a POPUP Slideshow including thumbnails (additional images) as soon as possible. Thanks for your patience. :)
In this forum there is a short tutorial for producing an override which loads Fancybox (includes prev/next buttons and a title) instead of Facebox in the frontend, including the code to copy and paste. See here: http://forum.virtuemart.net/index.php?topic=95911.msg322261#msg322261
Works nicely, but in my special (case I need to
change the image title, which is generated from the image alt-text (
file_meta in the _virtuemart_medias table) to '
Displayed Image Title' (
file_description in the _virtuemart_medias table and 'vm-img-desc' in vmsite-ltr.css). Perhaps VirtueArtcz or somebody else has an idea how to achieve that. I've run out of ideas already :)
The reason for the above is that I need to display "Product name © manufactuer name" as a title below the image, but at the same time don't want to spoil the more descriptive image alt-text, which is important for SEO.
Quote from: nicklucas on August 14, 2012, 16:09:36 PM
I really want to use this on my template however the template that I am using has a default.php file in the com_virtuemart folder that clearly contains code to either override the default_images.php folder for this slideshow. Here is the code relating to product images from the default.php file
Try to replace this code:<div class="width40 floatleft">
<?php // Product Main Image
if (!empty($this->product->images[0])) { ?>
<div class="main-image">
<?php echo str_replace('<a', '<a class="modal"', $this->product->images[0]->displayMediaFull('class="product-image"',true,"class='modal'",true)); ?>
</div>
<?php } // Product Main Image END ?>
<?php // Showing The Additional Images
if (!empty($this->product->images) and count ($this->product->images)>1) { ?>
<div class="additional-images">
<?php // List all Images
foreach ($this->product->images as $image) {
echo '<div class="product-thumb">' . $image->displayMediaThumb('class="product-image"',true,'class="modal"',true,true) . '</div>'; //'class="modal"'
} ?>
</div>
<?php } // Showing The Additional Images END ?>With this:<div class="width40 floatleft">
<?php
echo $this->loadTemplate('images');
?></div>
Thanks for posting that VirtueArtcz it was much appreciated. Unfortunately it's not quite working it should probably because of the template I'm using as you can see here:
http://www.innovationonly.com/online-store/sealants-and-potting-compounds/magic-power-gel-1-litre-detail.html
I have no idea how to fix it so will probably have to admit defeat!
The next week will be released the new FREE version with popup feature. Please check demo: http://demo.virtueart.org/linelabox/index.php/virtuemart-2-demo
A new version of Product Details Slideshow for VirtueMart 2 is available for download.
Absolutely Free! :)
Download link: http://www.linelabox.com/
A really big thank for that !!! :D
PS: But if you have...10images for one item. Are you thinking to put thumbnails in a slide too like in presta**** ? One arrow for each side and some hidden thumb ? If anyone has already some overide code that ^^
Anyway, nice Slideshow.
Hello. First of all thank You for your effort.. I have tried on several sites .. localhost and hosting ... and I cant make it work. After installing I get just single images lined horizontaly and there is no effect. Attached some pictures. What do I do wrong ? Thank You for your help. Petr
[attachment cleanup by admin]
Ahoj Peetee, vidím češtinu ;), napiš prosím url webu, podivám se na to.
thanks for this VirtueArtcz, you saved me lots of time on looking and making this work !
i got the same problem as peetee
is there a solution ? i cant get the slideshow on my web page. all images are lined vertically
please help
thank You
Hi Mikesc, Please provide website url.
hi, VirtueArtcz
i have sent you PM
thank You
Hi nicklucas,
I also like your fault, it just works on Beez template-20, while on my template it did not work.
Please I ask you to have corrected this error. Can guide me if you have successfully overcome it? tks u.
Hello,
i have this vertical error too...but only when i'm logged. If i'm not logged, everything works nice. Any idea ?
Thanks for this , very nice page & option for virtuemart product images i'll use it on my project soon
You're welcome... ;)
Mmm...my first post asking for help haha
I had a template with this slideshow working. It was a free one, Business 13. Now I decided to move to another template, Shoplab, that is from LineLab, the same people that have done this plugin. The thing is that it doesnt work neither on Shoplab nor ColorShop.
Is this happening to anybody else?
I can not find the solution and I have been googleing during the last hour :S
I will appreciatte any help : D
PD: Everything on my site its fine, Im using VM 2.0.10 and J2.5 :D
First of all, VirtueArtCz,
great work and thanks for sharing it,
I have tried to implement it on my wife's draft Jewelry store and have several things that are not perfect:
e.g. http://bijouxartisanal.ca/necklaces/long-pearls-necklace-virginie-detail
I've modified a bit the template to suit my needs, but I can's figure out what makes the image jump ~1pix to the left after loading in detail view.
Would you have some suggestions?
Also, I would like to get rid of thumbs in the Lightbox view to make the image as big as possible, I will look into this, but if you have any suggestions, please guide me here as well.
Thanks in advance!
Best regards,
Roman
Hi Roman, There is some javascript conflict in your website.
SyntaxError: missing ; before statement
http://bijouxartisanal.ca/media/system/js/mootools-core.js
Line 399
ReferenceError: Hash is not defined
http://bijouxartisanal.ca/
Line 33
TypeError: window.addEvent is not a function
http://bijouxartisanal.ca/
Line 33
Hi, VirtueArtcz,
Unfortunately, I'm not able to debug the code like that.
I tried to look for some indications of problems with FireBug, but do not get any errors.
I was able to find the code part where you indicated errors, but have no idea how I can influence these, as I did not modify any code there..
Do you think these errors could be coming from the conflict of javascripts?
The rest of the site seems to work, though, I'm sure it could have some hidden problems.
Would you have any suggestions on how I could proceed?
Here's almost the same web site (the main one) without your code.
http://artisansjewelry.ca
I'm not even sure if the same errors appear there, I guess they do.
Thanks,
Roman
All my images are uploaded resized to 600pix.
I really like this slide show contribution on the product page, but I don't like the pop-up.
I would like the popup to show my fullsize 600pix image. Is there a way to do that?
Best for me was that the popup is a normal fancybox with back and forward buttons when I click the main image on the product page.
Hi I subscribed to Linelab.org for 6 months with email support but i haven't got a response. Hoping someone working there or anyone else can assist me.
My shop that i am building is only a catalog one. Its all working out really well except for the fact that when you get to the product page of any particular product, the left column automatically goes to the bottom right. I have not been able to sort the problem out on my own and hence seeking some help here.
my homepage is: http://www.chanfurniture.com/joomla257
an example product page is: http://www.chanfurniture.com/joomla257/index.php/component/virtuemart/bedroom-sets/berry-detail?Itemid=0
notice the left column on the bottom right hand side of the screen? how do i sort this.
thank you for any help or advice.
if its the wrong section, please assist in moving post.
Hi Musicarvind, We will reply as soon as possible in the following working hours. Monday - Friday: 10:00am - 6:00pm.
Line 807, Column 10: end tag for "div" omitted, but OMITTAG NO was specified Please provide FTP access details to linelab@linelab.org, we can look into this issue for you.
Hi VirtueArtcz,
I got a reply from someone named Frank on my email for ftp instructions and access. I replied him 10 days ago on the 2nd of November with an ftp access login and password and another two mails after that.
If you could specify what needs to be changed on the line, I can do it on the css file myself.
Please do reply here in case Linelab has not received that mail and I will resend the ftp information.
Thank you.
What's your email address?
Hi Virtueartcz, I have pvt message you my email address. Thanks.
Quote from: AgusDG on October 11, 2012, 14:03:50 PM
Mmm...my first post asking for help haha
I had a template with this slideshow working. It was a free one, Business 13. Now I decided to move to another template, Shoplab, that is from LineLab, the same people that have done this plugin. The thing is that it doesnt work neither on Shoplab nor ColorShop.
Is this happening to anybody else?
I can not find the solution and I have been googleing during the last hour :S
I will appreciatte any help : D
PD: Everything on my site its fine, Im using VM 2.0.10 and J2.5 :D
Still trying to add this functionallity to my website, and I cant.
I leave here the link, for you to see it ; )
http://www.artesaniasigloxxi.es
In Shoplab - Free Joomla 2.5 template VM2 Theme dont work...
why???
The same problem
Shoplab product details slideshow dont work. Why?
Hi, This bug will be fixed today. Thanks for your patience.
Thanks ;)
Error in detail:
(http://img560.imageshack.us/img560/9028/deti.png)
Hi Ricsca, Please provide your website url.
Got it to work, but it overlaps at times (tried to fix with css), but as image changes the box does as well. Also, how can I get images to open in a lightbox (currently IMPOSSIBLE to view the large scale images) http://tyrecare2.vertexcentral.com/index.php/shop/valve-extensions/flexible-extension-125mm-detail
How iS it possible to change the animation, the fade by a scrollHorz ?
Hi, I'm new to the forum and I apologize for my english but I'm italian. I downloaded the template Colorshop and I unzipped files and loaded them into the folder "mydomain/template/beez_20" from the site but I do not see any change in the template ... where did I go wrong? Thank you.
Hi alesalva86, Go to Admin Joomla > Extensions and install Colorshop Template http://docs.joomla.org/Installing_a_template
To change the default template follow these steps: http://docs.joomla.org/Introduction_to_Joomla!_templates
Download vm2_product_slideshow.zip > unzip and upload via FTP to folder of Colorshop template. Done! ;)
If I install the vm2_product_slideshow.zip file compare this error: JInstaller :: Install: Could not find XML setup file. Where I find the file to install the colorshop template?
Please read first: http://forum.virtuemart.net/index.php?topic=105482.0
How to Install: Download vm2_product_slideshow.zip > unzip and upload via FTP to folder of your default Joomla 2.5 template. Done!
I was able to install the template Colorshop but I do not see the slideshow ... how should I do? Thanks.
Quote from: stobbie on November 10, 2012, 15:19:48 PM
All my images are uploaded resized to 600pix.
I really like this slide show contribution on the product page, but I don't like the pop-up.
I would like the popup to show my fullsize 600pix image. Is there a way to do that?
Best for me was that the popup is a normal fancybox with back and forward buttons when I click the main image on the product page.
Hi, great mod, planning on using it. I have the same problem... my images are uploaded to a certain resolution (680*472) and I would like to be able to see them full size when they are displayed in the pop up mode. Without this, the pop up mode is almost useless...
http://happysticker.ro/index.php?option=com_virtuemart&view=productdetails&virtuemart_product_id=48&virtuemart_category_id=13
Please let me know if there is a way I can do this ..
thank you for you hard work !
Hi Virtueart,
first off: I like your slideshow, thanks for releasing it for free!! But I wish I could get it to work.... I have the same problem that some other people have (had) too, the pictures are put below eachother without the slideshow or the controls, just static images below eachother. I checked my code and all the scripts and CSS are loaded into the page, yet for some reason the slideshow won't show properly.
Here's a link to an example that you hopefully have time to take a look at: http://www.pirema.com/index.php/nl/producten/wijnkisten/wijnkist-1-fles-halfopen-detail
thanks!!
Hello,
I have one question - Is there any simple way to turn off the slide function ? (by cutting some code in css ?)
OR
Is there any way to change the time of the image display (up to 10 sec.) ?
Thanks in advance for support!
OK. I found it in
jquery.pikachoose.full.js - type "speed: 5000"
Any idea if there could be a possibility to open the full size picture in pop-up ?
Thanks!
Hello ,
I'm new here and maybe its a mistake to ask but in my case adding the code and overriding created a new problem for me. When i click on the picture and a pop-up box appears then it shows the thumbnails also. You have two demo pages, i want the same result as it is on the Demo1 page, as it only shows the main picture without the additional images.
Really appreciate the plugin, the thumbnails look awesome.
Captcha doesnt work for registration in your site. Please check it.
Thanks for such a great module.
Would like to know if, as is done to the image of the pop-pup is full size?
That is to a size larger than that shown.
Thanks!!! and sorry for my english...
Hello, please where can I download it? Thank You.
http://www.linelabox.com/joomla-modules/linelab-archive/category/2-free-joomla-extensions
Updated:
Fixed compatibility with Bootstrap 3 CSS framework
Hi to all
The plugin is very nice and it works as expected... Congratulations for the nice work!
I have installed it on a modified template on Joomla 3 with Virtuemart 3 and it works w/o any problem ! ! !
What I would like to do if possible when I click on the image and get the pop up with pikachoose to display the full image.
I have managed to change the size of the slideshow when pops up by changing the size: {x: 400, y: 600} to size: {x: 800, y: 600} inside the function show_gallery(anchor) in the default_images.php but the image size stays the same. See here: https://leathercareland.com/en/proionta/papoutsia-tsantes/tsantes-bags/leather-bag-tsanta-dermatini-1-detail
Is there any possibility to display the full image in the popup?
Thanks
Hello everyone
I finally got it to work by making 2 small changes:
1. On base.css under /templates/my_template/assets/css on line 15 change to .pika-stage img{height:auto;width:100%;}
2. On default_images.php under /templates/my_template/html/com_virtuemart/productdetails on line 62 under function show_gallery(anchor) change to size: {x: 800, y: 800},
Now when I click than main image to get the pickachoose on pop up it displays the full image w/o any resize.
Thanks
VirtueMart Product Slider
VirtueMart Product Slider Features
Well compatible with Virtuemart.
Option to manage the color of Description Font, Content Background and Slider Background of the slider are available.
The display of products in the slider is based on category filter.
Option to manage the display of "add to cart","price" and "description" of product in the slider in available.
The feature of sliding with fade in fade out effect is provided.
Functionality to manage the width is available.
Products to be displayed can be selected from Recently viewed, Featured, Latest, Best Selling or Randomly.
Please visit for more detail: http://webkul.com/blog/virtuemart-product-slider/