Published 2020-10-03. Last modified 2023-06-09.
Time to read: 2 minutes.

This page is part of the jekyll_plugins collection.

jekyll_quote

This Jekyll plugin formats citations and quotes in a Jekyll website.

Installation

Add the following highlighted line to your Jekyll project's Gemfile, within the jekyll_plugins group:

Gemfile

group :jekyll_plugins do 
  gem 'jekyll_quote'
end 

And then execute:

Shell

$ bundle

Syntax

HTML or markdown

{% quote OPTIONS %}
  Content of quote goes here.
{% endquote %}

The default preposition is 'From'.

OPTIONS are:

• break – Put the citation on a separate line. Ignored if cite was not specified.
• by – Preface the citation with the preposition 'By'. Ignored if cite was not specified.
• cite – Citation text
• class – Add specified CSS classes to outer div
• noprep – Do not preface the citation with a preposition. Ignored if cite was not specified.
• style – Add specified CSS styles to outer div
• url – URL for the citation. Ignored if cite was not specified.

Usage Examples

1. HTML or markdown

   {% quote cite="Blaise Pascal, in Lettres provinciales"
     url="https://en.wikipedia.org/wiki/Lettres_provinciales"
   %}
     I have only made this letter longer because
     I have not had the time to make it shorter.
   {% endquote %}

   
   Renders as:
   
   
   I have only made this letter longer because I have not had the time to make it shorter.  – From Blaise Pascal, in Lettres provinciales
2. HTML or markdown

   {% quote break
     cite="Blaise Pascal"
     url="https://en.wikipedia.org/wiki/Lettres_provinciales"
   %}
     <code>break</code>, <code>cite</code>
     and <code>url</code> were provided.
   {% endquote %}

   
   Renders as:
   
   
   break, cite and url were provided.

    – From Blaise Pascal
3. HTML or markdown

   {% quote break by
     cite="Blaise Pascal"
     url="https://en.wikipedia.org/wiki/Lettres_provinciales"
   %}
     <code>by</code>, <code>break</code>,
     <code>cite</code> and <code>url</code> were provided.
   {% endquote %}

   
   Renders as:
   
   
   by, break, cite and url were provided.

    – By Blaise Pascal
4. HTML or markdown

   {% quote break noprep
     cite="Blaise Pascal"
     url="https://en.wikipedia.org/wiki/Lettres_provinciales"
   %}
     <code>noprep</code>, <code>break</code>,
     <code>cite</code> and <code>url</code> were provided.
   {% endquote %}

   
   Renders as:
   
   
   noprep, break, cite and url were provided.

    – Blaise Pascal
5. HTML or markdown

   {% quote noprep
     cite="Blaise Pascal"
     url="https://en.wikipedia.org/wiki/Lettres_provinciales"
   %}
     <code>noprep</code>, <code>cite</code>
     and <code>url</code> were provided.
   {% endquote %}

   
   Renders as:
   
   
   noprep, cite and url were provided.  – Blaise Pascal

Without Url

1. HTML or markdown

   {% quote cite="Blaise Pascal" %}
     Only a <code>cite</code> was specified.
   {% endquote %}

   
   Renders as:
   
   
   Only a cite was specified.  – From Blaise Pascal
2. HTML or markdown

   {% quote by cite="Blaise Pascal" %}
     <code>By</code> and <code>cite</code> were specified.
   {% endquote %}

   
   Renders as:
   
   
   By and cite were specified.  – By Blaise Pascal
3. HTML or markdown

   {% quote break by cite="Blaise Pascal" %}
     <code>Break</code>, <code>By</code>
     and <code>cite</code> were specified.
   {% endquote %}

   
   Renders as:
   
   
   Break, By and cite were specified.

    – By Blaise Pascal
4. HTML or markdown

   {% quote break noprep cite="Blaise Pascal" %}
     <code>Break</code>, <code>noprep</code>
     and <code>cite</code> were specified.
   {% endquote %}

   
   Renders as:
   
   
   Break, noprep and cite were specified.

    – Blaise Pascal
5. HTML or markdown

   {% quote %}
     No <code>cite</code> or <code>url</code>
     was provided for this quote.
   {% endquote %}

   
   Renders as:
   
   
   No cite or url was provided for this quote.

Without Cite

HTML or markdown

{% quote url="https://en.wikipedia.org/wiki/Lettres_provinciales" %}
No cite was provided for this quote.
{% endquote %}

Renders as:

No cite was provided for this quote.

Demo

A demo / test website is provided in the demo directory. It can be used to debug the plugin or to run freely. Please examine the HTML files in the demo to see how the plugin works.

1. To run the demo freely from the command line, type:
   
   Shell

   $ demo/_bin/debug -r

2. View the generated website at localhost:4444.

Share to Twitter, Hacker News, LinkedIn.