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

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

Go to Index of Valid XHTML <object> Tags for Videos and More.

Flickr Slideshow (embedded) -
[Use this instead of Flickr's Slideshow Embed Tool which is not valid]

Display Photos in One (1) Flickr Set

NOTE: Tested and validates. Off-site service: flickr.com.

Get a specific photo set (uses set_id):

<div class="embeddedmedia flickr centertag" style="width:495px;">
<span class="source"><a href="http://www.flickr.com/photos/ohlonecollege/sets/SETID/">SETNAME_OR_DESCRIPTION photoset on Ohlone College's Flickr site.</a></span>
<object type="application/x-shockwave-flash" data="http://www.flickr.com/apps/slideshow/show.swf?v=71649"
  width="495" height="372">
  <param name="movie" value="http://www.flickr.com/apps/slideshow/show.swf?v=71649" />
  <param name="allowFullScreen" value="true" />
  <param name="flashvars" value="offsite=true&amp;lang=en-us&amp;page_show_url=/photos/ohlonecollege/sets/SETID/show/&amp;page_show_back_url=/photos/ohlonecollege/sets/SETID/&amp;set_id=SETID" />
</object>
</div>

REPLACE "SETID" with ID of desired set of photos.

Size and Code Notes

  • 495x372 are maximum dimensions for current Ohlone templates; may also use these proportional sizes:
    • 450x338
    • 350x263
    • 250x188 - 250 x 260 makes the controls display above/below the photo
  • may also change "centertag" to "rightfloat" or "leftfloat" and use a width/height
  • Configuration Settings: Combining these in <param name="flashvars" value="" /> will narrow results:
    • set_id=
    • user_id=
      User ID for Ohlone College Flickr account: 11324776@N00. Utility to get a Flickr account's user ID (user_id): idGettr.
    • tags=
      Separate multiple tags with + (plus) sign encoded as %2B. See also tag_mode.
    • tag_mode=
      Either "any" (the default value) for any combination of tags, or "all" if you want all tags to match: tag_mode=any or tag_mode=all. Undocumented: tag_mode=bool for Boolean search [works with Full Text search (not with Tags search); example:
      (speech+2010+sigmachieta) OR graduation]
    • text=
      Spaces must be coded as: %20
    • media
      Filters results as either photos (media=photos) or video (media=videos).
    • license
      Allows you to specify the license on a photo (see the flickr.photos.licenses.getInfo method for values). Multiple licenses can be searched by separating them with commas.
    • group_id= (for Flickr Groups)
    • photoset_id=
    • contacts=
    • favorites=
    • frifam=
    • nsid=
    • single=
    • firstIndex=
    • firstId=
    • http://paulstamatiou.com/how-to-quickie-embedded-flickr-slideshows/

Display Photos with One (1) Specific Tag (includes user_id)

NOTE: Tested and validates. Off-site service: flickr.com.

Get all of Ohlone College's photos tagged with "respiratorytherapist" (uses user_id and tags):

<div class="embeddedmedia flickr centertag" style="width:495px;">
  <span class="source"><a href="http://www.flickr.com/photos/ohlonecollege/tags/respiratorytherapist/">Photos tagged &quot;respiratorytherapist&quot; on Ohlone College's Flickr site.</a></span>
<object type="application/x-shockwave-flash" data="http://www.flickr.com/apps/slideshow/show.swf?v=71649"
width="495" height="372">
<param name="movie" value="http://www.flickr.com/apps/slideshow/show.swf?v=71649" />
<param name="allowFullScreen" value="true" />
<param name="flashvars" value="offsite=true&amp;lang=en-us&amp;page_show_url=%2Fphotos%2Fohlonecollege%2Ftags%2Frespiratorytherapist%2Fshow%2F&amp;page_show_back_url=%2Fphotos%2Fohlonecollege%2Ftags%2Frespiratorytherapist%2F&amp;user_id=11324776@N00&amp;tags=respiratorytherapist" />
</object>
</div>

NOTE: Pathnames in the page_show_url and page_show_back_url variables are encoded and the encoding is encoded (whew).

Display Photos with Multiple Tags (Boolean OR) using Tags Only Search (includes user_id and m=tags)

NOTE: Tested and validates. Off-site service: flickr.com.

Get all of Ohlone College's photos tagged with:

  • "speech" or "respiratorytherapist" - use: speech+OR+respiratorytherapist
  • NOTE: Including m=tags searches Tags Only. Not including m=tags option on URL searches Full Text (text and tags).
  • Does Not Work: "(speech 2010 sigmachieta) OR respiratorytherapist"
<div class="embeddedmedia flickr centertag" style="width:495px;">
<span class="source"><a href="http://www.flickr.com/search/?q=speech+OR+respiratorytherapist&amp;w=11324776%40N00&amp;m=tags">Photos tagged &quot;speech OR respiratorytherapist&quot; on Ohlone College's Flickr site.</a></span>
  <object type="application/x-shockwave-flash" 
  data="http://www.flickr.com/apps/slideshow/show.swf?v=71649" 
  width="495" height="372">
    <param name="flashvars" value="offsite=true&amp;lang=en-us&amp;page_show_url=%2Fsearch%2Fshow%2F%3Fq%3D%26m%3Dtags%26w%3D11324776%2540N00%26ss%3D2&amp;page_show_back_url=%2Fsearch%2F%3Fq%3Dspeech%2BOR%2Brespiratorytherapist%26m%3Dtags%26w%3D11324776%2540N00%26ss%3D2&amp;method=flickr.photos.search&api_params_str=&amp;api_tags=speech%2COR%2Crespiratorytherapist&amp;api_tag_mode=bool&amp;api_user_id=11324776%40N00&amp;api_media=all&amp;api_sort=date-posted-desc&amp;jump_to=&amp;start_index=0" />
    <param name="movie" value="http://www.flickr.com/apps/slideshow/show.swf?v=71649" />
    <param name="allowFullScreen" value="true" />
</object>
</div>

NOTE: Pathnames in the page_show_url and page_show_back_url variables are encoded and the encoding is encoded (whew).

Display Photos with Multiple Tags (Boolean AND) using Tags Only Search (includes user_id and m=tags)

Get all of Ohlone College's photos tagged with:

  • "2012" and "graduation" - use: 2012 AND graduation [NOTE: Tthe word "AND" is default and seems to be optional.]
  • Group AND words using parentheses encoded as %28 for open/left parenthesis and %29 for closed/right parenthesis
  • NOTE: Including m=tags searches Tags Only. Not including m=tags option on URL searches Full Text (text and tags).
<div class="embeddedmedia flickr centertag" style="width:495px;">
<span class="source"><a href="http://www.flickr.com/search/?q=2012+graduation&amp;w=11324776%40N00&amp;m=tags">Photos tagged &quot;2012 AND graduation&quot; on Ohlone College's Flickr site.</a></span>
  <object type="application/x-shockwave-flash" 
  data="http://www.flickr.com/apps/slideshow/show.swf?v=71649" 
  width="495" height="372">
    <param name="flashvars" value="offsite=true&amp;lang=en-us&amp;page_show_url=%2Fsearch%2Fshow%2F%3Fq%3D2012%2Bgraduation%26m%3Dtags%26w%3D11324776%2540N00%26ss%3D2&amp;page_show_back_url=%2Fsearch%2F%3Fq%3D2012%2Bgraduation%26m%3Dtags%26w%3D11324776%2540N00%26ss%3D2&amp;method=flickr.photos.search&api_params_str=&amp;api_tags=2012%2Cgraduation&amp;api_tag_mode=bool&amp;api_user_id=11324776%40N00&amp;api_media=all&amp;api_sort=date-posted-desc&amp;jump_to=&amp;start_index=0" />
    <param name="movie" value="http://www.flickr.com/apps/slideshow/show.swf?v=71649" />
    <param name="allowFullScreen" value="true" />
</object>
</div>

NOTE: page_show_url and page_show_back_url (shown in blue with red variables) are encoded and the encoding is encoded (whew).

Display Photos using Full Text Search (includes user_id, but not m=tags)

A Full Text search searches tags, descriptions, and titles; do not include m=tags on a Full Text search.

NOTE: Tested and validates. Off-site service: flickr.com.

Get all of Ohlone College's photos with:

  • All of the words "awards", "ceremony" and "2011" in the tags, description, and/or title
  • Boolean AND and OR are not allowed in keywords (unless those are words being searched for)
<div class="embeddedmedia flickr centertag" style="width:495px;">
<span class="source"><a href="http://www.flickr.com/search/?q=awards+ceremony+2011&amp;w=11324776%40N00">Photos described as or tagged &quot;awards ceremony 2011&quot; on Ohlone College's Flickr site.</a></span>
  <object type="application/x-shockwave-flash" 
  data="http://www.flickr.com/apps/slideshow/show.swf?v=71649" 
  width="495" height="372">
    <param name="flashvars" value="offsite=true&amp;lang=en-us&amp;page_show_url=%2Fsearch%2Fshow%2F%3Fq%3Dawards%2Bceremony%2B2011%26w%3D11324776%2540N00%26ss%3D2&amp;page_show_back_url=%2Fsearch%2F%3Fq%3Dawards%2Bceremony%2B2011%26w%3D11324776%2540N00%26ss%3D2&amp;method=flickr.photos.search&amp;api_params_str=&amp;api_text=awards+ceremony+2011&amp;api_tag_mode=bool&amp;api_user_id=11324776%40N00&amp;api_media=all&amp;api_sort=relevance&amp;jump_to=&amp;start_index=0" />
    <param name="movie" value="http://www.flickr.com/apps/slideshow/show.swf?v=71649" />
    <param name="allowFullScreen" value="true" />
</object>
</div>

 

 

 

TESTING TESTING TESTING - MAY NOT BE WORKING RIGHT:

By Full Text Search (fancier boolean search example) using user_id (search descriptions, titles, and tags) (without m=tags)

NOTE: Tested and validates. Off-site service: flickr.com.

NOTE: I know that "sigma" and "chi" and "eta" are not tags but are in some photo descriptions or titles (at least for now on February 16, 2011), and I know that "respiratorytherapist" is not in the full text but is a tag.

Get all of Ohlone College's photos tagged with "sigma chi eta" (group these words inside parentheses) or "respiratorytherapist" (uses user_id). Group AND words using parentheses encoded as %28 for open/left parenthesis and %29 for closed/right parenthesis. Do not use m=tags which switches to search only tags.

<div class="embeddedmedia flickr centertag" style="width:495px;">
<span class="source"><a href="http://www.flickr.com/search/?q=%28sigma%2Bchi%2Beta%29+OR+respiratorytherapist&amp;w=11324776%40N00">Photos described as or tagged &quot;(sigma chi eta) OR respiratorytherapist&quot; on Ohlone College's Flickr site.</a></span>
  <object type="application/x-shockwave-flash" 
  data="http://www.flickr.com/apps/slideshow/show.swf?v=71649" 
  width="495" height="372">
    <param name="flashvars" value="offsite=true&amp;lang=en-us&amp;page_show_url=%2Fsearch%2Fshow%2F%3Fq%3D%2528sigma%2Bchi%2Beta%2529%2BOR%2Brespiratorytherapist%26w%3D11324776%2540N00%26ss%3D2&amp;page_show_back_url=%2Fsearch%2F%3Fq%3D%2528sigma%2Bchi%2Beta%2529%2BOR%2Brespiratorytherapist%26w%3D11324776%2540N00%26ss%3D2&amp;method=flickr.photos.search&amp;api_params_str=&amp;api_tags=(sigma%2Bchi%2Beta)+OR+respiratorytherapist&amp;api_tag_mode=bool&amp;api_user_id=11324776%40N00&amp;api_media=all&amp;api_sort=date-posted-desc&amp;jump_to=&amp;start_index=0" />
    <param name="movie" value="http://www.flickr.com/apps/slideshow/show.swf?v=71649" />
    <param name="allowFullScreen" value="true" />
</object>
</div>

NOTE: page_show_url and page_show_back_url (shown in blue with red variables) are encoded and the encoding is encoded (whew).