Blockquote¶
Processor name: blockquote
You can include an blockquote using the following text tag:
{blockquote}
This text is the blockquote's contents.
This is the second line.
{blockquote end}
Optional Tag Parameters¶
footer
- Boolean flag to indicate whether the blockquote contains a footer.- If given as
true
, then the last line should start with a dash (-
) followed by a space to show it’s the footer.
- If given as
source
- Sets thecite
parameter of theblockquote
element.alignment
- Valid values are ‘left’, ‘center’, or ‘right’. Providing one of these values Will add CSS classes to the image for alignment.
The default HTML for a panel is:
<blockquote class="blockquote{% if alignment == 'left' %} text-left{% elif alignment =='center' %} text-center{% elif alignment =='right' %} text-right{% endif %}"
{%- if source %} cite="{{ source }}"{% endif %}>
{% autoescape false -%}
{{ content }}
{%- endautoescape -%}
{% if footer %}
<footer class="blockquote-footer">
{{ footer }}
</footer>
{% endif %}
</blockquote>
Using the following example tag:
{blockquote}
This text is the blockquote's contents.
This is the second line.
{blockquote end}
The resulting HTML would be:
<blockquote class="blockquote">
<p>This text is the blockquote's contents.</p>
<p>This is the second line.</p>
</blockquote>
Overriding HTML for Blockquote¶
When overriding the HTML for blockquotes, the following Jinja2 placeholders are available:
{{ content }}
- The text enclosed by the blockquote tags.{{ footer }}
- The provided footer text.{{ alignment }}
- The location to add extra CSS classes for alignment.{{ source }}
- The URL for the source.
Example
For example, providing the following HTML:
<blockquote class="blockquote grey-text{% if alignment == 'left' %} float-left{% elif alignment =='center' %} float-center{% elif alignment =='right' %} float-right{% endif %}"
{%- if source %} cite="{{ source }}"{% endif %}>
{% autoescape false -%}
{{ content }}
{%- endautoescape -%}
{% if footer %}
<footer class="blockquote-footer">
{{ footer }}
</footer>
{% endif %}
</blockquote>
with the following tag:
{blockquote alignment="right"}
Blockquote contents.
{blockquote end}
would result in:
<blockquote class="blockquote grey-text float-right">
<p>Blockquote contents.</p>
</blockquote>