Zen Colorbox

[niestudio]

glad to hear it's working well for you. I looked at the site and the "Extra" image is coming from your reviews tab, but the css is hiding it from display.
Is there a ZC setting to "include images in reviews" or something like that?

[DivaVocals]

glad to hear it's working well for you. I looked at the site and the "Extra" image is coming from your reviews tab, but the css is hiding it from display.
Is there a ZC setting to "include images in reviews" or something like that?

No there is no such setting in Tabbed Products Pro.. If I turn off the TPP setting to put the product reviews into a tab, then the extra image goes away..

I'm wondering if the fix I made here: http://www.zen-cart.com/showthread.p...411#post620411 to hide the extra reviews button somehow has affected things.. I would hate to not be able to keep reviews inside a tab just to use this add-on..

[niestudio]

I'll look into it an see what I can find.

d

[DivaVocals]

I'll look into it an see what I can find.

d

You are a doll.. I think this is gonna be my go to lightbox on a go forward.. Seems so much cleaner and lighter (pardon the pun) than Zen Lightbox (which I still love..)

[niestudio]

No there is no such setting in Tabbed Products Pro.. If I turn off the TPP setting to put the product reviews into a tab, then the extra image goes away..

I'm wondering if the fix I made here: http://www.zen-cart.com/showthread.p...411#post620411 to hide the extra reviews button somehow has affected things.. I would hate to not be able to keep reviews inside a tab just to use this add-on..

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_colorbox/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

[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_colorbox/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

Interesting.. but TPP gives an option of putting the additional images inside a tab.. If I make this change won't that mean that if I have my additional images inside a tab that the colorbox/lightbox effect will not be applied to my additional images?? My issue is that if I turn on the reviews tab so that all my product reviews appear in a tab, I then get some kind of extra image.. If I turn of the reviews tab, this behavior stops..

[niestudio]

Interesting.. but TPP gives an option of putting the additional images inside a tab.. If I make this change won't that mean that if I have my additional images inside a tab that the colorbox/lightbox effect will not be applied to my additional images?? My issue is that if I turn on the reviews tab so that all my product reviews appear in a tab, I then get some kind of extra image.. If I turn of the reviews tab, this behavior stops..

Yes, I suppose it would.
I didn't test all the features of the tab, just the review setting and then I noticed that I had doubles of all my additional images too.

if you just want to take care of the review image then you could modify the code to:

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

and later if you have an issue like I saw with the additional image, it could be wrapped in an if statement to check wether or no the additional images are in a tab or not.

[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??

[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..

Issue:
If you have both Tabbed Products Pro, and Colorbox 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 Colorbox 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 Colorbox are installed and active is over my paygrade to execute. I don't know if the issue is in the TPP code, or the Zen Colorbox 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.

[DivaVocals]

Yes, I suppose it would.
I didn't test all the features of the tab, just the review setting and then I noticed that I had doubles of all my additional images too.

if you just want to take care of the review image then you could modify the code to:

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

and later if you have an issue like I saw with the additional image, it could be wrapped in an if statement to check wether or no the additional images are in a tab or not.

Want to understand this change.. Are you saying that applying this change alone will stop the extra image I see when viewing the product images?? (I only see this extra image when my reviews are inside of a tab)