Zen Lightbox addon [Support Thread]

[DivaVocals]

and here is the corrected class code.. Tested this and it works perfectly..

<?php
/**
 * Zen Lightbox
 *
 * @author Alex Clarke ([email protected])
 * @copyright Copyright 2003-2005 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version $Id: autoload_default.php 2008-12-09 aclarke $
 */
?>

jQuery(function($) {
        $("a[rel^='lightbox']").slimbox({<?php require_once(DIR_FS_CATALOG . DIR_WS_CLASSES . 'zen_lightbox/options.php'); ?>}, function(el) 
        {
                return [el.href, el.title /* + '<br /><a href="' + el.href + '">Download this image</a>'*/];
        }, function(el) {
    $("#productMainImageReview a").removeAttr("rel");
                return (this == el) || ((this.rel.length > 8) && (this.rel == el.rel));
        });
        <?php if (ZEN_LIGHTBOX_CLOSE_IMAGE == 'true' || ZEN_LIGHTBOX_PREV_NEXT == 'true') { echo ("$('#lbPrevLink').addClass('prevNoHover'); $('#lbNextLink').addClass('nextNoHover');");}?>
});
//--></script>

What this change does:
IF you are using TPP and have the reviews tab turned on, this will prevent the reviews page default image from treated like an additional product image and being grouped in with the rest of your product images in the lightbox.

The issue is MUCH MORE obvious when you have a main product image and no additional images.. Because the reviews page image is being treated as an additional image, the net effect is that the lightbox will show 1 of 2 images. (the "second" image being the product reviews page image)

Sadly there's an addendum to this... so while YES this code stops ZLB from treating the image on the "read reviews" and "write reviews" pages as an additional images so they are no longer in the lightbox on the product info page, it appear to BREAK the lightbox function on the "read reviews" and "write reviews" pages. In fact with this code in place the image on the "read reviews" and "write reviews" pages doesn't even open up in a standard Zen Cart popup window. Will need to do a bit more testing..

[DivaVocals]

Sadly there's an addendum to this... so while YES this code stops ZLB from treating the image on the "read reviews" and "write reviews" pages as an additional images so they are no longer in the lightbox on the product info page, it appear to BREAK the lightbox function on the "read reviews" and "write reviews" pages. In fact with this code in place the image on the "read reviews" and "write reviews" pages doesn't even open up in a standard Zen Cart popup window. Will need to do a bit more testing..

Sample link to demonstrate the behavior I am describing: https://www(dot)laserdiscvault(dot)c...384-80/Reviews

Click the "larger image" link.. Note that the image doesn't open in a lightbox effect or even in a default image popup either.. Instead, it opens the actual image file. The product info pages work just fine.. the issue is only on the "read reviews" and "write reviews" pages..

Because I posted a similar class file fix to the Zen Colorbox support thread (to fix the SAME issue), it should be noted that the Zen Colorbox module doesn't have the same issue with the class file fix in place.

Here's the difference on a site using Zen Colorbox: http://eitestsite(dot)eyeitalia(dot)...roducts_id=331
Click the "larger image" link, and note that the image opens with the lightbox effect working as expected.

Unless a solution for this is found, I will probably swap Zen Lightbox for Zen Colorbox on this site..

Wanted to share my findings with the community though..

[mc12345678]

Sample link to demonstrate the behavior I am describing: https://www(dot)laserdiscvault(dot)c...384-80/Reviews

Click the "larger image" link.. Note that the image doesn't open in a lightbox effect or even in a default image popup either.. Instead, it opens the actual image file. The product info pages work just fine.. the issue is only on the "read reviews" and "write reviews" pages..

Because I posted a similar class file fix to the Zen Colorbox support thread (to fix the SAME issue), it should be noted that the Zen Colorbox module doesn't have the same issue with the class file fix in place.

Here's the difference on a site using Zen Colorbox: http://eitestsite(dot)eyeitalia(dot)...roducts_id=331
Click the "larger image" link, and note that the image opens with the lightbox effect working as expected.

Unless a solution for this is found, I will probably swap Zen Lightbox for Zen Colorbox on this site..

Wanted to share my findings with the community though..

Have you changed something since posting this? Appears that both show up in a different "holder", I don't see any additional images attached to the main image(s), and I can't tell if there is something "added" to the name or not. I will say that the shape of the corners is different than what I have and I haven't looked yet to see what would "cause" or "allow" the beveled corners instead of the actual box shape. But once again, don't see the problem... :)

[DivaVocals]

Have you changed something since posting this? Appears that both show up in a different "holder", I don't see any additional images attached to the main image(s), and I can't tell if there is something "added" to the name or not. I will say that the shape of the corners is different than what I have and I haven't looked yet to see what would "cause" or "allow" the beveled corners instead of the actual box shape. But once again, don't see the problem... :)

Not sure what you mean.. The second example I posted (http://eitestsite(dot)eyeitalia(dot)...roducts_id=331) was to show the difference between how Zen Colorbox works CORRECTLY after the class file change when you click the "larger image" link on the review pages. I've made no changes to that site since posting the link, let alone a change which would be relevant to the issue I speak of. The rounded corners on the images is not an issue it is a stylesheet change which is "allowed" via CSS. The lightbox effect was always rounded on this site (it is also a stylesheet change - which is "allowed" via CSS).

The first site demonstrates the issue: https://www(dot)laserdiscvault(dot)c...384-80/Reviews
After making the change to the class file as previously posted (http://www.zen-cart.com/showthread.p...27#post1215927) when you click the "larger image" link the image it self is displayed.. when you click the "larger image" link it SHOULD result in the image appearing inside the lightbox effect or AT LEAST the default image popup. However, neither is the case.

Again here is a summary of the issue:
IF you are using TPP AND have the reviews tab turned on AND you have ZLB install, the reviews page default image is treated like an additional product image when you view the images on the product info page. So when you view the images on the product info page it appears as if the main image is counted twice.

The issue is MUCH MORE obvious when you have a main product image and NO additional images.. Because the reviews page image is being treated as an additional image, the net effect is that the lightbox will show 1 of 2 images. (the "second" image being the product reviews page image)

Making the change to the ZLB class file as previously posted (http://www.zen-cart.com/showthread.p...27#post1215927) DOES fix this issue (stops ZLB from counting the reviews image when viewing the images on the product info page), but it creates another with the "larger image" link on the review pages ("read reviews" and "write reviews" pages). (Again as described above and is demonstrated here: https://www(dot)laserdiscvault(dot)c...384-80/Reviews)

Not sure what is not clear here.. please re-read this post: http://www.zen-cart.com/showthread.p...96#post1216096

I'll see if I can find my original posts describing the issue the class file change I posted was supposed to solve, but I think this is covered here.. Let me know what is not clear.. but the rounded corners on the lightbox or the images aren't the issue or even a cause of the issue.. and you WON'T see additional images when you click the "larger image" link on the REVIEWS page... (you're not supposed to.. and that is also not the issue I am describing here) additional images only show on the product info page..

[mc12345678]

Not sure what you mean.. The second example I posted (http://eitestsite(dot)eyeitalia(dot)...roducts_id=331) was to show the difference between how Zen Colorbox works CORRECTLY after the class file change when you click the "larger image" link on the review pages. I've made no changes to that site since posting the link, let alone a change which would be relevant to the issue I speak of. The rounded corners on the images is not an issue it is a stylesheet change which is "allowed" via CSS. The lightbox effect was always rounded on this site (it is also a stylesheet change - which is "allowed" via CSS).

The first site demonstrates the issue: https://www(dot)laserdiscvault(dot)c...384-80/Reviews
After making the change to the class file as previously posted (http://www.zen-cart.com/showthread.p...27#post1215927) when you click the "larger image" link the image it self is displayed.. when you click the "larger image" link it SHOULD result in the image appearing inside the lightbox effect or AT LEAST the default image popup. However, neither is the case.

Again here is a summary of the issue:
IF you are using TPP AND have the reviews tab turned on AND you have ZLB install, the reviews page default image is treated like an additional product image when you view the images on the product info page. So when you view the images on the product info page it appears as if the main image is counted twice.

The issue is MUCH MORE obvious when you have a main product image and NO additional images.. Because the reviews page image is being treated as an additional image, the net effect is that the lightbox will show 1 of 2 images. (the "second" image being the product reviews page image)

Making the change to the ZLB class file as previously posted (http://www.zen-cart.com/showthread.p...27#post1215927) DOES fix this issue (stops ZLB from counting the reviews image when viewing the images on the product info page), but it creates another with the "larger image" link on the review pages ("read reviews" and "write reviews" pages). (Again as described above and is demonstrated here: https://www(dot)laserdiscvault(dot)c...384-80/Reviews)

Not sure what is not clear here.. please re-read this post: http://www.zen-cart.com/showthread.p...96#post1216096

I'll see if I can find my original posts describing the issue the class file change I posted was supposed to solve, but I think this is covered here.. Let me know what is not clear.. but the rounded corners on the lightbox or the images aren't the issue or even a cause of the issue.. and you WON'T see additional images when you click the "larger image" link on the REVIEWS page... (you're not supposed to.. and that is also not the issue I am describing here) additional images only show on the product info page..

Welp, what's not clear here, is why aren't you seeing a lightbox when I am. So, I went to the site location (https://www(dot)laserdiscvault(dot)c...384-80/Reviews), I see the laserdisc image, just below that a clickable link to show a larger image. When I click on either of those, the background darkens, a white window expands with a "circle-of-thought" while it processes, then the image of the laserdisc appears towards the "top" part of the new light colored area, leaving just enogh room to have some info at the bottom. This info appears to be the title/name of the laserdisc. In the lower right corner is a close button.

So again, the part that is confusing me is why do I see that (and I consider what I described a light box), but you don't? I've tried it on both desktop and mobile, and while desktop is far faster (like instant almost), they both have provided the same result.

[DivaVocals]

Welp, what's not clear here, is why aren't you seeing a lightbox when I am. So, I went to the site location (https://www(dot)laserdiscvault(dot)c...384-80/Reviews), I see the laserdisc image, just below that a clickable link to show a larger image. When I click on either of those, the background darkens, a white window expands with a "circle-of-thought" while it processes, then the image of the laserdisc appears towards the "top" part of the new light colored area, leaving just enogh room to have some info at the bottom. This info appears to be the title/name of the laserdisc. In the lower right corner is a close button.

So again, the part that is confusing me is why do I see that (and I consider what I described a light box), but you don't? I've tried it on both desktop and mobile, and while desktop is far faster (like instant almost), they both have provided the same result.

Well how about that..

Well then NEVERMIND.. Dunno what happened.. but d@mned if this ain't working..

Need coffee..

NOW...

Carry-on..

[Jason Cox]

Hi all,
First time posting, long time reading

I've slowly done my own site over the last couple of years and managed to figure out most things ( thanks to you guys here) but I'm out of my depth with this one.
I've installed the lightbox but having an issue with displaying the images.
When an image on the products page/s is clicked, it enlarges and displays part of the image at the bottom of the screen
Link http://evorc.com.au/index.php?main_p...&products_id=2

Any help on this would be greatly appreciated

[DarkAngel]

Looks rather interesting doesn't it...sorry have to joke at times to stay semi-sane.

Have you made sure that all your lightbox files are in their correct locations. I notice that none of them open into a light box.

What do you have your setting at in the admin section.

I also noticed that your header image is duplicating itself too.

open the zip and compare the contents to the server files to make sure they are in the right folders ---then as a safe measure reupload them to each respective folder.

sometimes the files get caught up in some ftp vortex that we do not see and appear to upload correctly but really get corrupted a bit.

see if that helps

[mc12345678]

Hi all,
First time posting, long time reading

I've slowly done my own site over the last couple of years and managed to figure out most things ( thanks to you guys here) but I'm out of my depth with this one.
I've installed the lightbox but having an issue with displaying the images.
When an image on the products page/s is clicked, it enlarges and displays part of the image at the bottom of the screen
Link http://evorc.com.au/index.php?main_p...&products_id=2

Any help on this would be greatly appreciated

Looks rather interesting doesn't it...sorry have to joke at times to stay semi-sane.

Have you made sure that all your lightbox files are in their correct locations. I notice that none of them open into a light box.

What do you have your setting at in the admin section.

I also noticed that your header image is duplicating itself too.

open the zip and compare the contents to the server files to make sure they are in the right folders ---then as a safe measure reupload them to each respective folder.

sometimes the files get caught up in some ftp vortex that we do not see and appear to upload correctly but really get corrupted a bit.

see if that helps

Looking over the page coe, I would agree with DarkAngel that there may be some issue with the file(s) uploaded. The effect is rather unusual and appears to be that the image(s) load to the full screen/full height.

Forgot to mention, don't let that be your last post! :)

[sle39lvr]

Restricting Image Display Size Width to Screen Size Width (or browser width)?

Is this possible?

The reason is, I am putting ultra high resolution images for my products since most devices are HiDpi/Retina now. So right now, images are opening according to their result ion and running off the screen. I am sure there is a way to modify the code to get browser width and display in to that size.