Style Guide for inputting content
Typography
Headings
The following codes can be used to insert headings into your content if you are using the ‘Text’ view mode.
Heading 2
Heading 3
Heading 4
Colours
Font Sizes
Heading 2 is 26px
Heading 3 is 20px
Heading 4 is 17px
Blockquote
The blockquote element represents a section that is quoted from another source. You can use the following code within the ‘Text’ view mode to insert a block quote.
Corrupti quos dolores et quas molestias excepturi sint occaecati. Fugiat quo voluptas nulla pariatur?Jane SmithJob title
Inline external links
Use this code to insert a link within your content.
Lists
Bullet list
Include the following code within the ‘Text’ view mode to insert a bullet point list into your content.
- Your text goes here
- Your text goes here
- Your text goes here
<li>Your text goes here</li>
<li>Your text goes here</li>
<li>Your text goes here</li>
</ul>
Numbered List
Include the following code within the ‘Text’ view mode to insert a numbered list into your content.
- Your text goes here
- Your text goes here
- Your text goes here
<li>Your text goes here</li>
<li>Your text goes here</li>
<li>Your text goes here</li>
</ol>
Buttons
To draw a visitor’s attention to a certain link, you can include this shortcode within the ‘Text’ view mode to insert a call to action button.
Downloads
The ‘pdf’ shortcode provides a suitable icon to indicate a downloadable file to the user.
PDF Download
In order to view PDF documents you will need Adobe PDF Reader
Messages
Strapline
The ‘strapline’ shortcode provides the ability to create a Strapline.
This is a Strapline
Adobe Prompt
The ‘adobe’ shortcode will display a notice to the user informing them that Adobe Reader may be required to view the PDF.
Viewing PDFs
In order to view PDF documents you will need Adobe PDF Reader
Panels
The ‘panel’ shortcode can be used to highlight a selection of content and contain within it other html code like headings and buttons. Wrap this around some existing content using the ‘Text’ view mode.
Media
The ‘video’ shortcode will allow you to embed YouTube or Vimeo videos responsively into your content.
Block
The ‘block’ shortcode will allow you to present a featured link with an icon. An icon can be specified using the icon attribute, similarly for the link. The block’s content can then be wrapped in this shortcode.
The available icons are ‘video’, ‘pen’ and ‘info’.
Block group
To present the blocks in a group of 3 columns, you can wrap the blocks with the ‘block_group’ shortcode.