Content Cards

Page

Content Cards are a compact, attractive way to present an image, link, and/or label. Once they've been set up, they're easy to edit.

How to Edit

  1. Find the Content Card you wish to edit
  2. Hover over the upper right hand corner and a gear icon will appear
    Screenshot of a Content Card with gear icon highlighted.
  3. Click "Edit block"
    Screenshot of a Content Card with the Edit Block option highlighted
  4. On the Edit Content Card screen form, you can change the Title, URL, Image, Icon, and Style.
  5. Click "Save"

Options for Editing

Label and Title

The first field is the label. Users will not see this label. It functions solely for your own identification. Next, fill in the title field. This is the text the user will see. Following the title is the URL field.

Screenshot of Label and Title fields

URL

In the URL field, add the URL of the site that you want to link to. If you are having troubles linking or need a refresher on how to link to other pages on your site, please refer to the Linking/Unlinking tutorial to see some pointers.

Screenshot of URL field

Image

Next, you have the option to add an image. This is not required for creating your block content card. Below you can see how your blocks will display differently with or without an image.

Screenshot of image field

Icon

There are a few dozen icons to append to the beginning of the Content Card title. Icons will appear to the left of your text. They are not required. If you wish to see a preview of what an icon might look like, select it from the menu and it will appear to the right of the drop down menu.

Screenshot of the Icon dropdown with preview icon

Style

If you wish to change the color of your content card, you can do this by opening the “Style” drop down menu and selecting one of the 8 styles available. 

Styling drop down

If you uploaded an image, you can also select one of the overlay options for your title text. These styling options make it easy to attractively display your image, links, and/or labels.

Below you will be able to preview the available options. 

Red, green, and blue label options

Dark red, dark green, and dark blue options

Overlays

The overlay style shows the label aligned to the bottom of the picture or the left. Note: This option will obscure part of the picture. 

Overlay options for bottom and left-aligned


Useful Option: Buttons

If you do not include an image and choose one of the banner styles, the result is a rather pretty button.

Without images, the label options look like buttons

Useful Option: Big Announcements

You can even use Content Cards for bigger images, like for a major announcement. The Overlay styles are particularly helpful for this. 

Screenshot of how a large picture can make a big impact

Category: