http://jeffnitschke.com/WowSlider.html
*update 3*
For one reason or another the WowSlider doesn’t work on Dropbox another free option would be 000webhost.com
* update 2*
Also, in Mountain Lion safari has moved things around. To view the source code you may need to enable the develop menu then select show page source. You can also right click or control click for a drop down menu & show page source:
* update *
Mountain Lion users having issues installing the Wowslider app. Getting the message: “WowSlider can’t be opened because it is from an unidentified developer”
the fix can be found here: Fix the “App can’t be opened because it is from an unidentified developer” Error in OS X Mountain Lion
How to add a WowSlider slideshow into iWeb
And the finished product:
http://jeffnitschke.com/WowSlider.html
1080p version:
http://www.youtube.com/watch?v=sSYA85lqVHk
Here is the actual snippet I used the Bold “http://jeffnitschke.com/demoslider/” text is what I pasted in.
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title>demoslider generated by WOWSlider.com</title>
<meta http-equiv=”content-type” content=”text/html; charset=utf-8″ />
<meta name=”keywords” content=”demoslider, WOW Slider, Simple Slider jQuery, Auto Slider jQuery” />
<meta name=”description” content=”demoslider created with WOW Slider, a free wizard program that helps you easily generate beautiful web slideshow” />
<!– Start WOWSlider.com HEAD section –>
<link rel=”stylesheet” type=”text/css” href=”http://jeffnitschke.com/demoslider/engine1/style.css” media=”screen” />
<style type=”text/css”>a#vlb{display:none}</style>
<script type=”text/javascript” src=”http://jeffnitschke.com/demoslider/engine1/jquery.js”></script>
<!– End WOWSlider.com HEAD section –>
</head>
<body style=”background-color:#ffffff”>
<!– Start WOWSlider.com BODY section –>
<div id=”wowslider-container1″>
<div>
<a href=”#”><img src=”http://jeffnitschke.com/demoslider/data1/images/111677749_cd2525273b_o1960x300.jpg” alt=”111677749_cd2525273b_o1-960×300″ title=”111677749_cd2525273b_o1-960×300″ id=”wows0″/></a>
<a href=”#”><img src=”http://jeffnitschke.com/demoslider/data1/images/feat_960x300.jpg” alt=”feat_960x300″ title=”feat_960x300″ id=”wows1″/></a>
<a href=”#”><img src=”http://jeffnitschke.com/demoslider/data1/images/handsholdingtree960x300958x300.jpg” alt=”hands-holding-tree-960×300-958×300″ title=”hands-holding-tree-960×300-958×300″ id=”wows2″/></a>
<a href=”#”><img src=”http://jeffnitschke.com/demoslider/data1/images/index960x300.jpg” alt=”index960x300″ title=”index960x300″ id=”wows3″/></a>
<a href=”#”><img src=”http://jeffnitschke.com/demoslider/data1/images/sanfrancisco960x300.jpg” alt=”sanfrancisco-960×300″ title=”sanfrancisco-960×300″ id=”wows4″/></a>
<a href=”#”><img src=”http://jeffnitschke.com/demoslider/data1/images/sponsors_960x300.jpg” alt=”sponsors_960x300″ title=”sponsors_960x300″ id=”wows5″/></a>
<a href=”#”><img src=”http://jeffnitschke.com/demoslider/data1/images/train_960x300.jpg” alt=”train_960x300″ title=”train_960x300″ id=”wows6″/></a>
<a href=”#”><img src=”http://jeffnitschke.com/demoslider/data1/images/wedding_960x300.jpg” alt=”wedding_960x300″ title=”wedding_960x300″ id=”wows7″/></a>
</div>
<div><div>
<a href=”#wows0″ title=”111677749_cd2525273b_o1-960×300″><img src=”http://jeffnitschke.com/demoslider/data1/tooltips/111677749_cd2525273b_o1960x300.jpg” alt=”111677749_cd2525273b_o1-960×300″/>1</a>
<a href=”#wows1″ title=”feat_960x300″><img src=”http://jeffnitschke.com/demoslider/data1/tooltips/feat_960x300.jpg” alt=”feat_960x300″/>2</a>
<a href=”#wows2″ title=”hands-holding-tree-960×300-958×300″><img src=”http://jeffnitschke.com/demoslider/data1/tooltips/handsholdingtree960x300958x300.jpg” alt=”hands-holding-tree-960×300-958×300″/>3</a>
<a href=”#wows3″ title=”index960x300″><img src=”http://jeffnitschke.com/demoslider/data1/tooltips/index960x300.jpg” alt=”index960x300″/>4</a>
<a href=”#wows4″ title=”sanfrancisco-960×300″><img src=”http://jeffnitschke.com/demoslider/data1/tooltips/sanfrancisco960x300.jpg” alt=”sanfrancisco-960×300″/>5</a>
<a href=”#wows5″ title=”sponsors_960x300″><img src=”http://jeffnitschke.com/demoslider/data1/tooltips/sponsors_960x300.jpg” alt=”sponsors_960x300″/>6</a>
<a href=”#wows6″ title=”train_960x300″><img src=”http://jeffnitschke.com/demoslider/data1/tooltips/train_960x300.jpg” alt=”train_960x300″/>7</a>
<a href=”#wows7″ title=”wedding_960x300″><img src=”http://jeffnitschke.com/demoslider/data1/tooltips/wedding_960x300.jpg” alt=”wedding_960x300″/>8</a>
</div></div>
<a style=”display:none” href=”http://wowslider.com”>Text Slider jQuery by WOWSlider.com v1.7m</a>
<div></div>
</div>
<script type=”text/javascript” src=”http://jeffnitschke.com/demoslider/engine1/script.js”></script>
<!– End WOWSlider.com BODY section –>
</body>
</html>
Danaiscool
That’s awesome! The images that i want to use – can I just put those on another page of the website that I don’t post? I’ll tinker around. Either way though, well done!
lilnitsch
I am not sure I understand your question. You can put the WowSlider on any page.
Olle
I cannot see the difference between you 2 youtube videos showing how to integrate wowslider into iweb.
I miss how to get the 1080 resolution?
lilnitsch
The 1080p was just a higher resolution video.