Zen Lightbox addon [Support Thread]

[ZeeRocK]

Hi,

I have a new site (link below) and I have installed a script which you can see on the right side. Now this is a Java Script. If I remove that java script Light Box works without any problem but script doesn't.

If I keep the script the lightbox breaks and images open in plain white window, which can be seen on the site at the moment.

Any help as to how can I keep both scripts ?

Thanks

Site here ------ http://bit.ly/9flPfh

[biowerks]

Bump!!!!

[john4803]

Great add-on and got it working on 2 different stores. Cannot get it to work on ezpages, however? I know it says to add the jscript_zen_lightbox.php file to the file in modules>pages but there is no file for the ezpage folders I created? Any ideas? Thanks!

Anyone have any ideas on this? Will this only work on define pages and not simply ez-pages since there does not seem to be a file to place the jscript file in?

[tlahtine]

Seems that the zen lightbox does not work with all browsers. It does not load the picture, just displays an empty white box with the following browsers I tested:
Opera 9.51
Google Chrome 7.0.517.41

How to correct this? I would think that I have to remove Zen Lightbox if this issue can not be solved.

[davewest]

Anyone have any ideas on this? Will this only work on define pages and not simply ez-pages since there does not seem to be a file to place the jscript file in?

The idea should be the same as any other page.... load the script and call to zen_lightbox(url, description, options);

maybe something like..

<?php
require_once(DIR_FS_CATALOG . DIR_WS_CLASSES . 'zen_lightbox/slimbox.php');
  require_once(DIR_FS_CATALOG . DIR_WS_CLASSES . 'zen_lightbox/autoload_default.php');
?>


  if (ZEN_LIGHTBOX_GALLERY_MODE == 'true' && ZEN_LIGHTBOX_GALLERY_MAIN_IMAGE == 'true') {
    $rel = 'lightbox-g';
  } else {
    $rel = 'lightbox';
  }
?>
<script language="javascript" type="text/javascript"><!--
document.write('<?php echo '<a href="' . zen_lightbox($products_image_large, addslashes($products_name), LARGE_IMAGE_WIDTH, LARGE_IMAGE_HEIGHT) . '" rel="' . $rel . '" title="' . addslashes($products_name) . '">' . zen_image($products_image_medium, addslashes($products_name), MEDIUM_IMAGE_WIDTH, MEDIUM_IMAGE_HEIGHT) . '<br /><span class="imgLink">' . TEXT_CLICK_TO_ENLARGE . '</span></a>'; ?>');
//--></script>

I've used the same idea on other pages on my site...

[davewest]

Seems that the zen lightbox does not work with all browsers. It does not load the picture, just displays an empty white box with the following browsers I tested:
Opera 9.51
Google Chrome 7.0.517.41

How to correct this? I would think that I have to remove Zen Lightbox if this issue can not be solved.

I guess after Chrome 4 it stop working... until Chrome is fixed, you could add AppleWebKit to the list checking for non-DOM ready browsers.

in... includes\classes\zen_lightbox\autoload_default.php

if (!/android|iphone|ipod|series60|symbian|windows ce|AppleWebKit|blackberry/i.test(navigator.userAgent)) {
    window.addEvent("domready", Slimbox.scanPage);
}

It works with Opera/9.80 (Windows NT 5.1; U; en) Presto/2.6.30 Version/10.63

IE6-8
Firefox Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.1.3) Gecko/20090824 Firefox/3.5.3

[john4803]

The idea should be the same as any other page.... load the script and call to zen_lightbox(url, description, options);

Thanks Dave but I'm not sure where to put the code? I'm pretty much of a newbie to php! Should there be a file for the ez-pages I'm trying to call to? I read somewhere that they are taken care of in the data base tables? I have searched all of the zen cart files and can't find them so far?

Thanks for your patience!

[davewest]

Seems that the zen lightbox does not work with all browsers. It does not load the picture, just displays an empty white box with the following browsers I tested:
Opera 9.51
Google Chrome 7.0.517.41

How to correct this? I would think that I have to remove Zen Lightbox if this issue can not be solved.

I was wrong about Chrome... its Mootools that needs to be upgraded to version 1.3 in zen lightbox.... Chrome wont work with anything lower then 1.3 of Mootools....

Thanks Dave but I'm not sure where to put the code? I'm pretty much of a newbie to php! Should there be a file for the ez-pages I'm trying to call to? I read somewhere that they are taken care of in the data base tables? I have searched all of the zen cart files and can't find them so far?

Thanks for your patience!

Yes, ezpages are completely in the database... Just before you open or create a new ezpage, change the editor to 'Plain text'. That way you can enter html/php as you create your page.
Slimbox is only activated by the one file in the page folder, you need to place that code at the top of the ezpage. Then call the function at your image locations. Because I don't use ezpages, I'll have to play around with it a bit to see what else slimbox can do...

[davewest]

@john4803

Had to do some searching, thought the page had gone, but found it again here http://code.google.com/p/slimbox/wiki/MooToolsAPI

I've tried both ways and this works best for ez-pages instead of javascript.... should degrade to a popup or new window...

this work on Slinbox 1.71 and full mootools 1.3

On your ez-page do your links with the rel="lightbox" in the links for linghtbox to work...

<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>

if you want more then one image....

<a href="images/image-1.jpg" rel="lightbox-atomium">image #1</a>
<a href="images/image-2.jpg" rel="lightbox-atomium">image #2</a>
<a href="images/image-3.jpg" rel="lightbox-atomium">image #3</a>

Hopefully this helps... I should of searched for this page before now... also, the old Slimbox that came with this mod is not compatible with newer version of Mootools... many of the functions have changed in mootools This is Slimbox 1.71 setup to work as before with zen lightbox mod... you will also need to replace mootools in your template folder with a newer one... I use the full core 1.3 compacted compatible version..
slimbox.zip

[Friedrich72]

Dave West -
I am having a similar problem to ZeeRocK's .

Maybe an answer to mine would be an answer to his somehow...


I want to put a zen lightbox effect into my banner sidebox. I want to be able to click the image in the sidebox and have it open a larger image.

I can do that successfully if I put the jscript_zen_lightbox.php file into the includes/modules/pages/index folder.

BUT putting that jscript into the index folder causes an advanced product filter add on to not function in my tpl_index_product_list.php file.

So I've been trying to put the following into the bannerbox file somehow but dont know where to put it:

<?php
require_once(DIR_FS_CATALOG . DIR_WS_CLASSES . 'zen_lightbox/slimbox.php');
require_once(DIR_FS_CATALOG . DIR_WS_CLASSES . 'zen_lightbox/autoload_default.php');
?>


if (ZEN_LIGHTBOX_GALLERY_MODE == 'true' && ZEN_LIGHTBOX_GALLERY_MAIN_IMAGE == 'true') {
$rel = 'lightbox-g';
} else {
$rel = 'lightbox';
}
?>
<script language="javascript" type="text/javascript"><!--
document.write('<?php echo '<a href="' . zen_lightbox($products_image_large, addslashes($products_name), LARGE_IMAGE_WIDTH, LARGE_IMAGE_HEIGHT) . '" rel="' . $rel . '" title="' . addslashes($products_name) . '">' . zen_image($products_image_medium, addslashes($products_name), MEDIUM_IMAGE_WIDTH, MEDIUM_IMAGE_HEIGHT) . '<br /><span class="imgLink">' . TEXT_CLICK_TO_ENLARGE . '</span></a>'; ?>');
//--></script>


Any help is much appreciated!