Flag On Roof
Old Barn
Colorbox slideshow in VSD
<a class='group4' href="Flagonroof.jpg" title="Flag On Roof">Flag On Roof</a>
Text link
Paste the code below to the head of the page that you want the colorbox to appear on. (Crtl + Alt + H) or by clicking on "edit" then "Edit Header".
Download the files and unzip the images file.
Add a folder to the
Root of your site and call it colorbox.
Click on the
colorbox folder and click on add files at the bottom of the window. Then browse to the colorbox.css and the jquery.colorbox.js file you just saved and add select both of them.
Click on the
colorbox folder again then click add folder and add new folder inside the colorbox folder and call it images. Click on this new folder then click on add files and browse to the images folder that you unzipped and add the files in it to the images folder you just created in VSD.
Now in the page that you want the colorbox to be on paste the code below into the body html of a HTML box in VSD. Adjust the "Flagonroof.jpg" for the actual name of your picture format and the href for the actual folder that your images are in. Now you can adjust the tile and the text to you liking.
<link rel="stylesheet" href="colorbox/colorbox.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="colorbox/jquery.colorbox.js"></script>
$(".group4").colorbox({rel:'group4', slideshow:true});

Picture link
<a class='group4' href="pictures/oldbarn.jpg" style="border: none;" title="This old barn was built in 1909"><img src="pictures/oldbarntn.jpg" width="120" height="80" alt="Old Barn" title="" border="0" /></a>
To use the picture link you will need to add the image to VSD with the add files tool. The code above will make the image appear and be linked to the picture.
Download the needed files by right click save as or save link as.
Back to Progrower.coffeecup.com
Step 2
You will have to adjust the href and src according to where you add the folders in VSD.
Step 1
Step 3
Step 4