Blockquote
The blockquote pattern is used to display a quote from a person or written excerpt.
Rules for blockquote
- Should be used for quotes within content that are typically larger than a sentence. Shorter quotes should use the
<q>
tag instead.
- Can be used for standalone quotes on full width page layouts.
- An author must be associated with a quote.
- An image of the author and additional information about them are optional.
- Author images must be 120 by 120 pixels.
- Author images must be a high quality portraiture headshot of the named person.
- Citations can be added alongside the author, with a link to a citation added as an attribute to the
<blockquote>
element.
Options available
Blockquote
An example of a blockquote with an attributed author along with their photograph and place of origin.
Example
Code
Blockquote with citation
An example of a blockquote where the author has cited their publication and provided a url for further details.
Example
Code
Blockquote - full width
An example of a blockquote on a full width page.
- The maximum number of characters for this type of quote should be no larger than 300.
Example
Code