Lightbox is a script by which you can overlay images on the current page. It’s a ‘snap to setup’ and works on all modern browsers. An example of the use of Lightbox you can find at this link.
In order to use Lightbox in relation with you must follow the instructions of Lightbox, see this link.

After that you have to use a code like this:

<a onclick="myLightbox.start(this); return false;" rel="lightbox[set1]" href="myshop-eval:Image" title="myshop-eval:Description"><img style="myshop-image:Thumb" alt="detail foto" title="click for a larger image" /></a>


  • onclick="myLightbox.start(this); return false;" you need this code in order to display the pictures properly after you navigate to another product or after you selected a product variant
  • rel="lightbox[set1]" This code you need if you have several photos in one set. Now you can navigate from one photo to another within Lightbox
  • href="myshop-eval:Image" and title="myshop-eval:Description" You need these codes for the link of the larger picture (replace the word ‘image’ by the name of the column with the picture) and the description below the picture (replace the word ‘description’ by the name of the column with the description)
  • style="myshop-image:Thumb" This code is the code to display a picture, replace ‘thumb’ by the name of the column with the picture you want to display on the more info screen.

If you use skins, you have to include the necessary js files (which are on your own server) into the skins, by doing this Lightbox will be available everywhere.


Was this helpful?

Yes No
You indicated this topic was not helpful to you ...
Could you please leave a comment telling us why? Thank you!
Thanks for your feedback.

Post your comment on this topic.

Post Comment