Link Card (Classic)

Available on
Faculty Sites
Sites+

Link Cards offer the opportunity to create visually appealing links in a variety of styles such as linked images and buttons. This tutorial will cover how to add link cards.

You can make these three types of Link Cards.

The three Link card options
Depending on what fields you fill out you can create button links, image links, or a combination of an image and button.

Add a Link Card

Faculty Homepage Builder

To add any type of block, click the blue Add Block button in the Homepage Builder.

The big blue add block button

Edit a Link Card

Faculty Homepage Builder and Sites+ Homepage Editor

There are several fields in the configure pop-up for the Link Card.

Title. A title is required, but you may uncheck Display title to hide it.

The title field with the Display title checkbox underneath.

Image. Make an image link by adding an image. We recommend images no larger than 600 x 600 pixels. Be sure to fill out the alternate text to succinctly describe the image to screenreaders. If the image will be stand-alone, use alternate text to type the link's destination.

Image size. You may upload any size image you wish, but an easy way to make Link Card images consistent is to use the Image Size options. Use the dropdown to select Square or Wide, and your image will be automatically resized. This is particularly helpful when making a row of Link Cards.

Button text. If you want to display a text button on your Link Card add button text.

Link. A Link Card requires a link.

Icon. There are several icons (small pictures) to choose from. The icon will appear to the left of the button text.

Style. This refers to the color of the Link Card button. See the style examples below for the full selection.

Text size. Choose a size for the button text - small, medium, or large. Most Link Cards work just fine with the default, medium.

Match width to card content. This is helpful if you don't want your Link Card to get very wide.

Save

Be sure to click Save or Add Block

Style Examples

There are a variety of colors and image overlays to choose from.

All the possible style options including multiple button colors and overlays.