Valid XHTML <object> Tags for Flickr Widget - Web Team Procedures and Notes

This page is intended for use only by the Web Team.

NOTE: Subject to change.

Go to Index of Valid XHTML <object> Tags.

Flickr Widget (rotating globe of photos)

NOTE: Tested and validates.

Looks best with 10 or more photos (otherwise kinda empty looking). Uses RSS feed URL (not web page URL).

By Set

<div class="embeddedmedia flickr centertag" style="width:300px;">
<span class="source"><a href="http://www.flickr.com/photos/ohlonecollege/sets/SETID/">SETNAME photoset on Ohlone College's Flickr site.</a></span>
<object type="application/x-shockwave-flash" data="http://media.roytanck.com/flickrwidget.swf" width="300" height="300">
  <param name="movie" value="http://media.roytanck.com/flickrwidget.swf" />
  <param name="bgcolor" value="#ffffff" />
  <param name="flashvars" value="feed=http%3A//api.flickr.com/services/feeds/photoset.gne%3Fset%3D[SETID]%26nsid%3D11324776@N00%26lang%3Den-us%26format%3Drss_200" />
  <param name="AllowScriptAccess" value="always"/>
  <p><a href="http://www.roytanck.com">Roy Tanck</a>'s Flickr Widget requires Flash Player 9 or better.</p>
  <p>Get Flickr Widget at <a href="http://www.roytanck.com">roytanck.com</a>. Requires Flash Player 9 or better.</p>
</object> 
</div>

By Tag

<div class="embeddedmedia flickr centertag" style="width:300px;">
<span class="source"><a href="http://www.flickr.com/photos/ohlonecollege/tags/[TAG]/">Photos tagged &quot;[TAG]&quot; on Ohlone College's Flickr site.</a></span>
<object type="application/x-shockwave-flash" data="http://media.roytanck.com/flickrwidget.swf" width="300" height="300">
  <param name="movie" value="http://media.roytanck.com/flickrwidget.swf" />
  <param name="bgcolor" value="#ffffff" />
  <param name="flashvars" value="feed=http%3A//api.flickr.com/services/feeds/photos_public.gne%3Fid%3D11324776@N00%26tags=[TAG]%26lang%3Den-us%26format%3Drss_200" />
  <param name="AllowScriptAccess" value="always"/>
  <p><a href="http://www.roytanck.com">Roy Tanck</a>'s Flickr Widget requires Flash Player 9 or better.</p>
  <p>Get Flickr Widget at <a href="http://www.roytanck.com">roytanck.com</a>. Requires Flash Player 9 or better.</p>
</object> 
</div>

Example Set ID = 72157616428551225

Introduction to Ohlone College photoset on Ohlone College's Flickr site.

Get Flickr Widget at roytanck.com. Requires Flash Player 9 or better.

Code for above:

<div class="embeddedmedia flickr centertag" style="width:300px;">
<span class="source"><a href="http://www.flickr.com/photos/ohlonecollege/sets/72157616428551225/">Introduction to Ohlone College photoset on Ohlone College's Flickr site.</a></span>
<object type="application/x-shockwave-flash" data="http://media.roytanck.com/flickrwidget.swf" width="300" height="300">
  <param name="movie" value="http://media.roytanck.com/flickrwidget.swf" />
  <param name="bgcolor" value="#ffffff" />
  <param name="flashvars" value="feed=http%3A//api.flickr.com/services/feeds/photoset.gne%3Fset%3D72157616428551225%26nsid%3D11324776@N00%26lang%3Den-us%26format%3Drss_200" />
  <param name="AllowScriptAccess" value="always"/>
  <p><a href="http://www.roytanck.com">Roy Tanck</a>'s Flickr Widget requires Flash Player 9 or better.</p>
  <p>Get Flickr Widget at <a href="http://www.roytanck.com">roytanck.com</a>. Requires Flash Player 9 or better.</p>
</object> 
</div>

Example Tag = Respiratory Therapist

Photos tagged "Respiratory Therapist" on Ohlone College's Flickr site.

Get Flickr Widget at roytanck.com. Requires Flash Player 9 or better.

Code for above:

<div class="embeddedmedia flickr centertag" style="width:300px;">
<span class="source"><a href="http://www.flickr.com/photos/ohlonecollege/tags/respiratory%20therapist/">Photos tagged &quot;Respiratory Therapist&quot; on Ohlone College's Flickr site.</a></span>
<object type="application/x-shockwave-flash" data="http://media.roytanck.com/flickrwidget.swf" width="300" height="300">
  <param name="movie" value="http://media.roytanck.com/flickrwidget.swf" />
  <param name="bgcolor" value="#ffffff" />
  <param name="flashvars" value="feed=http%3A//api.flickr.com/services/feeds/photos_public.gne%3Fid%3D11324776@N00%26tags=respiratory%20therapist%26lang%3Den-us%26format%3Drss_200" />
  <param name="AllowScriptAccess" value="always"/>
  <p><a href="http://www.roytanck.com">Roy Tanck</a>'s Flickr Widget requires Flash Player 9 or better.</p>
  <p>Get Flickr Widget at <a href="http://www.roytanck.com">roytanck.com</a>. Requires Flash Player 9 or better.</p>
</object> 
</div>
  • use the RSS feed URL for the Flickr set to be displayed
  • A square is best single the rotating globe of photos is round.
    • 300x300 is good for float right or left - use: <div class="flickr right">[content]</div> or <div class="flickr left">[content]</div>
    • 400x400 to 495x495 (max.) for centered on Ohlone web pages
  • Border added to above example to emphasize the output of the code
  • Above code is modified for use by the Ohlone College Web Team
  • Generate the original widget code: http://www.roytanck.com/get-my-flickr-widget/