Zen Lightbox addon [Support Thread]

[DannyVarley]

Yup I purposely removed the code so they cant get into the individual product pages, there was no need for them in my situation and it only made the buy experience longer. I could have also just listed them all as attributes but I chose this way over that for some important reasons I cant quite remember right now

I think for lightbox to work on those pictures I need to include the source on that code I pasted. Thats the only thing I cant figure out.

Daniel

[mc12345678]

Yup I purposely removed the code so they cant get into the individual product pages, there was no need for them in my situation and it only made the buy experience longer. I could have also just listed them all as attributes but I chose this way over that for some important reasons I cant quite remember right now

I think for lightbox to work on those pictures I need to include the source on that code I pasted. Thats the only thing I cant figure out.

Daniel

So, I thought that there was a single file that when copied into the applicable modules/pages/XXXX folder (and seems in your case product listing if that exists) that would activate the lightbox functionality on that page. No code modification necessary. At least that was my understanding from a few pages back and recollection of the readme for this plug-in.

[EHSI]

**nods in agreement**

Thank you very much both for the help and suggestions.

OK, I went back to the backup where I only had IH4 installed. I currently have neither Slimbox, nor Lightbox installed. Before I try to install Lightbox again I have to fix another issue I found - in the Internet Explore clicking on an image does trigger the default popup window BUT the window would not open up and would not show the image. This issue is not present in Firefox.

Do I need to go to the backup where I had no IH4 installed and re-install IH4? I really do not want to do that. Installing IH4 again is a task I would like to avoid, if possible.

Thank you.

[mc12345678]

Thank you very much both for the help and suggestions.

OK, I went back to the backup where I only had IH4 installed. I currently have neither Slimbox, nor Lightbox installed. Before I try to install Lightbox again I have to fix another issue I found - in the Internet Explore clicking on an image does trigger the default popup window BUT the window would not open up and would not show the image. This issue is not present in Firefox.

Do I need to go to the backup where I had no IH4 installed and re-install IH4? I really do not want to do that. Installing IH4 again is a task I would like to avoid, if possible.

Thank you.

So, somewhat of a cross post issue; however, if not mistaken this is being discussed/addressed in IH(4 at least) there have been some findings. Supposedly and if I understand correctly, if you install zen lightbox and activate it, the problem may go away? Again, be sure you clear your cache and other cleanup or try another computer that has IE on it. May have some "history" in place preventing the full operation.

[DivaVocals]

The IH4 issue being discussed has to do with the additional images popup.. The issue does not appear to be an issue when Zen Lightbox is installed.. (probably because of the modifications Zen Lightbox makes to the additional_images.php)

That said although EHSI is having issues in particular browsers they are likely local issues for him otherwise the issue would be more widely reported and repeatable... of course since he has not posted a lnk to his site without seeing the actual site this is a guessing game.. I won't lob guesses at an issue I cannot see.. especially since none of us responding can repeat the issue..

So, somewhat of a cross post issue; however, if not mistaken this is being discussed/addressed in IH(4 at least) there have been some findings. Supposedly and if I understand correctly, if you install zen lightbox and activate it, the problem may go away? Again, be sure you clear your cache and other cleanup or try another computer that has IE on it. May have some "history" in place preventing the full operation.

[EHSI]

Thank you for your suggestions.

Not to chaise my own tail for many hours to come, I installed zen cart and IH4 again afresh. The installation went as expected, and I do not see at the moment any problems. Currently, I do not have Lightbox installed but I will install it tomorrow after I see that the IH4 operates in all browsers as expected.

The only issue I currently have, which I have not experienced in my first installation of IH4, is that IH4 does not re-size the image when I am inserting it for a new product. Since I am inserting the largest image I have (about 180K) as my smallest/default image, IH4 inserts small, medium, and large images making them of the same size - 180K. This issue would not be a problem because I do not want to activate hover function, but this issue lets me know that something is wrong and has to be fixed before I go ahead and install Lightbox.

Could you please let me know what I am missing this time.

Thank you.

[mc12345678]

Thank you for your suggestions.

Not to chaise my own tail for many hours to come, I installed zen cart and IH4 again afresh. The installation went as expected, and I do not see at the moment any problems. Currently, I do not have Lightbox installed but I will install it tomorrow after I see that the IH4 operates in all browsers as expected.

The only issue I currently have, which I have not experienced in my first installation of IH4, is that IH4 does not re-size the image when I am inserting it for a new product. Since I am inserting the largest image I have (about 180K) as my smallest/default image, IH4 inserts small, medium, and large images making them of the same size - 180K. This issue would not be a problem because I do not want to activate hover function, but this issue lets me know that something is wrong and has to be fixed before I go ahead and install Lightbox.

Could you please let me know what I am missing this time.

Thank you.

Please carry this over to the correct thread http://www.zen-cart.com/showthread.p...read&p=1215719. This is not a Zen Lightbox discussion.

[DarkAngel]

Daniel, I think this is the link you had us look at before: http://kitchenwarehouseltd.com/compl...gh-gloss/cream

If I understand right you want those lower images to come up in the lightbox also?

If right and they are in the actual description of the main product then you will most likely need to include the call for it when you insert the link for the image -- I think the naming of the images would probably not be an issue since they are not additional images but just added to description..

Have you tried this info from the readme:

===============================================

EZ-Pages
By default the lightbox effect will be applied to all links that point to images on your EZ-Pages. This functionality can easily be modified via the admin.
The gallery mode will automatically be used when more than one link to an image (on an EZ-Page) are located within the same parent element.
The only manual bit of coding required is the addition of captions (if you need them). You can add captions by including the rel="" attribute in your href tag. An example of this can be found below.


<a href="myimage.jpg" rel="here is my caption">My Image</a>


Any page
The above EZ-Pages functionality can be added to any page of your website.
To enable this, simple copy the jscript_zen_lightbox.php file (found at the root of the distribution) to the relevant modules/pages folder.
For example, if you wanted to apply this functionality to the contact_us page you would copy the above file to: includes/modules/pages/contact_us



===============================================

Yup I purposely removed the code so they cant get into the individual product pages, there was no need for them in my situation and it only made the buy experience longer. I could have also just listed them all as attributes but I chose this way over that for some important reasons I cant quite remember right now

I think for lightbox to work on those pictures I need to include the source on that code I pasted. Thats the only thing I cant figure out.

Daniel

[DivaVocals]

finally got around to a workaround for this issue.
Not sure if it should be part of the ZCB or ZLB install by default, but maybe in the FAQ of this and of the tabbed plugin.
try adding this line to [includes/classes/zen_lightbox/autoload_default.php]
I added it as the first line inside of the document ready function

$('#productMainImageReview, #productAdditionalImages_tab').find("a").removeAttr("rel");

this should re-write the image links inside the tabbed sections to remove the rel="colorbox" attribute so that the images do not get linked/loaded into colorbox or lightbox (same code will work for either)

d

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)

[DivaVocals]

So I am back with more issue regarding product images and product reviews.. I think the issue I reported previously regarding the images and reviews may not be related to TPP at all.. I think the issues with having reviews on the tabs in TPP is caused because of an overall issue with how Colorbox (and Zen Lightbox) display/deal with reviews and product images together in general.

I reported this new find in the Zen Lightbox thread, but I'm reporting here too since I am seeing the SAME issue with both Colorbox and Zen Lightbox.

Not sure why, but the Lightbox and Colorbox add-ons are generating some weird/invalid HTML on the product reviews pages. You will see the model number appear in what appears to be some weird link to the left of the product image. Using Zen Lightbox, you can see what I am speaking of on this page:
http://clientlaserdiscvault(dot)overthehillweb(dot)com/index.php?main_page=product_reviews&products_id=8909


I found the EXACT same issue with the beta version of the Colorbox add-on as well. You can see the same issue using the Colorbox add-on on this page:
http://clienthairisle(dot)overthehillweb(dot)com/Hair-Extensions/Economy-Collection/Economy-Unprocessed/Indian-Remy-Micro-Thin-Machine-Weft-Virgin-Curly-Texture-3-Oz/reviews?number_of_uploads=0&

This weird link goes away when I turn off Lightbox or Colorbox.

Without Lightbox turned on this is the HTML created:

<div id="productReviewsDefaultProductImage" class="centeredContent back">  
<div id="productMainImage" class="centeredContent back"> 
<script language="javascript" type="text/javascript">
<!-- document.write('<a href="javascript:popupWindow(\'http://myclient.com/index.php?main_page=popup_image&amp;pID=8909\')"><img   src="images/dasPic_24141.jpg" alt="National Geographic - Secrets of  the  Titanic [G52000]" title=" National Geographic - Secrets of the  Titanic  [G52000] " width="349" height="350" />
<br /><span class="imgLink">larger image</span></a>'); //-->
</script> 
<noscript> 
<a   href="http://myclient.com/index.php?main_page=popup_image&amp;pID=8909"   target="_blank"><img src="images/dasPic_24141.jpg" alt="National   Geographic - Secrets of the Titanic [G52000]" title=" National   Geographic - Secrets of the Titanic [G52000] " width="349" height="350"   /><br /><span class="imgLink">larger   image</span></a>
</noscript> 
</div></div>

With Lightbox turned off this is the HTML created (note the mis-behaving HTML created is in red):

<div id="productReviewsDefaultProductImage" class="centeredContent back">  
<div id="productMainImage" class="centeredContent back"> 
<script language="javascript" type="text/javascript">
<!-- document.write('<a href="images/dasPic_24141.jpg"   rel="lightbox-g" title="National Geographic - Secrets of the   Titanic<br /><span   class=\"smallText\">[G52000]</span>"><img   src="images/dasPic_24141.jpg" alt="National Geographic - Secrets of the   Titanic [G52000]" title=" National Geographic - Secrets of the Titanic   [G52000] " width="349" height="350" /><br /><span   class="imgLink">larger image</span></a>'); //-->
</script>
<a href="images/dasPic_24141.jpg" rel="lightbox-g" title="National Geographic - Secrets of the Titanic&lt;br /&gt;&lt;span class=" smalltext"="">[G52000]"&gt;<img src="images/dasPic_24141.jpg" alt="National Geographic - Secrets of the Titanic [G52000]" title=" National Geographic - Secrets of the Titanic [G52000] " height="350" width="349"><br><span class="imgLink">larger image</span></a> 
<noscript> 
<a   href="http://myclient.com/index.php?main_page=popup_image&amp;pID=8909"   target="_blank"><img src="images/dasPic_24141.jpg" alt="National   Geographic - Secrets of the Titanic [G52000]" title=" National   Geographic - Secrets of the Titanic [G52000] " width="349" height="350"   /><br /><span class="imgLink">larger   image</span></a>
</noscript> 
</div></div>

Using either Colorbox or Zen Lightbox, the issue goes away when I turn off these add-ons. It seems clear that there is something with how both of these add-ons deal with product images and reviews that goes awry.

Any thoughts??

Found a better solution to this issue than what I posted previously..

Issue:
If you have both Tabbed Products Pro, and Zen Lightbox installed AND your products have model numbers defined, the problem outlined above will manifest itself.

To fix this in the includes/modules/pages/product_reviews/header_php.php file replace this:

  if (zen_not_null($review->fields['products_model'])) {
     $products_name = $review->fields['products_name'] . '<br  /><span class="smallText">[' .  $review->fields['products_model'] . ']</span>';
  } else {
    $products_name = $review->fields['products_name'];
  }

with this:

if (TPP_GLOBAL_ENABLE_TABS == '1') {  
  if (zen_not_null($review->fields['products_model'])) {
    $products_name = $review->fields['products_name'];
  }

  } else {
  if (zen_not_null($review->fields['products_model'])) {
     $products_name = $review->fields['products_name'] . '<br  /><span class="smallText">[' .  $review->fields['products_model'] . ']</span>';
  } else {
    $products_name = $review->fields['products_name'];
  }
}

What this change does:
If you have Tabbed Products Pro and Zen Lightbox installed, the model number field will NOT display on the product reviews page.

I realize this is pretty much a bandaid solution, but coming up with a solution that allows the product model field to display when both TPP and Zen Lightbox are installed and active is over my paygrade to execute. I don't know if the issue is in the TPP code, or the ZenLight box code or if a change needs to be made in both. Again, someone smarter than me will need to figure this out. So I am sharing a down and dirty solution that works.