Fual Slimbox (Lightbox) - Ver 1.0 Support

[HeathenMagic]

Hello again,

many thanks for the tip ; I looked at the Headerwrapper div, and it had position;relative which I remember adding to the end to a mod which has since been taken off.

Sorry for taking your time and many thanks.

Regards,

Heathenmagic

[SilverZulu]

BTW, is there any way to make the prev - next on the 2 sides of the images more obvious? For now it cant be seen unless you hover your mouse on it.
Regards

There is a very easy and quick fix for this and only involves a css change (but I would recommend changing the next and previous images as below). Has been tested with FF2 and IE7.

Edit includes/templates/{YOUR TEMPLATE}/css/stylesheet_slimbox_ex.css and change the lbNextLink and lbPrevLink styles to

#lbNextLink {
  background: transparent url(../images/slimbox/sb_next.gif) no-repeat;
  top: 0;
  right: 0;
}

#lbNextLink:hover {
  cursor:pointer;
} 

#lbPrevLink {
  background: transparent url(../images/slimbox/sb_prev.gif) no-repeat;
  top: 0;
  left: 0;
}

#lbPrevLink:hover {
  cursor:pointer;
} 

NOTE the changed image file names. Copy the following 2 images (right click - save as) to includes/templates/{YOUR TEMPLATE}/images/slimbox

[banswidthjunkie]

There is a very easy and quick fix for this and only involves a css change (but I would recommend changing the next and previous images as below). Has been tested with FF2 and IE7.

Edit includes/templates/{YOUR TEMPLATE}/css/stylesheet_slimbox_ex.css and change the lbNextLink and lbPrevLink styles to

#lbNextLink {
  background: transparent url(../images/slimbox/sb_next.gif) no-repeat;
  top: 0;
  right: 0;
}

#lbNextLink:hover {
  cursor:pointer;
} 

#lbPrevLink {
  background: transparent url(../images/slimbox/sb_prev.gif) no-repeat;
  top: 0;
  left: 0;
}

#lbPrevLink:hover {
  cursor:pointer;
} 

NOTE the changed image file names. Copy the following 2 images (right click - save as) to includes/templates/{YOUR TEMPLATE}/images/slimbox

Cheers, I will put this as an option in the CSS for the next release which might be tonight; there are a couple of very minor issues. But I have been holding off posting a new version in case anything else cropped up.

[tacoma]

I'm trying to tackle a weird issue.

On additional images, I can't get the _LRG image to load. On the product page. The secondary image is previewed just fine. The src= points to the correct _LRG.jpg. The href points to the same img but it adds on another _LRG to the file name. example - href="images/large/1DA02_LRG_LRG.jpg">

I'm trying to figure out why it's adding the additional _LRG

[tacoma]

I fixed the issue. I for some reason put the 1DA02_LRG in the /image directory. It of course was adding the _LRG to the href pointing to the image/large directory.

Problem fixed by putting the correctly named and sized 1DA02.jpg in the /image directory.

[banswidthjunkie]

Pleased to hear it.

[tacoma]

I love this mod.

I also like the hover-over (next-prev) button for multiple images. I'm affraid that the non-savvy customers will miss that.

So I did the non-hover mod for the next-prev buttons, and it works perfectly.

[banswidthjunkie]

Yes despite the fact that it looks very ########

1) The default next prev hovers don't work in IE6 (big problem)
2) They aren't very obvious (even to savvy customers I think)

So basically, from a usability point of view I think that, since so many people have mentioned it, I need to offer zencarters both options for the mod. Give me a little time though as I have some "real" work to do at the moment.

[dreamz]

Great plugin, it works fine even with the Lightbox plugin installed and does turn it off!

I saw the response about adding the effect to ex pages, but how do I add the effect to define_main_page.php and any of the other define pages?

[banswidthjunkie]

Great plugin, it works fine even with the Lightbox plugin installed and does turn it off!

I saw the response about adding the effect to ex pages, but how do I add the effect to define_main_page.php and any of the other define pages?

It works exactly the same as for ez-pages. When you make a new define page you create a folder called:

/includes/modules/pages/YOUR_PAGE

Copy the jscript_slimbox.php file into this directory and then add

rel="lightbox[gallery]"

to any links that you want to appear in a lightbox. Because this is the extended version of slimbox you can even load whole webpages in the lightbox, for example try putting:

<a href="http://www.google.com" rel="lightbox[gallery]">google</a>

on your page.

This method applies to any page in zencart.