Skip to main content

Image

Use this block to add simple images to your page. 

There are also other blocks which can be used to add images:

  • Carousel (small images on a swipeable carousel)
  • Hero (large rotating banners)
  • Parallax (an image that sits behind content, adding depth to a page)
  • Feature (a styled image)
  • Multi-Feature (multiple static images in a single block)
  • Wide Feature (image with a block of text)

Appearance

image.png

Editing the Block

Content

FieldPurpose
Heading Enter a short block title - this will show above the main content of the block.block
Body Text

This is the main content of the block. Use the controls to format your text.text

 

It will appear as a caption, below the image. image

Link URL Enter a link URL - if populated, this will add a link to the image. 

Image Use the dialogue to select an image to upload.upload
Delete Image Use the tick box to delete an image - you will be asked to confirm your action.action

Settings

FieldPurpose
Block Width

SetChoose thefrom:

block

 width by selecting from the drop down:

  • 25%
  • 33%
  • 50%
  • 66%
  • 75%
  • 100%
  • Full Width (set to always be the full width of the user's device)

Mobile Width

Set the block width by selecting from the drop down:

 

  • 33%
  • 50%
  • 100%

Visibility

Link URL

Set the block visibility from the list:

 

  • Default (both)
  • Desktop Only
  • Mobile Only
  • Hidden (none)

Heading Position

Alter the alignment of the block header:

 

  • Left
  • Central
  • Right

Background Colour Choose a background colour for your image. Choose from recommended colours, or use a colour picker. 

Additional Options

FieldPurpose
Invert Text Colour Toggle to invert the text colour.colour
Actual Size Choose to display the image at actual size.

size

Advanced

Padding

Adding padding will insert space within the current block; this will adjust the position of content within the block.

More information is available here

Margin

The margin will add additional space around the current block. 

More information is available here