All Projects β†’ paulrobertlloyd β†’ jekyll-figure

paulrobertlloyd / jekyll-figure

Licence: MIT license
A liquid tag for Jekyll that generates <figure> elements

Programming Languages

ruby
36898 projects - #4 most used programming language

Projects that are alternatives of or similar to jekyll-figure

Jekyll Spaceship
πŸš€ A Jekyll plugin to provide powerful supports for table, mathjax, plantuml, mermaid, emoji, video, audio, youtube, vimeo, dailymotion, soundcloud, spotify, etc.
Stars: ✭ 196 (+317.02%)
Mutual labels:  jekyll-plugin
Jekyll-Spotify
Easily output Spotify Embed Player for jekyll
Stars: ✭ 15 (-68.09%)
Mutual labels:  jekyll-plugin
premonition
Premonition 4 is a Jekyll extension that makes it possible to add block-styled side content to your site. For example summaries, notes, hints or warnings.
Stars: ✭ 41 (-12.77%)
Mutual labels:  jekyll-plugin
Jekyll Admin
A Jekyll plugin that provides users with a traditional CMS-style graphical interface to author content and administer Jekyll sites.
Stars: ✭ 2,531 (+5285.11%)
Mutual labels:  jekyll-plugin
jekyll-data
A plugin to read '_config.yml' and data files within Jekyll theme gems
Stars: ✭ 40 (-14.89%)
Mutual labels:  jekyll-plugin
jekyll-portfolio-generator
Generates a portfolio/project pages (including related projects) out of data files
Stars: ✭ 55 (+17.02%)
Mutual labels:  jekyll-plugin
Github Metadata
Jekyll plugin to propagate the `site.github` namespace and set default values for use with GitHub Pages.
Stars: ✭ 184 (+291.49%)
Mutual labels:  jekyll-plugin
jekyll-target-blank
Automatically opens external links in a new browser for Jekyll Pages, Posts and Docs.
Stars: ✭ 86 (+82.98%)
Mutual labels:  jekyll-plugin
apihandyman.io
The apihandyman.io website
Stars: ✭ 14 (-70.21%)
Mutual labels:  jekyll-plugin
jekyll-flickr-photoset
A Jekyll plugin for embedding Flickr photosets
Stars: ✭ 40 (-14.89%)
Mutual labels:  jekyll-plugin
Jekyll Gist
πŸ“ƒ Liquid tag for displaying GitHub Gists in Jekyll sites.
Stars: ✭ 218 (+363.83%)
Mutual labels:  jekyll-plugin
jekyll-extlinks
This Jekyll plugin adds custom attributes (rel="nofollow", target="_blank", etc.) to external links in your content.
Stars: ✭ 18 (-61.7%)
Mutual labels:  jekyll-plugin
jekyll-swagger-ui
A Jekyll plugin to integrate Swagger UI into Jekyll site
Stars: ✭ 16 (-65.96%)
Mutual labels:  jekyll-plugin
Jekyll Minifier
Jekyll HTML/XML/CSS/JS Minifier utilising yui-compressor, and htmlcompressor
Stars: ✭ 215 (+357.45%)
Mutual labels:  jekyll-plugin
jekyll-font-awesome-sass
A plugin to add Font Awesome to your Jekyll site
Stars: ✭ 24 (-48.94%)
Mutual labels:  jekyll-plugin
Jekyll Remote Theme
Jekyll plugin for building Jekyll sites with any GitHub-hosted theme
Stars: ✭ 188 (+300%)
Mutual labels:  jekyll-plugin
jekyll-avatar
A Jekyll plugin for rendering GitHub avatars
Stars: ✭ 79 (+68.09%)
Mutual labels:  jekyll-plugin
jekyll-loading-lazy
πŸ§™πŸ½β€β™€οΈ Automatically adds loading="lazy" to <img> and <iframe> tags. Load images on your sites lazily without JavaScript.
Stars: ✭ 41 (-12.77%)
Mutual labels:  jekyll-plugin
jekyll-instagram
A Jekyll plugin for displaying your recent Instagram photos
Stars: ✭ 24 (-48.94%)
Mutual labels:  jekyll-plugin
jekyll-gzip
Generate gzipped assets and files for your Jekyll site at build time
Stars: ✭ 34 (-27.66%)
Mutual labels:  jekyll-plugin

jekyll-figure

A liquid tag for Jekyll that generates <figure> elements.

Gem version Build status

Installation

  1. Add gem 'jekyll-figure' to your site’s Gemfile and run bundle
  2. Add the following to your site’s _config.yml:
plugins:
  - jekyll-figure

Note: If you are using a Jekyll version less than 3.5.0, use the gems key instead of plugins.

Usage

This plugin provides a liquid tag that enables you to generate a <figure> element. It takes optional caption and class parameters.

{% figure [caption:"Caption (markdown)"] [class:"class1 class2"] %}
Figure content (markdown)
{% endfigure %}

Examples

In simplest usage:

{% figure %}
Content
{% endfigure %}
<figure>
  <p>Content</p>
</figure>

You can provide a caption, for which any markdown will be rendered:

{% figure caption:"*Markdown* caption" %}
Content
{% endfigure %}
<figure>
  <p>Content</p>
  <figcaption><em>Markdown</em> caption</figcaption>
</figure>

You can also provide a class name(s) for CSS styling:

{% figure caption:"A caption" class:"classname" %}
Content
{% endfigure %}
<figure class="classname">
  <p>Content</p>
  <figcaption>A caption</figcaption>
</figure>

The caption parameter also accepts liquid markup:

{% figure caption:"{{ page.title }}" %}
Content
{% endfigure %}
<figure>
  <p>Content</p>
  <figcaption>The title of my page</figcaption>
</figure>

Configuration

Any markdown provided within the {% figure %} block is rendered using Jekyll's Markdown parser, Kramdown. However, this means images and other content will be wrapped within <p> tags, like so:

<figure>
  <p><img src="/path/to/image.jpg" alt="Image"></p>
</figure>

To disable this behaviour, in your Jekyll configuration set the paragraphs value for this plugin to false:

plugins:
  - jekyll-figure

jekyll-figure:
  paragraphs: false

Note however that this will remove all paragraph tags, even those nested within other elements.

Testing

  1. bundle install
  2. bundle exec rake spec

Contributing

  1. Fork the project
  2. Create a descriptively named feature branch
  3. Add your feature
  4. Submit a pull request
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].