We thought we would save you some time and post the code we used for the screenshot gallery on the Shop Front Template.



For a complete list of the Grey Box features please visit orangoo.com/labs/GreyBox/.



When we were testing this template we found that most of the wysiwyg editors were stripping away some of the class attributes of the links we were putting in using the html dialogue box.



In general the editors stripped any of the links we tried to implement from the normal usage page orangoo.com/labs/greybox/normal_usage.html ... so we found that you need to implement the advanced usage links to get it working properly in Joomla!





This is directly from the Grey Box website:

Code:



<script>

var image_set = [{'caption': 'Shop Front Blue', 'url': 'www.joomlabamboo.com/images/stories/shop_front/Blue Narrow Search.jpg'},

{'caption': 'Shop Front Black', 'url': 'www.joomlabamboo.com/images/stories/shop_front/Black Narrow Calendar.jpg'},

{'caption': 'Shop Front Green 2', 'url': 'www.joomlabamboo.com/images/stories/shop_front/Green 2 Narrow Front.jpg'},

{'caption': 'Shop Front Green', 'url': 'www.joomlabamboo.com/images/stories/shop_front/Green Narrow Calendar.jpg'},

{'caption': 'Shop Front Orange', 'url': 'www.joomlabamboo.com/images/stories/shop_front/Orange Narrow Front.jpg'},

{'caption': 'Shop Front Purple', 'url': 'www.joomlabamboo.com/images/stories/shop_front/Purple Narrow Front.jpg'},

{'caption': 'Shop Front Red', 'url': 'www.joomlabamboo.com/images/stories/shop_front/Red Narrow Site Map.jpg'},

{'caption': 'Shop Front Blue 2', 'url': 'www.joomlabamboo.com/images/stories/shop_front/blue2narrowfull800.jpg'}];



</script>

<a href="#" onclick="return GB_showImageSet(image_set, 1)">Screen Shots</a>





To use this just change the caption and url details for the image. If you are adding more or reducing the number of images make sure you dont delete any of the end brackets or commas that are needed.



Actually a good way to get a round the hassle of using the nowysiwyg editor and editing the article only to ruin the work done when you next want to edit the document, but this time using the wysiwyg editor is to use the {mosloadposition user1} function.



* Create a user whose default editor is nowysiwyg.

* You can create a user defined module position or use a module position that isn't used in the template (user 9 etc) and make sure it is published but not assigned to a position. You do this by going to Site - Template manager - Module Positions

* Then go to modules in the administrator and click new. Make sure you are logged in as the user with nowysiwyg set to default.

* Scroll to the bottom of the page and insert the code from the post above ... editing as you go.

* Save the new module and make sure it is published, using the module position you have just defined

* Go to your content article and insert the code



Code:



{mosloadposition user9}



* Publish the article and you should have your link to the gallery and be able to edit your content with a wysiwyg without any interference.



Post edited by: Anthony Olsen, at: 2007/04/27 15:00<br><br>Post edited by: Anthony Olsen, at: 2007/04/27 15:01