Forsythia
hydrangea
Rose Dahlia
Ornamental Cherry
Video Link
Back to Progrower.coffeecup.com
Shadowbox
<link rel="stylesheet" type="text/css" href="shadowbox/shadowbox.css">
<script type="text/javascript" src="shadowbox/shadowbox.js"></script>
<script type="text/javascript">
Shadowbox.init({
counterType: "skip",
slideshowDelay: 5
});
</script>
Place the code below to the head of your page.
Now insert a html box on your page and place the code below in the Body HTML. Repeat for every image and adjust the src for the image thimbnail and the href for the full size image that will pop up in Shadowbox. Adjust the word plants to group photos into common galleries.
<a href="shadowbox/images/forsythia.jpg" rel="shadowbox[plants]"><img src="shadowbox/images/forsythiatn.jpg" alt="Forsythia" title="Forsythia bush" /></a>
shadowbox.js
shadowbox.css
Here's the close button for the shadowbox.
Now lets add the needed files. Go to add files and add a new folder to your site and call it shadowbox. Now select this folder and click on add files at the botton and browse to the shadowbox.js, shadowbox.css and the close image. Now click on the shadowbox folder you added and select add folder. Now add a new folder inside the shadowbox folder and call it images. Now select this new images folder and click on add files at the bottom and browse to your images. Remember to have a full size version and a smaller thumbnail version that will actually show on the page.
You'll need these files.
This one is a video. Go here to see how video links are setup.
<a href="shadowbox/videos/shadowboxvideo1.mp4" rel="shadowbox[plants] ;height=466;width=640"><img src="shadowbox/videos/FirstFrame.png" alt="Video Link" title="Video Link" /></a>

Video Links
Adjust the width and height to your actual video size.