Install LightBox as usual. Test that it's working.
Then get the Greybox files from the attachment link at the bottom of this post.
Unzip these files into your Site, DesignPreviewHTML and PreviewHTML folders.
Edit your overall layout and replace the lines
Code: Select all
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="lightbox.js"></script>
<link rel="stylesheet" href="lightbox.css" type="text/css" media="screen" />
Code: Select all
<script type="text/javascript">
var GB_ROOT_DIR = "<actinic:block if="%3cactinic%3avariable%20name%3d%22IsPreviewMode%22%20%2f%3e" >.</actinic:block>./";
</script>
<script type="text/javascript" src="AJS.js"></script>
<script type="text/javascript" src="AJS_fx.js"></script>
<script type="text/javascript" src="gb_scripts.js"></script>
<link href="gb_styles.css" rel="stylesheet" type="text/css" media="all" />
<!-- Actinic specific fixes -->
<script type="text/javascript>
function afterpageload(){<actinic:variable name="OnLoadScript" value="PreloadImages" />}
</script>
<script type="text/javascript">AJS.AEV(window, 'load', function() {afterpageload()});</script>
Code: Select all
<body onload="<actinic:variable value="PreloadImages" name="OnLoadScript" />">
Code: Select all
<body>
rel=\"lightbox[$ProductAnchor]\"
to
rel=\"gb_imageset[$ProductAnchor]\"
Finally, go to Design / Additional file and add the file "loader_frame.html".
Note that Lightbox is the supported add-on and that I cannot provide the same level of support for Greybox.