Shortcodes

Special lists

As well as normal bulleted and numbered lists, there are also tick and cross varients. You apply these by switching to 'Text' tab (on the upper right of the text editor) and applying a class to the list. See below.

Checklist

  • Lorem ipsum dolor sit amet, consectetur adipisicing elit.
  • Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Crosslist

  • Lorem ipsum dolor sit amet, consectetur adipisicing elit.
  • Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Downloads


Strapline

Straplines make a paragraph text slightly more prominent than a regular paragraph. They should be used to call attention to a relatively small snippet of text, typically one sentence. They are often used as an opening paragraph for a page or news post.

Example:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur condimentum leo neque, quis iaculis neque.


Blockquotes

Blockquotes should be used to call attention to a relatively small quote from a person, typically someone part of the organisation.

Example:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur condimentum leo neque, quis iaculis neque.

Jason HobbsDeveloper, Mixd

Panel

A panel should be to used to make a specific, small amount of content, stand out. Titles, paragraphs and bulletpoints will all work inside a panel, but the colour of the text will change accordingly.

Example:

Title

This is some content that needs to stand out.

Colour

Choose appropriate colours from the colour palette. The blue panel should be used in most cases, using the dark purple for warnings, alerts or notices. The dark blue, white and green panels can also be used when creating a distinct contrast with other panels. The 'vision, mission and values' page is a good example of this.

  • blue (default - recommended for standard content)
  • dark-purple (recommended for warnings or alerts)
  • dark-blue
  • white
  • green
  • orange
  • teal

Type

Applies an icon to the panel

  • info

Title

This is some content that needs to stand out.


Button

Buttons should be used to call particular attention to internal or external links. Colours from the NHS colour palette can be chosen, a selection of icons can be chosen and the size can be changed.

Example:

Google Locations

ID / URL

ID

Use for links to internal web pages…using the ID means that if the URL changes, the button will automatically update

URL

Use for links to external web pages, or internal documents.

Label

The label for the button. Make the label short / snappy, and avoid phrases like "click here".

Colour


Video

Usage:

Use to embed any YouTube or Vimeo video, using just the URL. Use this instead of the 3rd party embed codes because this one will ensure it scales proportionately on smaller devices and automatically removes unwanted YouTube settings.