Blockquotes in Hugo

Posted by ads on Friday, 2024-03-01
Posted in [Hugo][Online][Software]

Hugo uses Markdown to create the content, which is then parsed into static HTML. One of the features of Markdown are quotes, like the following:

Never regret anything that made you smile. — Mark Twain

The above quote is a single line quote. Multiline quotes (block quotes) are possible, but they are not very intuitive.

What is a quote

A quote is often used when verbatim quoting a source, like from a book, another text, or what a person said.

Life is really simple, but we insist on making it complicated. — Confucius

In Markdown, this is written by starting the line with the quote with a greater-than sign (>). Easy enough.

The source for above quote in Markdown:

> Life is really simple, but we insist on making it complicated. -- Confucius

Multiline Quotes - Blockquotes

In Hugo, blockquotes are just a notch more complicated. Let’s take this quote by Douglas Adams. It’s maybe too long to write it in one line, therefore let’s break it into multiple lines. Makes for better readability.

Space is big.
You just won’t believe how vastly, hugely, mind-bogglingly big it is.
I mean, you may think it’s a long way down the road to the drug store, but that’s just peanuts to space.
Douglas Adams

If you add the > sign in front of every line:

> Space is big.
> You just won't believe how vastly, hugely, mind-bogglingly big it is.
> I mean, you may think it's a long way down the road to the drug store, but that's just peanuts to space.
> Douglas Adams

You get the following result:

Space is big. You just won’t believe how vastly, hugely, mind-bogglingly big it is. I mean, you may think it’s a long way down the road to the drug store, but that’s just peanuts to space. Douglas Adams

This does not look very nice, and definitely not the multi-line output I am looking for.

The secret potion in Hugo is to add two spaces (<space><space>) after every line:

> Space is big.<space><space>
> You just won't believe how vastly, hugely, mind-bogglingly big it is.<space><space>
> I mean, you may think it's a long way down the road to the drug store, but that's just peanuts to space.<space><space>
> Douglas Adams<space><space>

This formats the output nicely into multiple lines:

Space is big.
You just won’t believe how vastly, hugely, mind-bogglingly big it is.
I mean, you may think it’s a long way down the road to the drug store, but that’s just peanuts to space.
Douglas Adams

Exactly what I want!


Categories: [Hugo] [Online] [Software]

Share: