Get Flickr Galleries from URLs with jQuery

I find that I sometimes want to embed a set of images that someone hasn’t created a gallery for. You can actually see a slide show of them (example: jQuery Bowling Awesomeness!) but there isn’t a way to embed/share that view.. until now. I’ve created a quick little plugin that grabs the set id and username from a url and then creates the slideshow that gets embedded.

Optional Settings

  • url (string Default: *Awesome jQuery Bowling Pics*)
    Is the flickr url of the set you’d like to display
  • height (number in px Default: 350)
    Is height of the gallery
  • width (number in px Default: 350)
    Is width of the gallery


Fork this Fiddle


 * Flickr Gallery Plugin
 * @author Darcy Clarke
 * Copyright (c) 2012 Darcy Clarke
 * Dual licensed under the MIT and GPL licenses.

        $.fn.flickrGallery = function(options){
        return this.each(function(){
            var settings = $.extend({
                    url : '',
                    height : 350,
                    width : 350
                }, options),
            id = settings.url.match(/\/sets\/(.*)/)[1].split('/')[0],
            encoded = encodeURIComponent(settings.url.match(/\/photos\/(.*)/)[0]);
            $(this).append('<embed src="" type="application/x-shockwave-flash" allowscriptaccess="sameDomain" pluginspage="" wmode="transparent" flashvars="&offsite=true&intl_lang=en-us&page_show_url='+encoded+'&set_id='+id+'&jump_to=" width="'+settings.width+'" height="'+settings.height+'">');

Github: jQuery Flickr Gallery Plugin
Suggestions, problems, feedback?
Check Out the Repo


Melinda Hileman Posted: Sep 10, 2012 @ 8:56pm

I just tried this, and nothing happens…

Leave a Reply: