This is the super title (optional) of a slide used as a "hero" image

This is the title (optional) of a slide used as a "hero" image

This is the subtitle (optional) of a slide used as a "hero" image
This is the body (optional) of a slide used as a "hero" image. More images (or "slides") can be added to create a slideshow.
Link text (optional)
  1. Tutorials
  2. Example Layouts
  3. Hero, Full-Width, and Slideshow Examples

Hero, Full-Width, and Slideshow Examples

Hero, full-width, and slideshow images are added using the Slider paragraph type.

Hero image example

A "hero" image appears at the top of the page, before the page heading, such as the one shown above. 

Full-width image example

This is the super title (optional) of a slide used as a "full width" image

This is the title (optional) of a slide used as a "full width" image

This is the subtitle (optional) of a slide used as a "full width" image
This is the body (optional) of a slide used as a "full width" image. Adding more slides here to creates a slideshow, as shown below.
Link text (optional)

Slideshow example

This is a slider used as sideshow image. Be sure to include a descriptive caption with each slide. Supertitle, title, subtitle, and link text, as shown above, may also be applied.
This is a slider used as sideshow image. Be sure to include a unique caption with each slide. Be sure to include a descriptive caption with each slide. Supertitle, title, subtitle, and link text, as shown above, may also be applied.
This is a slider used as sideshow image. Be sure to include a caption with each slide to establish more context for the viewer. Supertitle, title, subtitle, and link text, as shown above, may also be applied.

Full Width Image - No Text

Full width images without text can also be added, simply by not filling in the text field options.

With no text added, the image will be at full brightness - i.e. no background screen is layered over it as no additional contrast between text colour and background colour is required.