Summary. In the past, there was an easy method for inserting an iPhoto iWeb Photo Gallery into a web page using HTML code. With iLife ’08 this was no longer easy to do. These instructions may change or be irrelevant with iLife ’09.
Instructions. Follow these instructions to discover the code, or use ours below as a template.
- Use iWeb to create a blank web page in a new blank site. To do this, from the File menu choose New Site, then from the File menu choose New Page. You might want to name the site “photos” and the new page “photos” for easy reference later.
- From the Web Widgets button, choose MobileMe Gallery Live Feed. This will insert the code to embed a live slideshow of the selected Gallery of photos that were uploaded using iPhoto.
- From the File menu, “choose Publish to a Folder…” and choose to publish the iWeb website to your desktop.
- Navigate into the created folder and find the folder that is named based on the page you created. For example, photos_files. There will also be a photos.html file (or whatever name you gave the created page in step #1 above).
- In the photos_files folder, choose right click (or control and left click) on the file named widget1_markup.html and choose to open it with Safari.
- In Safari, you should see your slideshow. From the View menu in Safari, choose to View Source. Toward the bottom of the displayed HTML code, you will see <body> and below that will be the HTML script that makes the slideshow appear. The code is shown below.
HTML Code. Below is the HTML code for the slideshow.
<script src="http://gallery.mac.com/g/flash/photowidget_iefix.js" type="text/javascript"></script> <script type="text/javascript"><!--
writeObj("http://gallery.me.com/yourmobilemesite/123456", 160, 140);
// --></script>
Insert the above script as HTML code on your web page just as you would insert YouTube code or any other embedded code. Be sure to replace “yourmobilemesite” with the actual name of your MobileMe Gallery address. The number 123456 should be replaced with the Gallery address. The numbers 160, 140 refer to the dimensions of the images. You can change these to 320, 280 for a larger preview.