Display Cards

When To Use Display Cards

  • Display Cards are a fantastic Content Block, for use when you need to display an image, along side text.
  • The Display Card aligns the text with the image, and providing the images are uploaded large enough, it will automatically resize and align the images. 
  • Display Cards act like a two column table, but are mobile responsive.

How To Add Display Cards

Once you have followed the instructions on Adding Content Blocks, locate your new Content Block on the Widgets page, and click on the  to enter the settings page, and complete the fields;

  • HTML Content: Add your text that you wish to display beside your image, as you would Using the Editor
  • Image: Upload your image
  • Image Location: Select from the drop down list where you would like your image positione.
  • ALT Tag: Insert an ALT Tag for your image.
  • Image Shape: Select what shape you would like your image to be.
  • Custom Class: This field can be left blank
  • Background Colour: Choose your background colour. The default is transparent. If you wish to change this, click the field and a colour selection box will appear for you to choose from.
  • Click Save.
  • TIP:  If you need to expand the editor page, you can click and drag the bottom corner to increase the size.

  • You can add as many Display cards as required, by repeating the above steps.
  • Content Blocks are live on your website page as soon as you click Save. So it is a good idea to preview your page and ensure the update is correct.
  • Below is how the Display Cards, will appear live on the Website. (Note: The text and colours may differ depending on the styling of your website)