Image Content Card Snippets in the CMS

Among other things, Snippets allow you to arrange, design, and display content with ease. Image Content Card Snippets will display equally-sized images across the width of the page, and you will have the option of including a header and content with each image. These are different from Content Panels, as Cards are specially designed to help with navigation in your website, and all Cards should include links. If you would like to display Content Cards without images, please visit Content Card Snippets in the CMS.


Below are examples of the five types of Image Content Cards you may use:


Image with Label


Image with Label (Translucent)


Image with Content


Image with Content and Header



To add an Image Content Card Snippet:

  1. Open the CMS Editor.
  2. Click the Snippet icon.

  3. Locate the Image Content Card Snippets by searching under the Cards category. You will be able to choose between Image, Image with Content, Image with Content and Header, Image with Label, and Image with Label (Translucent).
  4. Once you have made your selection click Insert.
  5. A table transform will appear in the CMS Editor.

  6. By default, the Snippet will give you four content panels, however you can use the add/remove rows tool to add additional cards.

  7. Click on the placeholder text to add your own content to each panel.
  8. You may also create links to go with each panel. To add a link, highlight the "Read more" placeholder text and follow the same steps as adding any other link. Highlight the "Link" input field, click the link icon, and copy and paste or else browse for the correct URL.

  9. To add images, click on the placeholder image and use the Insert/Edit Image tool to add an image. For help with this please see How do I add an image to my web page?.

  10. Once you have finished editing your web page, save and preview to ensure your Snippet has rendered correctly.
Was this article helpful? 0 out of 0 found this helpful

Have more questions? Submit a Support Ticket