Zen Lightbox addon [Support Thread]

Well, that was super simple to figure out!!

copy the /includes/modules/pages/product_info/jscript_lightbox.php file to the appropriate /modules/pages folder for the page in question.

For a future release, there are at LEAST these three places this should be copied to that will affect every installation (because they are part of the core code):

/includes/modules/pages/product_reviews
/includes/modules/pages/product_reviews_info
/includes/modules/pages/product_reviews_write

Hope that helps!

- Steven

Thanks for the constant stream of comments. It's always good to receive feedback from the community. :) I've been a little tied up with work recently (hence the lack of communication on my part), but I should have more free time to dedicate to Zen Lightbox soon.

I'll be releasing a new version of Zen Lightbox soon (it'll contain a few bug fixes and better documentation).

When the new version has been uploaded I'll post back.

Also, I am still reading previous posts/comments regarding Zen Lightbox and will hopefully address any issues raised very soon.

Thanks, Steven. I hadn't found where IH2 had hidden its admin features. Now I know where they are.
mark

:wacko: I Have NO IDEA what I am doing wrong, but I can't get the lightbox to work on our site. Is there a magical button I am not pressing? Please help, I love this lightbox idea!


I have renamed the files as stated in the readme file
Then I used my ftp program and individually transfer each of the files into the corrosponding file. is this right?

Alex,
I'm having a issue with lightbox with zc 1.3.6 The additional image are showing up on the product info page but when I try to view them with the lightbox I just get the spinner. I do not have IH2 installed.

I just tried it on your website and it worked fine.

S_mack thanks but the problem was on a development site..........and I found the problem.......it was me:blush: I seem to have a problem with maintaining consistency with file names (B vs b)

Glad it's all working.

I'm just about to launch my newest Zen Cart website (will post link here when I'm done). It should be online by the weekend.

Then I can look at the next release of Zen Lightbox! :)

Quote:

---

Originally Posted by NamSingh

I need to move the popup image so it starts nearer the top!!!

---

Was this addressed yet? I too would really like to adjust how close to the top the image is. With my banner in the background, it just looks funny - and with my larger photos, it makes people have to scroll. I haven't been able to find where in the code this is controlled.

- Steven

While we're at it... I noticed that if you click the image it closes - which is cool.... but it also closes if you click anywhere on the screen above the plane of the top of the image (mouse above the image or above and to the right/left)

This isn't a huge deal, but a bit odd behaviour... any way to "fix" this?

- Steven

Quote:

---

Originally Posted by s_mack

Was this addressed yet? I too would really like to adjust how close to the top the image is. With my banner in the background, it just looks funny - and with my larger photos, it makes people have to scroll. I haven't been able to find where in the code this is controlled.

- Steven

---

Look in the lightbox css and find this:

Quote:

---

#lightbox {
left:0;
line-height:0;
position:absolute;
text-align:center;
top:40px;
width:100%;
z-index:100;
}

#hoverNav {
height:100%;
left:0;
position:absolute;
top:0;
width:100%;
z-index:10;
}

#overlay {
-moz-opacity:0.6px;
background-color:#000;
filter:alpha(opacity=60);
height:500px;
left:0;
opacity:0.6px;
position:absolute;
top:0;
width:100%;
z-index:90;
}

---

The lines that I bolded are the ones I *think* you would need to play with...but I could be wrong...I haven't tried it myself...

Actually z-index is used for stacking objects on top of one another (farthest to closest) what I think you want to look at changing is:

Code:

---

#lightbox {
left:0;
line-height:0;
position:absolute;
text-align:center;
top:40px;
width:100%;
z-index:100;
}

---

I believe this controls how far down from the top the lightbox starts....I also have not tested this yet....ok I tested and the lightbox is exactly 40px from top of browser window

Ah thanks! I had that line bolded too but then decided that probably wasn't it haha, oh well, at least I was close ;)

Quote:

---

Originally Posted by s_mack

While we're at it... I noticed that if you click the image it closes - which is cool.... but it also closes if you click anywhere on the screen above the plane of the top of the image (mouse above the image or above and to the right/left)

This isn't a huge deal, but a bit odd behaviour... any way to "fix" this?

- Steven

---

I always thorght that it was best to have the semi-transparent background linked with closing the lightbox (and it is default lightbox behaviour).

My view was that it was 'easier' for the customer to close the image (if they didn't see the 'close' button or tried clicking on the image itself).

I'll see if a it's possible to change this however.

I tried downloading this contribution, but i got a lot of grabled code. I then tried downloading the linked file, but all i got was an index.php file and nothing more. could someone point me in the proper direction???

Zen Lightbox is currently packaged in a RAR archive.

I'm guessing you haven't got a program install to handle such files, which means you're getting all this 'garbled' code.

Download and install WinRAR from the url below. It's a free 40 day trail version, but works just fine.

Once installed you'll be able to open the Zen Lightbox RAR file with no problems.

For future reference, I'll be releasing all updates compressed as ZIP archives.

Let me know how you get on. :)

Oopps... I forgot the url! :P

http://www.rarlabs.com

Regarding RAR files... I wouldn't bother with winRar... since it isn't free really. Try www.7zip.org best I've found and handles just about any format!

Alex, I don't mind having it close the lightbox when you click the transparant portions.. what I meant was that it ONLY closes if you click ABOVE the image... clicking to the area left, right, or below the image does nothing. That is what is odd. Should either be everything or nothing.

Maybe that's just my browser? Only tried it on IE7

- Steven

This is a bug at the moment. I'll try and squash it in a future release.

Hi,
I was install it and work great :smartass: .Can somebody tell me how to add more image in product?(At this time,i Just can add 1 image... :mellow: )

Thanks

How do I add multiple images to a product?
by: Ajeh - Linda McGrath

A product owns 1 filename ...

Example:

You load via the categories.php an image file called:

a_bugs_life.gif and put it in the /images/dvd directory via the drop down

Now you FTP additional images to /images/dvd

a_bugs_life_01.gif
a_bugs_life_02.gif
a_bugs_life_03.gif
a_bugs_life_04.gif

I use the numbers so these load in order, as the additional images are loaded alpha/numeric

For the large image I FTP:

/images/large/dvd/a_bugs_life_01_LRG.gif
/images/large/dvd/a_bugs_life_02_LRG.gif
/images/large/dvd/a_bugs_life_03_LRG.gif
/images/large/dvd/a_bugs_life_04_LRG.gif

For the medium image (used on product_info) I FTP

/images/medium/dvd/a_bugs_life_MED.gif

Now you do not need to use subdirectories.

All images can be loaded to

/images
/images/large
/images/medium

You can also change the suffix for Large and Medium from _LRG and _MED to something else or to nothing at all.

I use the suffixes so when looking at 2000 images I can tell what size I am really looking at just from the name.

In a future release, this will be more automated with options for auto-generating the thumb and medium based on dpi, height, width and compression ratio

For now, it uses the same directories that the auto-generated would use, but you do the FTP for the different sizes and additional images.

Additional information:

Note: the base image name is the original image name loaded for the product.

The suffix of _MED and _LRG is optionally defined but very handy for distinguising image names from a visual stand point.

The medium images are kept in the /images/medium directory and the large in the /images/large directory

Additional images can be the base name of the original image plus anything after that example:

Original Image: fred.jpg

All of these are considered additional images because they contain the base image name:

fredabc.jpg
fred_73b2.jpg
fred_01.jpg
fred_02.jpg
freddy.jpg
fredrick.jpg

The advantage of the numbering on the additional images like: _01 _02 _03 is that they will sort in this order when displayed.

These images are places in the same directory as the main image such as /images or /images/dvd

The large image match would then go in /images/large or /images/large/dvd with the Admin defined suffix added to it of _LRG

fredabc_LRG.jpg
fred_73b2_LRG.jpg
fred_01_LRG.jpg
fred_02_LRG.jpg
freddy_LRG.jpg
fredrick_LRG.jpg

Hi,

I just finished 'flash'ing my header but when I enlarge my respective product image, it is somehow overlapping the Zen lightbox effect :dontgetit ...anybody know how to fix this?! picture attached...

oops, forgot to tell that the problem arose in IE...:D

Version 1.2 and above of Zen Lightbox has a Flash by-pass feature.

It's mentioned here (at the bottom of this post)...

http://www.zen-cart.com/forum/showpo...3&postcount=31

Hope this helps. :)

Quote:

---

Originally Posted by Alex Clarke

Version 1.2 and above of Zen Lightbox has a Flash by-pass feature.

It's mentioned here (at the bottom of this post)...

http://www.zen-cart.com/forum/showpo...3&postcount=31

Hope this helps. :)

---

gee, thank alex! :wink2: I never thought it would be that easy to fix...:lamo:

No problem.

I'll be looking at adding better support for flash objects in one of the new releases. So it should make it even easier! :)

I have nothing to contribute, but i'll just like to thank alex for his great work!!!!!

we i installed it to my site today after i installed ih2 and it works great on my main image but it doesn't work on my additional images, could i be missing something?

here is my site.
http://www.gorillagear.ca/store/

Yes, you are missing something. Go back through the instructions carefully... I think you forgot to put a javascript file in the right place. I noticed you have other errors relating to IH2, for example

Quote:

---

Warning: imagedestroy(): supplied argument is not a valid Image resource in /home/www/gorillagear.ca/store/includes/classes/bmz_image_handler.class.php on line 531

---

- Steven

i tried uninstalling it know i'm screwed as i can't reinstall it or anything, i just don't get it.

i reinstalled everything and i seem to be back to were i started lightbox works on the main image only

Can you provide a direct link to a product page with additional images?

Had a little look, but couldn't see any products with additional images! :S

Its really just a hunch MB1... but considering you go from "I'm totally screwed I can't uninstall it" to "ok, its uninstalled and reinstalled" in under 30 minutes... I'd suggest you possibly slow down and make SURE you are reading each line of the instructions carefully and completely.

Sorry if that came off insulting... its just, the install went so perfectly for me so I figure you're probably missing a step.

- Steven

yeah sorry, i pretty much reinstalled the whole site. still in the process of doing so, as for earlier when i ean into the problem with light box i tried uninstalling it but then by doing so i ran into larger problems with IH2 no working right i installed and reinstall ih2 but nothing was working until i reinstalled the light box files then everything was back to were it was. i'm going to try and reinstall ih2 adn lightbox later tonight we will see how it goes again.

i'm allmost ready to try it again after a lil nap, i was just curious if i should take off the IH2 msql patch that was install in my lst attempt so this time it could be a clean step by step install, and how would i go about that?

does light box automaticly shrink down my pics? if so i may not need IH2

No need to modify any of your database.

Zen Lightbox does not resize or convert images. It simply displays them.

So I would recommend keeping IH2 installed and follow the installation instructions for Zen Lightbox.

Let us know how you get on! :)

I have a 1.3.6 site in development and have been using lightbox from the begining with it, works great. The other day I decided to install IH2 and I have found no problems at all.

works like a charm now.

http://www.gorillagear.ca/index.php?...products_id=13

Why this page gave an error?

http://www.nokoria.com/genuine/index...r_of_uploads=0


Thank you,

the [1940RY-RB] should not be there... any idea why?


Thank you,

looks like a model number.

s_mack,

Yes, it is a model number.

But I dont think it's supposed be shown....

[1940RY-RB]">

There is a missing tag somewhere...

Is it just my site? Anybody else get this? Is it a zencart bug?

When I click on it I get a zoom. Does that help any?

Quote:

---

Originally Posted by opentrees

When I click on it I get a zoom. Does that help any?

---

Thanks for the respond.

The Zen Light works... even on the review page. that's great.

However, this

[1940RY-RB]">


should not be there. It's an error. Is it just my site?

I should have mention that it is a REVIEW Page.

Thank you,

Quote:

---

Originally Posted by Alex Clarke

(an update for Zen Lightbox will be released soon to fully support 1.3.6).

---

Quote:

---

Originally Posted by Alex Clarke

I'm currently working on the next version of Zen Lightbox. I'll add a few new features and make it fully functional with 1.3.6. The current version will work with 1.3.6, but may require some tweaking.

---

Hi Alex-

It appears you have made many people happy with your Lightbox mod. I was about to install your version 1.3 mod on Zen Cart 1.36 shop (which already has ImageHandler 2 installed). But I decided to read this entire thread first and then observed the above quotes.

Before I install I am wondering about the specific "tweaking" which needs implemented to "fully" support 1.3.6?

Or should I wait for v.1.4 of your mod which I suspect is just around the corner?

Thank you for any info.

Woody

Quote:

---

Originally Posted by Woodymon

Before I install I am wondering about the specific "tweaking" which needs implemented to "fully" support 1.3.6?

---

After looking at the distribution/readme I see it is an easy/quick install so decided to just do it.

One thing. The readme instructs to install the 6 gif images and 4 js files into /template_default.

Is there any reason why these files cannot be dropped into my custom template directory instead and therefore override template_default (just like the template file)?

Woody

Quote:

---

Originally Posted by Woodymon

Is there any reason why these files cannot be dropped into my custom template directory instead and therefore override template_default (just like the template file)?

---

1. After I found placing the image and js files in my custom directory did not work I put them into template_default and everything works as advertised.

(Note: I'm using the tabbed_products lite mod and placing the js files for that mod into the custom directory structure (but not template_default) works.

So hoping for a more informational answer than "don't do it that way because it doesn't work". The more I begin to think I understand overrides, along comes another exception to the rule ;-)

2. A more important issue/question:

When I view the shop with Lightbox installed I observe different results in Firefox 2 on two different PC's (but with IE6 there are no differences). With FF2 on one PC, after I click on the main image (or any one of the additional images) the Lightbox window appears with a white square on top of a black background. However no product images or navigation controls display, In FF2 on the other PC Lightbox displays correctly.

I've cleared my browser cache but same result. FF2 configuration and firewall settings are exactly the same on both PC's

DOM Inspector in FF2 shows no errors. I disabled AdBlock and NoScript but observe same issue. JS is enabled, otherwise the product tabs would not render on the product_info page.

I noted the FF2 Error Console shows:

Quote:

---

Warning: Error in parsing value for property '-moz-opacity'. Declaration dropped.
Source File: /includes/templates/fz/css/stylesheet_lightbox.css
Line: 112

Warning: Unknown property 'filter'. Declaration dropped.
Source File: /includes/templates/fz/css/stylesheet_lightbox.css
Line: 114

Warning: Error in parsing value for property 'opacity'. Declaration dropped.
Source File: /includes/templates/fz/css/stylesheet_lightbox.css
Line: 117

Warning: Error in parsing value for property 'display'. Declaration dropped.
Source File: /includes/templates/fz/css/stylesheet_lightbox.css
Line: 133

---

stylesheet_lightbox.css contains:

Quote:

---

#overlay {
-moz-opacity:0.6px; <--- LN 112
background-color:#000;
filter:alpha(opacity=60); <--- LN 114
height:500px;
left:0;
opacity:0.6px; <-- LN 117
position:absolute;
top:0;
width:100%;
z-index:90;
}

* html>body .clearfix {
display:inline-block; <-- LN 133
width:100%;
}

---

I then checked some other shops posted in this thread which have Lightbox installed and I noted the same issue with Lightbox not displaying correctly in FF2 on this one PC.

On the other hand the Error Console shows the exact same errors for these other sites in FF2 on both PC's. (so I conclude we have two different issues going on here).

Any idea why Lightbox would work in FF2 browser on one PC but not the other?

3. BTW when I made an animated gif as one of the additional images, Lightbox displays some strange results and repeatedly rebuilds the image frame ;-)

Woody

Quote:

---

Originally Posted by gems14k

should not be there. It's an error. Is it just my site? I should have mention that it is a REVIEW Page.

---

I just wrote my first test product review and the resulting product review page:

(/index.php?main_page=product_reviews&products_id=2)

displays an out of place model number (within brackets with an apostrophe and greater sign symbol appended at the very end). This is the product reviews URL which displays until admin approves the Review. The same as gems14k just reported.

For example:

Code:

---

[ProductName Model Number]">larger image

---

The model number displays to the left of the product image and under the image the text "larger image" is displayed. Both together form a single URL which links to the product image.

Also I see the ALT tag for this link is very strange:

Code:

---

ProductName<br /><span class=

---

I had not observed this issue before installing the Lightbox mod. But since this was the first review authored, and was authored after the install of Lightbox, I do not know which code might be producing this issue (Lightbox or some other mod or Zen Cart bug or ...)?

On the other hand, once the Review is approved by admin, the page:

/index.php?main_page=product_reviews_info&products_id=2&reviews_id=1

displays the "larger image" link correctly along with a correct ALT tag.

But Lightbox did not work on the Reviews page for me. So rereading this thread, I noted s_macks' recommendation on post #204. And indeed after employing his suggestions Lightbox worked on reviews pages.

However the model number still incorrectly displays as part of the "larger image" link (on the Reviews page, that is... until the Review is approved by admin).

Hope this makes sense.

Woody

Quote:

---

Originally Posted by Woodymon

However the model number still incorrectly displays as part of the "larger image" link (on the Reviews page, that is... until the Review is approved by admin).

Hope this makes sense.

Woody

---

Thanks for the info, Woody.

However, the review on my site is approved, but the error tag is there...

Quote:

---

Originally Posted by gems14k

Thanks for the info, Woody.

However, the review on my site is approved, but the error tag is there...

---

Gems14k:

I'm think we are in agreement. I will use your site as an example of the issue...

The review page which customers will have access to and see (after the review has been approved) does not display the malformed text in the link.

See here:
http://www.nokoria.com/genuine/index...8&reviews_id=2

But the page the review author will observe immediately after submitting the review and the page the customer will see if review has not been approved does indeed show the malformed text for the link.

See here:
http://www.nokoria.com/genuine/index...roducts_id=358

So what I was trying to say is the error impacts product_reviews but does not impact product_reviews_info.

I observe everything behaves/degrades correctly when JavaScript is disabled.

Looking at tpl_modules_main_product_image.php updated for Lightbox/ImageHandler 2:

Code:

---

  <!-- begin zen lightbox v1.3 aclarke 2006-10-20 -->
  <script language="javascript" type="text/javascript"><!--
document.write('<?php echo '<a href="' . zen_image_lightbox_IH2_url($products_image_large, addslashes($products_name), LARGE_IMAGE_WIDTH, LARGE_IMAGE_HEIGHT) . '" rel="lightbox[gallery]" 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>
  <!-- end zen lightbox v1.3 aclarke 2006-10-20 -->

---

Which generates the following HTML on product_reviews page:

Code:

---

  <!-- begin zen lightbox v1.3 aclarke 2006-10-20 -->

  <script language="javascript" type="text/javascript"><!--
document.write('<a href="images/rings/1940RY-RB.jpg" rel="lightbox[gallery]" title="Genuine Ruby Band Ring 14K Yellow Gold<br /><span class=\"smallText\">[1940RY-RB]</span>"><img src="images/rings/1940RY-RB.jpg" alt="Genuine Ruby Band Ring 14K Yellow Gold [1940RY-RB]" title=" Genuine Ruby Band Ring 14K Yellow Gold [1940RY-RB] " width="267" height="225" /><br /><span class="imgLink">zoom</span></a>');

//--></script>
  <!-- end zen lightbox v1.3 aclarke 2006-10-20 -->

---

Note:

Code:

---

<br /><span class=\"smallText\">[1940RY-RB]</span>">

---

Hopefully this leads you in the right direction.

Woody

Thanks for all the bug reporting and code examples.

I'll look at addressing these issues in the next release. :)

I am trying to get this plug-in to work with the default template and I am failing. I suspect the problem lies in the renaming of the files. What is the file structure when using the default template? I can't rename the existing files since they are already in use.

Well any files with the same name that are in the lightbox mod and the default template, you would just replace the default ones with the ones from the light box mod......BUT YOU SHOULD NOT BE DOING IT THIS WAY. Ok enough yelling. You should be using the overrides sytem otherwise you risk losing everything on an upgrade. You also now have no ability to switch between the default and a custom template for troubleshooting purposes. You can do it if you want but as it is not the right way you'll find yourself chastised for doing it this way everytime you ask questions.

OK. I know there is a message in there somewhere. My guess is the following:

1. I should not be using or modifying the default template as an *actual* template. I should modify these files and save them under another name?

2. I should learn the override system. Back to the tutorials ...

With the overrides system you create a new directory in the includes/templates directory. In that directory copy over the template_info.php from the template_default and open it and edit it to reflect your template name, copyright info, etc.... Go admin>tools>template selection and click edit and select your new template. The directory structure in your new template should be the same as the default template. Only copy over and edit those files that need to be changed for your template, leave the rest alone.

Quote:

---

Originally Posted by barco57

With the overrides system you create a new directory in the includes/templates directory. In that directory copy over the template_info.php from the template_default and open it and edit it to reflect your template name, copyright info, etc.... Go admin>tools>template selection and click edit and select your new template. The directory structure in your new template should be the same as the default template. Only copy over and edit those files that need to be changed for your template, leave the rest alone.

---

Not sure if you've seen the site though.. he's using the "classic template"

you can just copy paste that entire "classic" folder in includes/templates, rename the folder, and change the template_info.php like barco said above.. and follow the rest of it :)

That only gives you part of it. If you compare the classic template and the default template you will see that the classic template just has the common template files, css and images.....You will still need to override specific template files from the default directory as needed.

FYI: The new site is loacated at http://www.billedmunds.com/exhibition.

I transfered my site to a new domain and the product info page is not working, the following message shows:

Fatal error: Call to undefined function: zen_image_lightbox_ih2_url() in ../templates/tpl_modules_main_product_image.php on line 17

Any idea on this? Thanks!

Hi all...

Just discovered an oddity.

Not sure if this was covered previously, sorry if this is old news...

I had a photo given me by a supplier and it wasn't working with LightBox. Tried various things and finally noticed that it was a 32-bit RGB Jpeg instead of the more normal 24-bit. Converted it and everything worked.

Symptom was the image would not load in IE (just got the pre-load "star") and would show as an inverted image in Opera.

So if anyone has a similar problem - check to make sure the image is a 24-bit jpeg!

- Steven

The pop-up overlay doesn't cover the whole screen in IE. It works fine in firefox.

See this page for testing:

http://www.nokoria.com/genuine/index...roducts_id=385

Any idea why?

Thank you,

That is odd... works fine in ie7. And lightbox works fine on my site on ie6 and ie7 - so I'm not sure why yours doesn't work with ie6.

Hi everyone.

Sorry for not posting in this thread much. I've been really busy.

However, I'm currently working on the next release of Zen Lightbox and will address as many of these bugs as possible.

Thanks for all the feedback so far. :)

I have successfully installed another lightbox module in WordPress butI have tried lightbox in the Simple Zen template with three installs and even mapping out the directory structure on paper.

Tried it out in FF2 and IE7 and cannot get it to work ....

Any suggestions before I abandon ship?

Hey Alex,
I was just monkeying around trying to adapt this lightbox contrib to something else on my site and got screwed up on the templates... I notice you hardcode templates in so I am making this suggestion:

In all files where you have something like:

Code:

---

<script type="text/javascript" src="includes/templates/template_default/jscript/lightbox_prototype.js"></script>

---

change it to:

Code:

---

<script type="text/javascript" src="<?php echo $template->get_template_dir('.js',DIR_WS_TEMPLATE, $current_page_base,'jscript');?>/lightbox_prototype.js"></script>

---

and then move everything from the "template_default" folder of your package to the "YOUR-TEMPLATE-FOLDER" folder.

This will bring your GREAT contrib more in-line with the override and templating standards of the zen platform.

- Steven

Oh, and then change the three appropriate lines of your css file from

Code:

---

background:transparent url(../../template_default/images/lightbox/blank.gif) no-repeat;

---

and

Code:

---

background-image:url(../../template_default/images/lightbox/prevlabel.gif);

---

and

Code:

---

background-image:url(../../template_default/images/lightbox/nextlabel.gif);

---

to

Code:

---

background:transparent url(../images/lightbox/blank.gif) no-repeat;

---

and

Code:

---

background-image:url(../images/lightbox/prevlabel.gif);

---

and

Code:

---

background-image:url(../images/lightbox/nextlabel.gif);

---

- Steven

Of course, now I see how you have a problem with hardcoding in the lightbox.js file :(

Where it says:

Code:

---

//
//        Configuration
//
var fileLoadingImage = "includes/templates/template_default/images/lightbox/loading.gif";       
var fileBottomNavCloseImage = "includes/templates/template_default/images/lightbox/closelabel.gif";

---

There's no easy way of doing that without hardcoding. I suppose the best way to work this if you want to conform as much as possible to the templating scheme of zen without creating a lot of work... is to do this:

Code:

---

//
//        Configuration
//
var fileLoadingImage = "images/lightbox/loading.gif";       
var fileBottomNavCloseImage = "images/lightbox/closelabel.gif";

---

and move the two image files to the main image directory.

All just suggestions!

- Steven

s_mack... That's exactly what I'm doing for the next release.

When I first put Zen Lightbox together I was quite lazy and didn't really make use of the overrides system very well. :(

However, all this will soon change with the next release.

Thanks for the info. :)

I posted on this previously but have yet to resolve. Does anyone have ideas why Zen Lightbox would work fine in Firefox 2 on one PC but not another (but works in IE on both PCs).

In FF2 I see a whitebox on black screen, but nothing else. I assume an issue with the JavaScript. I see that Zen Lightbox loads four different scripts:

1) Prototype JavaScript framework v.1.4.0 (lightbox_prototype.js);
2) Scriptaculous v.1.5.1 (lightbox_scriptaculous.js?load=effects);
3) Lightbox Effects (lightbox_effects.js);
4) Lightbox v2.02 (lightbox.js);

Firebug shows the following errors in stylesheet_lightbox.css (and Web Developer JavaScript console flags the same as warnings):

Error in parsing value for property '-moz-opacity'. Declaration dropped. (line 112)
Unknown property 'filter'. Declaration dropped. (line 114)
Error in parsing value for property 'opacity'. Declaration dropped. (line 117)
Error in parsing value for property 'display'. Declaration dropped. (line 133)

-Woody

also i am just wondering would the next update support slow internet connections? By that i mean, would the plugin be fully loaded faster than before? this has been the thing that stops me from using lightbox, as if it is not fully loaded, the image will only be shown simply as an image, rather than the effect its trying to achieve.

so most likely a stupid question...

but is it possible to change the color of the fade? that is instead of the screen going gray/black could i make the screen go a light pink? or green?

is that in the css? what would it be called?

in the stylesheet_lightbox.css find:

Code:

---

#overlay {
-moz-opacity:0.6px;
background-color:#000;
filter:alpha(opacity=60);
height:500px;
left:0;
opacity:0.6px;
position:absolute;
top:0;
width:100%;
z-index:90;
}

---

Change to whatever color suites your fancy

ahhh thank you :)

Quote:

---

Originally Posted by Hemma

also i am just wondering would the next update support slow internet connections? By that i mean, would the plugin be fully loaded faster than before? this has been the thing that stops me from using lightbox, as if it is not fully loaded, the image will only be shown simply as an image, rather than the effect its trying to achieve.

---

It's on the list, but I'm not sure if this feature will make it into the next release. I'll try my best! :)

Quote:

---

Originally Posted by Alex Clarke

It's on the list, but I'm not sure if this feature will make it into the next release. I'll try my best! :)

---

Hi Alex-

Wondering what is planned for the next release? Thanks.

Woody

I'll try to solve most of the problems users have posted here in the next release. There will also be support for 1.3.7, better use of the override system and possible admin controls to allow easy changes to be made to Zen Lightbox.

If you would like to see any features added to the next release please let me know and I'll try my best to include them.

Ooh can't wait can't wait!! .... just a question, how far away would it be? don't get me wrong, I'm not trying to be pushy, but just a rough indication would be fantastic!:smile:

Well... I'm just finishing my new site at the moment and it's taking a little longer than planned. :S I expect to release the new Zen Lightbox within 2 weeks time.

Alex,

I've found this webpage, which discusses about the actual javascript. This part may be of interest to others, who are also having the issue of not wanting to wait until finish loading with the page before the plugin would start to work.

http://www.huddletogether.com/forum/...&page=1#Item_0

Hope this helps.

I'm currently using this site for help! Great minds think alike! :)

Great contribution but I am having a slight problem getting more than just the main image to display. I click next and it just keeps "loading" forever. I am running 1.3.7 and thought (keyword ha) I installed everything correctly.

http://www.sffclub.com/store/index.p...roducts_id=181

There is a link to a product on my site (note the store is not operational yet)

Thanks for anyones help

try reloading the additional_images.php and make sure you use the correct directory tree includes/modules/YOUR_CUSTOM_TEMPLATE_NAME/additional_images.php

Quote:

---

Originally Posted by barco57

try reloading the additional_images.php and make sure you use the correct directory tree includes/modules/YOUR_CUSTOM_TEMPLATE_NAME/additional_images.php

---

tried that out...didn't work :(

could this be a problem with the 1.3.7??

Wouldn't be a problem with 1.3.7 cause I have a development 1.3.7 site up with lots of additional images and everything worked straight out of the box..........well it was a 1.3.6 site and upgraded to 1.3.7 during developement.....So I don't know if that makes any difference

I installed Image Handler 2.0 and it worked fine.

Quote:

---

Originally Posted by s_mack

Of course, now I see how you have a problem with hardcoding in the lightbox.js file :(

Where it says:

Code:

---

//
//        Configuration
//
var fileLoadingImage = "includes/templates/template_default/images/lightbox/loading.gif";       
var fileBottomNavCloseImage = "includes/templates/template_default/images/lightbox/closelabel.gif";

---

There's no easy way of doing that without hardcoding. I suppose the best way to work this if you want to conform as much as possible to the templating scheme of zen without creating a lot of work... is to do this:

Code:

---

//
//        Configuration
//
var fileLoadingImage = "images/lightbox/loading.gif";       
var fileBottomNavCloseImage = "images/lightbox/closelabel.gif";

---

and move the two image files to the main image directory.

All just suggestions!

- Steven

---

Steven,

Just wondering if you managed to find a solution to the problems with values contained within lighbox.js and altering them.

I'm currently testing a few 'ideas' out but coming up with nothing! :(

BTW - The new version of Zen Lightbox is almost ready to be released.

Alex -- I've disappeared for a bit, but I'm working on a new site, so I tried to catchup since the Image Handler release. Reading your last post, what is the reason to avoid Steve's suggestion of just moving the images to the images folder?

While it doesn't technically fall into the "templating override" - most people will be copying their image folders between upgrades. I think its the simplest solution - calling the template folder from zen-cart in the JS would require more complicated work-arounds.

You could also make the js file a php file that serves up js. I do the same thing for my business, but in .NET. Can you call <script type="text/javascript" src="includes/templates/(whatever PHP code to get template directory)/jscript/lightbox_prototype.php"></script>? It should work fine.

Well, that's my humble opinion anyway.

I'm looking forward to the latest release.

Chris

Chris,

Great to see you back and I hope the work on the new site is going well.

I can call the example you provided. However, I really want to be able to call php from the main lightbox js file. This isn't just to allow me to correctly use the template override system, but also to let me change certain lightbox settings.

Regards,

Alex

Alex... I just did what I suggested in the quote. But I like what (i think) Chris is suggesting... use a PHP file to generate the js on the fly and ditch the .js file altogether! More work, but ultimate flexibility and control.

Whenever you have js that needs to reference php variables it gets tough, and generating it on the fly is often necessary.

But my suggestion is MUCH simpler. The only downside, of course, is that the user can't override the two graphics files in their templates because its in the root images folder instead of the template's images folder. Obviously the user can change the images by replacing them... but if they want different "loading" and "closelabel" images for a (example) Christmas template or whatever, they lose the benefit of the zen templating system. I think this is a very minor concern since its only these two images and they are pretty universal images. Its not like they are front page banners or anything.

- Steven

You can't easily call PHP in js. JS is parsed on the client side, and PHP is parsed on the server side - obviously - so any PHP variables you want to access in JS have to be done on the server side.

Basically, instead of serving up a static js file, you call a PHP script, which creates js (or basically text in any form - which can be js) dynamically. You don't need to do anything special, just have it called from inside <script> tags. If you want, you can have the PHP output JSON or XML and then have the JS call that and parse it - but its a hell of a lot more work than just creating the JS file on the fly with the variables already in it.

So, I agree with Steven, for simplicity sake either calling a PHP file in the <script> tag is the most flexible option, and Steven's image directory solution is the most straight forward and quick solution.

The PHP file is the better solution long term, but you can publish your release today if you use Steven's solution, and then develop the PHP file in the next few weeks.

Hi
I m a new user of ZEN Cart and found this super add on.
However I would like to change the position of all the bottom cells.
Indeed, I prefer to have the description and the close image on the top instead of having it on the bottom.

Can anyone help me pleaze and tell me what to change ?

Thanks

Ok I am sure this has been addressed before but for the life of I can not find the answer on here, actually a couple of questions.....
I only have lightbox installed, no image handler or anything else

I can open the main image just fine, but when i click next or try to open one of the other product images i get nothing (little circle thing spins for ever)...also I have noticed that the additional product images are displaying the addition of _LRG after the name (not in the original file, getting added somehow)

Also when in ie, the black-out doesn't reach to the bottom of the page

if anyone can help it would be much appreciated
www.rectecmontana.com is the site it is on

scratch that last post...installed image handler and all is fixed

Thanks Alex for the great addition, it really does add a nice little touch

Great stuff!

How can I adjust the image height and width? I am using IE. It takes up more than what's on my screen and enlarges the images to more than what I need. If I could get it to 300px height or so that would be nice.

:lamo:

or maybe just 100% of the image size?

Quote:

---

Originally Posted by dandy

How can I adjust the image height and width? I am using IE. It takes up more than what's on my screen and enlarges the images to more than what I need. If I could get it to 300px height or so that would be nice.

---

If you're not using IH then it means that you uploaded too large of an image to your folder - either in you /images/ folder or your /images/large folder. Try sizing the image to whatever you want first and then upload it. Lightbox loads the image size that you have already specified.

Ah, I didn't see the new settings under Configuration > Images. Now I'm all set!

TY

How can we change the watermark image?