Inserting a customizable slide show on your WordPress site can be done without a plugin using the following tools:
- Scripts from Google AJAX Feed API
- An online web album such as Picasa
- A sidebar text widget
Step One:
- Review the AJAX Slide show documentation.
Step Two:
- Create a Picasa web album with some sample photos. (Note – feeds from Flickr or Photobucket may be used, but I have not personally tested them. Consult the documentation for guidance on Flickr or Photobucket. )
- When your album is posted, click on the “RSS” icon to get the feed url for your slideshow (see screenshot)
Step Three:
- Cut and paste the code below into a text editor such as TextEdit or Notepad
- Insert your feed url between the quotes in line that begins: var samples =
- Save your text file
Step Four:
- Add a text widget to your blog sidebar
- Insert your Slideshow code
- Leave the “Automatically add paragraphs” box unchecked
- Save and review your slide show
- Customize the inline CSS for display size and background color.
Web albums and the resulting slides shows can be updated directly by clients, which saves time for both the client and designer/developer.
Here is the code for the Google AJAX Feed API displaying my web album in a sidebar text widget:
<script src="http://www.google.com/jsapi" type="text/javascript"><!--mce:0--></script>
<script src="http://www.google.com/uds/solutions/slideshow/gfslideshow.js" type="text/javascript"><!--mce:1--></script>
<!-- Inline CSS style for slide show window -->
<code> .gss a img {border : none;}
.gss {
width: 300px;
height: 225px;
color: #dddddd;
background-color: #8aa0cb;
padding: 5px;
}</code>
<!--Script for displaying the slide show and scaling web album images -->
<script type="text/javascript"><!--mce:2--></script>
<!--container for slide show -->
<div id="slideshow" class="gss">Loading...</div> |

