leopard Frog
leopard Frog
Leopard frog
Click me
<style type="text/css">
body{font:12px/1.2 Verdana, Arial, san-serrif; padding:0 0px;}
a:link, a:visited{text-decoration:none; color:#416CE5;}
h2{font-size:13px; margin:15px 0 0 0;}
</style>
<link media="screen" rel="stylesheet" href="colorbox/colorbox.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="colorbox/jquery.colorbox.js"></script>
<script>
$(document).ready(function(){
$(".photobucket").colorbox({ photo:true});
});
</script>
Add this code to the Head your page
Back to Progrower.coffeecup.com
Add this code to the Body HTML of the HTML box.
Follow the instructions on this page to add the needed files.
Colorbox and Photobucket
Step 1
Step 2
Step 3
Add the needed files
<a class='photobucket' href="http://myphotobucketimagepath/myimage.jpg" rel="photobucket" style="border: none; style="border: none; " title="My cool image" ><img src="http://myphotobucketimagepath/th_myimage.jpg" alt="" title="" border="0" /></a>
Adjust the http://myphotobucketimagepath /myimage.jpg and the http://myphotobucketimagepath /th_myimage.jpg to your image links.
Colobox for pictures
Add this code to the Head HTML of the HTML box.
Individual Photos
Complete Albums
<style type="text/css">
body{font:12px/1.2 Verdana, Arial, san-serrif; padding:0 0px;}
a:link, a:visited{text-decoration:none; color:#416CE5;}
h2{font-size:13px; margin:15px 0 0 0;}
</style>
<link media="screen" rel="stylesheet" href="colorbox/colorbox.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="colorbox/js/jquery.colorbox.js"></script>
<script>
$(document).ready(function(){
$(".iframe").colorbox({iframe:true, innerWidth:485, innerHeight:370, scrolling: false});
});
</script>
<a class='iframe' href="photobucket/photobucket.html" rel="photoalbum1">Click me</a>
Add this code to the Body HTML of the HTML box.
This for a standard link
Use the code below to make a html page in any html editor. Then add a folder to VSD named photobucket and add the page to it. You'll need to add the html code provided by photobucket. To get code got to Photobucket and click on the "See more" under the "Share this album" menu on the lower right. The click on the "Get link code" tab. Now set all your options then copy the code below the "Embed album slideshow:". Name your page "photobucket".
I'm working on this feature
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
Photobucket code goes here
</body>
</html>
<a class='iframe' href="photobucket/photobucket.html" rel="photoalbum1"><img src="http://i833.photobucket.com/albums/xyz/username/th_mybigbaby.jpg" alt="" title="" border="0" /></a>
Add this code to the Body HTML of the HTML box.
This for a linked image from your photobucket. You'll need to adjust the src to you needs.
Step 1
Step 2
Step 3
Step 4
You'll need to play with this to make it match you photobucket.
If you have more then one album link on a page change this number for each one.