GUIDE: How to add Flash Galleries to iWeb sites.

[cosmokanga2]

I have had a lot of emails regarding my site and how I implemented flash galleries, and due to the site I used for instructions having been taken down, I thought that I would add the instruction here to MacRumors. Here goes:



My iWeb site in general:

The site is and designed created in iWeb with the flash galleries for photos being AutoViewer. I wanted a minimalist look without having to learn much coding or hire a designer and this is the result.


iWeb Theme:

The theme used is custom made as I was able to create exactly what I wanted without having to "fight" with one of the pre-made themes.


Flash Gallery/AutoViewer:

AutoViewer is a free flash gallery made by SimpleViewer and on their site you'll find different types of galleries that you can use. AutoViewer just worked for me.


How I create my AutoViewer Galleries:

I use Aperture 3 for my image editing however I use the Lightroom 3 Beta for my AutoViewer creating as it has more options and is much easily to use than the Aperture plugging available or the text based customization provided with AutoViewer.

Regardless of what way you create you're galleries, make sure that when you export your images for the gallery that they are sized exactly (600x400 pixels) how you want them to be on your website. This is to save every extra kilobyte of bandwidth when loading the webpage.

Once you have created the gallery and are happy with it, upload it to your server. I create a folder name "Flash" that I place all of my galleries in for the ease of finding and changing them. To make sure that you're gallery is uploaded, enter the path to the index.html file in the galleries folder. Example: http://stefanfeldmannphotography.com...rts/index.html Note the URL as you will need it later.


Adding the Gallery to your iWeb site:

The flash gallery is added using iframes. First, drag a HTML Widget from the iWeb inspector onto the page you want your gallery.

Then in the gray box that appears add this code:

<iframe src="http://YourSite.com/FlashGalleryFolder/index.html" width="900" height="650" scrolling="no" style="border:none;" frameborder="0"></iframe>

Change the YourSite path to the one that you noted earlier. You can also change the width, height, scrolling and style to your preference. It your gallery loads inside iWeb, the above code is correct.

It is crucial that your galleries files be on a server not on your local machine as otherwise they won't appear in iWeb when you are creating your site.


So there you have it, how to add a flash gallery to your iWeb site.


iWeb Extras:

While I'm at it ill talk about what programs I use to enhance my iWeb site.

I use iWebSEOTool by Rage to add search engine optimization as well as custom page titles and other features.

I use iTweak to add a php contact to my website as well as to add iPhone redirection. The iPhone redirection is added via the search/replace function using this code:

type="text/javascript">
<!--
if((navigator.userAgent.match(/iPhone/i))||(navigator.userAgent.match(/iPod/i))){
var question = confirm("Would you like to view our iPhone Site? The main site contains flash galleries.")
if (question){
window.location = "http://www.YouriPhoneSite.com";
}else{}}
//-->
</script>

Thats that. Please do NOT contact me through my website for help. Instead post a question below. Thanks.

[KICCA]

I like the minimalist look of the Feldmann's website! I am new to iweb and your advice is exactly what I needed. Now let's see if I can make it work Thanks again...

[KICCA]

hello cosmokanga2!

i am preparing my photos for autoviewer and i have a question for you: you mention 600x400 pixels as the size the pics should be to be exported in autoviewer. is that the recommended size? the maximum size for proper loading? can i go bigger? could you clarify this for me please? thank you!