Jekyll Tag Plugin Example

Jekyll custom liquid tag plugin example using Gravatar. Gravatar powers your public profile, visible wherever you post, comment, and interact online.

Create Jekyll Pugin

Create a folder _plugins in Jekyll root directory and place the below ruby code in jekyll-gravatar-tag.rb file.

..
├── 404.html
├── about.md
├── _config.yml
├── Gemfile
├── Gemfile.lock
├── index.md
├── _plugins
│   └── jekyll-gravatar-tag.rb
├── _posts
│   └── 2023-01-28-jekyll-tag-plugin-example.md
└── _site

Gravater Plugin Code

File name: jekyll-gravatar-tag.rb

require 'digest'

module Jekyll
  class Gravatar < Liquid::Tag

    def initialize(tag_name, content, tokens)
      super
      @content = content
    end

    def render(context)
      md5digest = Digest::MD5.hexdigest @content.downcase
      %Q{<img src="https://www.gravatar.com/avatar/#{ md5digest }" title="Gravatar" />}
    end
  end
end

Liquid::Template.register_tag('gravatar', Jekyll::Gravatar)

Putting plugin to use

Create a blog page and include the following snippet in the code.

{% gravatar mail@example.com %}

Plugin results

HTML output

<img src="https://www.gravatar.com/avatar/a27bc417a4d6c5ad1b7c3af185e99a0b" title="Gravatar" />

Using Plugin in Card View

John Smith

mail@example.com

Last updated 3 mins ago