Call out panel formatting options for articles
Karen and Mali have identified a range of options for pull-quote panels that work on both the Hub and Dotcom.
For standard pull-quotes from the text, use plain text (ie not italic).
For a quote from, eg, an interviewee or speaker at a Club meeting please use italic text.
Quotes use the Two Col Image/RTE Section block.
If more than one quote is required in an article, the Editor can choose to alternate between putting the quote in the left and right hand column to break up the page if helpful.
Pull quote options
A paragraph of article copy goes here.
Heading 3. Centred, plain text. Default background. Text colour Medium blue
Heading 3. Centred, plain text. Default background. Text colour Green
Review formatting to see how the quote and paragraph are sitting alongside each other and tweak as required.
In these examples, the plain text copy is a little shorter than ideal.
Heading 3. Centred, plain text. Default background. Text colour Red
Heading 3. Centred, plain text. Default background. Text colour default
Ideally the paragraph of text will be roughly the same length as the quote panel so the block looks balanced.
As you can see from this page, having too many quote blocks without full width text in between is less comfortable to read.
This panel of plain text between the pull-quote panels and the personal quote panels shows that the full width text gives the eye a break.
Sub headings can also help to break up the page. This is H4
It is very helpful to use "preview" to play with the formatting and make sure it works as you intended.
If you are copying the article to Dotcom it is important to also check that the page works there as the formatting can render slightly differently across the two platforms. The options we have selected aim to minimise this, but checking is still a good idea!
Example of a formatting a quote from a person
We can differentiate quotes from humans with pull-quotes from the article copy by using italic text.
Note: If using italic, please don't include "quote marks" as it all starts to look a bit busy. Choose one or the other and apply consistently.
The colour options noted above also apply.
Heading 3. Centred, italic, default text colour.
One more thing to note
You can also use these two column panels to include smaller (not full width) images in the text. This is a 900x500px image added directly in the dotcom version of this page.