Quotation Boxes

Website Design Skill Level:

 

Quotation boxes a responsive and themed way of presenting a quote alongisde an image of the speaker; making content more engaging and breaking up a page of text.

Example

Hannah Blackburn

This is an example of a themed quotation, designed to draw attention to a specific piece of information on the page, presented by an individual.


Hannah Blackburn
President and Chair of Board of Trustees
Staffordshire University Students' Union

Adding Quotations to your Page

To add a quote box to your page, please copy and paste the entire content below.Currently, the quotation box is not designed to accept any themed text (as it is overwritten by the theming set across the site. Therefore, simply replace the text as appropriate and double click on the image to replace it; set the dimensions to be 120px x 120px..

<div class="quote group">
<div class="quote-image"><img alt="Hannah Blackburn" src="/pageassets/siteguide/component/quotationbox/istockphoto-1164822188-612x612.jpg" style="width: 120px; height: 120px;" /></div>

<div class="quote-container">
<blockquote>
<p>Quotation content goes here, this should be the quote you wish to draw attention to.&nbsp;</p>
</blockquote>
<cite><span><br />
Speaker name</span><br />
Speaker Role<br />
Speaker Organisation/Description</cite></div>
</div>
We proudly represent the academic interests of all Students at Staffordshire University. Providing advice, student groups and fantastic experiences that make us all very Proud to be Staffs.