A blockquote is used to convey information in a concise and visually engaging manner
Purpose
The blockquote can be used to highlight a key snippet of information that is included elsewhere within the page
When to use
Use sparingly to break up large sections of content or to provide a testimonial on a landing page.
How to use
Note: there two versions of the blockquote
- Widget - this version has an optional image, and a choice of red or pink citation text. It should be used on landing pages;
- WYSIWYG this version does not feature an image and should be used when including a blockquote in the body of an article or within a Content Block.
Blockquote - widget
- Edit
- Add
- Delete
- Click the Edit icon at the top right of the widget
- Edit the Quote field as required noting the limit of 300 characters.
- To add an image use the Select image button and either upload an image or use one from the existing library
- To change the image select the Change Image button to the right of the image. Note that it is not possible to remove an image: you will instead need to delete the existing widget and sytart again.
- You can optionally add text for the Citation
- if you wish to link to a source for the citation, add a URL in the Citation Url field. This will automatically format the citation as a link.
- Save and preview once you have updated all fields.
- The Blockquote widget can be found in the Murdoch section of the Content toolbox.
- Click and drag onto any editable area of the page and then follow the instructions for Editing
- Click More at the top right of the widget
- Select Delete
Blockquote - WYSIWYG editor
- Edit
- Add
- Delete
- Click the Edit icon to open the Content Block containing the Blockquote;
- You can edit the text directly in the Content Block edit screen, or;
- Click the blockquote icon [ ] on the WYSIWYG toolbar and edit as required.
- Add the quote text in the Quote field (only this field is required; all other fields are optional);
- Add text in the Citation field if you wish to identify the source of the quote.
- Add a URL in Citation URL if you wish to link to the source of the quote.
- Save and preview once you have updated all fields.
- While editing a Content Block, click the blockquote icon [ ] on the WYSIWYG toolbar.
- Add the quote text in the Quote field (only this field is required; all other fields are optional);
- Add text in the Citation field if you wish to identify the source of the quote.
- Add a URL in Citation URL if you wish to link to the source of the quote.
- Save and preview once you have updated all fields.
- To delete the blockquote properly select the "view HTML" option from the toolbar and delete the blockquote html manually (everything between <figure data-class ="blockquote"> and </figure> )
Examples
This is the quote section of a blockquote widget and is limited to a maximum of three hundred characters.
The image and citation are both optional (but recommended).
This is the WYSIWYG version of the blockquote, and doesn't include an image. It is designed to be included within Content Blocks as a way of breaking up long sections of text content. There is no red variant and no text limit.