Blockquotes

A way to section of quoted speech. They come in a couple of different flavours (default and pull-quote) and the content can include HTML if needed. You can also declare who the quote is from, using cite, and add an image to the quote too, floated right by default but to the left if you fancy it.

Default blockquotes

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

<blockquote class="c-blockquote">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
  </div>
</blockquote>

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

Madeline, PhD student.

<blockquote class="c-blockquote">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
  </div>
  <cite class="c-blockquote__cite">
    <p>Madeline, PhD student.</p>
  </cite>
</blockquote>

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

Madeline, PhD student.

<blockquote class="c-blockquote">
  <img class="c-blockquote__image c-blockquote__image--right" src="../media/madeline-250px.jpg" alt="">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
  </div>
  <cite class="c-blockquote__cite">
    <p>Madeline, PhD student.</p>
  </cite>
</blockquote>

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

Madeline, PhD student.

<blockquote class="c-blockquote">
  <img class="c-blockquote__image c-blockquote__image--left" src="../media/madeline-250px.jpg" alt="">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
  </div>
  <cite class="c-blockquote__cite">
    <p>Madeline, PhD student.</p>
  </cite>
</blockquote>

Pull quote-style blockquotes

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

<blockquote class="c-blockquote c-blockquote--pull-quote">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
  </div>
</blockquote>

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

Madeline, PhD student.

<blockquote class="c-blockquote c-blockquote--pull-quote">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York. </p>
  </div>
  <cite class="c-blockquote__cite">
    <p>Madeline, PhD student. </p>
  </cite>
</blockquote>

Image blockquotes

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

<blockquote class="c-blockquote c-blockquote--image-quote">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
  </div>
</blockquote>

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

Madeline, PhD student.

<blockquote class="c-blockquote c-blockquote--image-quote">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
  </div>
  <cite class="c-blockquote__cite">
    <p>Madeline, PhD student.</p>
  </cite>
</blockquote>

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

I’ve drunk tea by the riverside at Knaresborough, I’ve eaten chips on the Filey seafront, I’ve watched gliders take off Sutton Bank and I’ve seen the monks wondering the grounds of Ampleforth.

Madeline, PhD student. Read Madeline's guest blog post.

<blockquote class="c-blockquote c-blockquote--image-quote">
  <img class="c-blockquote__image c-blockquote__image--right" src="../media/madeline-250px.jpg" alt="">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
    <p>I’ve drunk tea by the riverside at Knaresborough, I’ve eaten chips on the Filey seafront, I’ve watched gliders take off Sutton Bank and I’ve seen the monks wondering the grounds of Ampleforth.</p>
  </div>
  <cite class="c-blockquote__cite">
    <p>Madeline, PhD student. <span class="u-link">Read Madeline's guest blog post</span>.</p>
  </cite>
</blockquote>

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

I’ve drunk tea by the riverside at Knaresborough, I’ve eaten chips on the Filey seafront, I’ve watched gliders take off Sutton Bank and I’ve seen the monks wondering the grounds of Ampleforth.

Madeline, PhD student. Read Madeline's guest blog post.

<blockquote class="c-blockquote c-blockquote--image-quote">
  <img class="c-blockquote__image c-blockquote__image--left" src="../media/madeline-250px.jpg" alt="">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
    <p>I’ve drunk tea by the riverside at Knaresborough, I’ve eaten chips on the Filey seafront, I’ve watched gliders take off Sutton Bank and I’ve seen the monks wondering the grounds of Ampleforth.</p>
  </div>
  <cite class="c-blockquote__cite">
    <p>Madeline, PhD student. <span class="u-link">Read Madeline's guest blog post</span>.</p>
  </cite>
</blockquote>

Large blockquotes

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

Madeline, PhD student.

<blockquote class="c-blockquote c-blockquote--pull-quote c-blockquote--large">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
  </div>
  <cite class="c-blockquote__cite">
    <p>Madeline, PhD student.</p>
  </cite>
</blockquote>

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

Madeline, PhD student. Read Madeline's guest blog post.

<blockquote class="c-blockquote c-blockquote--image-quote c-blockquote--large">
  <img class="c-blockquote__image c-blockquote__image--left" src="../media/madeline-250px.jpg" alt="">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
  </div>
  <cite class="c-blockquote__cite">
    <p>Madeline, PhD student. <span class="u-link">Read Madeline's guest blog post</span>.</p>
  </cite>
</blockquote>

Linked blockquotes

You can turn the whole blockquote into a link (for example, linking to blog posts).

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

I’ve drunk tea by the riverside at Knaresborough, I’ve eaten chips on the Filey seafront, I’ve watched gliders take off Sutton Bank and I’ve seen the monks wondering the grounds of Ampleforth.

Madeline, PhD student. Read Madeline's guest blog post.

<a href="#" class="c-blockquote c-blockquote--pull-quote">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
    <p>I’ve drunk tea by the riverside at Knaresborough, I’ve eaten chips on the Filey seafront, I’ve watched gliders take off Sutton Bank and I’ve seen the monks wondering the grounds of Ampleforth.</p>
  </div>
  <cite class="c-blockquote__cite">
    <p>Madeline, PhD student. <span class="u-link">Read Madeline's guest blog post</span>.</p>
  </cite>
</a>

Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.

I’ve drunk tea by the riverside at Knaresborough, I’ve eaten chips on the Filey seafront, I’ve watched gliders take off Sutton Bank and I’ve seen the monks wondering the grounds of Ampleforth.

Madeline, PhD student. Read Madeline's guest blog post.

<a href="#" class="c-blockquote c-blockquote--image-quote">
  <img class="c-blockquote__image c-blockquote__image--left" src="../media/madeline-250px.jpg" alt="">
  <div class="c-blockquote__content">
    <p>Through being involved with University of York cycling club I have discovered almost every village, every landmark, every hill, every Yorkshire oddity within a 30-mile radius of York.</p>
    <p>I’ve drunk tea by the riverside at Knaresborough, I’ve eaten chips on the Filey seafront, I’ve watched gliders take off Sutton Bank and I’ve seen the monks wondering the grounds of Ampleforth.</p>
  </div>
  <cite class="c-blockquote__cite">
    <p>Madeline, PhD student. <span class="u-link">Read Madeline's guest blog post</span>.</p>
  </cite>
</a>

Options

Atoms

  • blockquote
    • type: Choose from default, image-quote or pull-quote (or nothing)
    • content: The text to go in the quote. Can include HTML markup (required)
    • cite: Who said this?
    • image: URL for their picture
    • imagefloat: Which side do you want the image on? (Defaults to right)
    • size: Choose from large or default.