Combining AutoViewer and Wordpress

I’ve added a small portfolio to the static pages, which ended up being a slight challenge since Wordpress does not get along with Flash apps as easily as it should. Of course, the image gallery app I wanted to use, AutoViewer by Felix Turner at AirtightInteractive.com, is a slick, Flash-based slideshow, so a workaround was in order.

portfolio

After unsuccessfully trying Kimili Flash Embed and other methods for inserting the viewer.swf into a page, I ended up using an iframe to display original index.html file for the slideshow.

Here’s the basic code I used:

<iframe src=”your_index_html_url” frameborder=”0″ height=”x” width=”100%”></iframe>

In order to embed the SWF this way, you’ll need to set up AutoViewer as you normally would, creating the necessary database, and then place it somewhere on your server.

After that, you can plug in the URL of the AutoViewer’s index.html into the above iframe code. The height parameter should be just large enough to display your tallest image, while the width will probably fine set to 100%.

The benefit of this solution is not having to recode any portion of AutoViewer or mess with the database, which seemed like the biggest issue with some of the other methods.

For my implementation of Autoviewer, I’ve also placed the portfolio on a page whose template has no sidebar, so I get the maximum width available to the SWF in the WordPress theme.

The portoflio is a set of images shot from early-2006 to the present. All featured images were shot with a Nikon D2X and various Nikon lenses, though a shot or two with a Sigma 30mm f/1.4 might have snuck in. Check it out here or in the persistant navigation above.

Avatar

About the author: Todd Owyoung is an internationally published music photographer specializing in concert photography and band portraits. He also grills a mean steak.

Contact Todd for image licensing and assignments wherever the rock show lives. You can also get in touch with Todd via Twitter.

This entry was posted on Wednesday, July 25th, 2007 at 3:35 pm and is filed under Music Photography and tagged with , , , , , , , , . You can follow any responses to this entry through the RSS 2.0 feed.

21 Responses to “Combining AutoViewer and Wordpress”

  1. Stephen says:

    “Workaround” seems to be part of my daily vocabulary as a web developer… Another favourite is “hack” :-p Nicely done on this – it fits in very seamlessly. Autoviewer is brilliant, and a fitting choice for your portfolio.

  2. Todd says:

    Ah yes, the joys of web development. After trying several ways to integratete the viewer by other means, the iframe proved to be the most simple solution. Thanks, Stephen.

  3. riny says:

    hey todd, i got inspired by your wordpress/photography blog and set up something similar. i might use that autoviewer for the portfolio too, looks really nice.
    cheers,
    riny (CC Baxter on flickr)

  4. Todd says:

    Hey Riny,

    Great! I’ll definitely check out your site. Autoviewer and Wordpress work great together — it just took a little while to figure out how to do it, since combining Flash and Wordpress isn’t as easy as working with straight HTML.

    The most simple and elegant solution I found was to use an iframe. I just updated this post to include a sample of the code I used.

    Let me know if you need any help setting it up.

    Best,
    Todd

  5. Shaun says:

    thanks tod you saved my life!

  6. Todd says:

    Hey Shaun, did this work for you? I tried a few different solutions, but in the end the iframe seemed like the easiest and most fool-proof workaround.

  7. Shaun says:

    yes it did! i had some difficulty implementing some of the flash plugins. Your solution was by far the simplest. I will be using the autoviewer for galleries rather than a one off portfolio (i think)
    thank you! I’m also quite interested in concert photography. Perhaps when you’re free you could take a look at my shots and tell me what i should improve on. :)

  8. Todd says:

    Shaun,

    I had the same problems trying to incorporate those Flash/WordPress plugins. Trying to coordinate the SWF and the database seemed like a headache, too.

    I’ll definitely check out your blog to see how AutoViewer is working. I looked at your main site and your photography rocks, I’ll be back for sure.

    As for concert photography, I’ll check out your work. I saw you had a blog post with a gig shot, but I think your server might have gone down for a moment, the site is unaccessible now.

    Cheers.

  9. Elle Grayes says:

    This was a great, big help! Thanks so much!

  10. Todd says:

    Hey Elle — did this work for you? Cheers.

  11. Heather Brooks says:

    Love this idea, but I can’t seem to get Wordpress to recognize iframes for me. Is there some plugin I’m missing? I can’t seem to figure this out. Any help is greatly appreciated. Your portfolio is gorgeous, by the way – very impressive photography – love your perspectives!

  12. Todd says:

    Hey Heather, I just checked my code for the portfolio and it looks like the new WordPress 2.5 might have some conflict with iframes.

    When I go to the HTML view on my Portfolio page, I don’t see any code, which is strange. Of course, the page continues to function, but it seems like WP 2.5 treats the iframe code differently than WP 2.3.

    I’ll try to look into this, but in the meantime, please let me know if you find a workaround!

  13. [...] post in wordpress. Wordpress Web Hosting and Yahoo shouldn’t be missed. I found the report Portfolio Added: AutoViewer and Wordpress [...]

  14. Thanks for the great info, and really nice concert porfolio. I’ve been trying to find and alternative to jalbum for embedding a flash gallery into my html site for awhile. Incidentally I was using iframes for that as well. Are you using the Pro Version of Autoviewer? How’d you get it so that the gallery doesn’t display the numbers at the top right corner and enable clicking anyway on the image for navigation. It looks and works great!

  15. Nice tip Todd. I used a different method which I discussed in my blog. Thank you.

  16. Fideocam says:

    I wrote a dynamic backend script (PHP5, MYSQL) for autoviewer recently. Feel free to click the link above and have a look if you need a handy tool for gallery management.

  17. G-Unit UK says:

    Thanks a lot for this tutorial… I adapted a version of the information to get Autoviewer working with Textpattern 4.0.8, by combining instructions from: http://sonspring.com/journal/textpattern-simpleviewer. I knew there must be a way to get pass the XML data alongside the Flash Object and the iframe trick worked great!

  18. Will says:

    Be sure to check out the NextGen plugin for wordpress – it is great for managing galleries and has AirTight viewer functionality / capabilities.

    http://alexrabe.de/category/nextgengallery/

  19. [...] good set of presets. Took a little fiddling to get it into the blog but I found the solution here: http://ishootshows.com/2007/07/25/autoviewer-and-wordpress/ Share this post! Twitter Digg Facebook Delicious StumbleUpon Google Bookmarks LinkedIn [...]

  20. [...] – A really cool, FREE flash gallery/slideshow that is perfect for photography sites. Here’s some info on how to embed into a WordPress [...]

Leave a Reply