README.md

FlickrImg Liquid Tag for Jekyll

This is a single-purpose fork of vanto's simple liquid tag that helps to easily embed images, videos or slides from OEmbed enabled providers, which in turn uses Magnus Holm's great oembed gem which connects to the OEmbed endpoint of the link's provider and retrieves the HTML code to embed the content properly (i.e. an Image tag for Flickr) This fork allows only Flickr embeds, from one particular album (since that's the way I work my blog) but allows a much simpler tag, not requiring you to type out the whole URL every time.

How to install

1. Make sure you have the ruby-oembed gem (Rubygems, Github) installed.
2. Copy flickrimg.rb to <your-jekyll-project>/_plugins
3. Add a "flickrimg" config entry to your _config.yml, with an 'album' subentry which contains the bit of the flickr URL that identifies your album. In other words, if you have a Flickr URL such as https://www.flickr.com/photos/99999999@Z99/8888888888, put the bit with the nines ("99999999@Z99") in the "album" subentry.
4. You're done.

How to use

Place a flickrimg tag in your content file. E.g.

<h1>Here's a cool photo!</h1>
{{ flickrimg 8888888888 }}

<h1>Here's the same photo with image size specified</h1>
{{ flickrimg 8888888888 640 480 }}

Additional hint for Bootstrap 3

If you're using Twitter Bootstrap 3 and you'd like all your images to be responsive (i.e., automatically fit themselves nicely on a small screen such as an iPhone), you can use the following jQuery snippet to do this:

$().ready(function() {
	$("div.embed img").addClass("img-responsive");
});

Author

Peter Hull -- https://github.com/phoikoi

Based on the work of:

Tammo van Lessen -- http://www.taval.de

License

This code snippet is licensed under Apache License 2.0

flickrimg.rb

##
# Flickr Image OEmbed Liquid Tag
# Based on OEmbed Liquid Tag for Jekyll
#   - requires https://github.com/judofyr/ruby-oembed/
#
# Original code Copyright 2011 Tammo van Lessen
# This variation Copyright 2014 Peter Hull
# 
#    Licensed under the Apache License, Version 2.0 (the "License");
#    you may not use this file except in compliance with the License.
#    You may obtain a copy of the License at
# 
#        http://www.apache.org/licenses/LICENSE-2.0
# 
#    Unless required by applicable law or agreed to in writing, software
#    distributed under the License is distributed on an "AS IS" BASIS,
#    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
#    See the License for the specific language governing permissions and
#    limitations under the License.
##
require 'oembed'
require 'uri'
require 'openssl'

# register Flickr
::OEmbed::Providers.register(::OEmbed::Providers::Flickr)

module Jekyll
  class FlickrImg < Liquid::Tag

    def initialize(tag_name, markup, tokens)
       super
       # parse optional max. width/height parameters
       @text, @embed_w, @embed_h = markup.split
       @text.strip!
    end
    
    def render(context)
      # pipe param through liquid to make additional replacements possible
      photo = Liquid::Template.parse(@text).render context

      album = Jekyll.configuration({})['flickrimg']['album']
      
      # oembed look up
      # additionally add max. width/height parameters
      result = ::OEmbed::Providers.get("http://www.flickr.com/photos/#{album}/#{photo}", { :format => :xml, :maxwidth => @embed_w, :maxheight => @embed_h })
      
      # Odd: slideshare uses provider-name instead of provider_name
      provider = result.fields['provider_name'] || result.fields['provider-name'] || 'unknown'

      "<div class=\"embed #{result.type} #{provider}\">#{result.html}</div>"
    end
  end

end

Liquid::Template.register_tag('flickrimg', Jekyll::FlickrImg)