People Cards

The People Cards component allows for a card based layout designed to display person, staff, or faculty information. These components use the person content type to provide the details needed to display, such as name, photo, department, job title, and contact information.
  • Published - Select or unselect to make component visible or not to site visitors. Defaults to published
  • Columns (required) - Select the number of columns (2-4) to use before wrapping items
  • Color Options (required) - Choose the colors which to use when displaying the component
    • White Background - Gray Cards
    • White Background - Black Cards
    • Black Background - White Cards
    • Black Background - Gray Cards
    • Gray Background - White Cards
    • Gray Background - Black Cards
  • Section Header
    • Include in Jump Links Menu - Select or unselect to make section title an anchor link
    • Section Title - Give the section a title that will help identify the component. This also doubles as an anchor link for the section when using the Current Page Section Menu on Basic Pages
    • Description - Short description that helps further explain the section
    • Button Color - Color of the CTA button (green, gold)
    • Button Link URL / Text - Identify where the button should take visitors and what the button should say
  • People Selector (required) - Autocomplete fields for choosing which people to include

Instructions start on the Create or Edit within a piece of content.

  1. Create Content using the Add Component button
  2. Choose People Cards from the list of Components in the Cards section
    OR
    Edit Content content using the Edit button
  3. Switch the Published field on or off for the component to be published or unpublished
  4. (required) Select the number of Columns (2-4) to display before wrapping items
  5. (required) Choose the Color Options for the component
    1. White Background - Gray Cards
    2. White Background - Black Cards
    3. Black Background - White Cards
    4. Black Background - Gray Cards
    5. Gray Background - White Cards
    6. Gray Background - Black Cards
  6. (optional) Section Header allows for the creation of a Call to Action (CTA) to display beside the articles
    1. Include in Jump Links Menu (defaults to yes)
    2. Section Title
    3. Description
    4. Button Color (green, gold)
    5. Button Link URL / Text
  7. (required) Use People Selector to select a person using the autocomplete field
    1. Click Add another item to add a as many people as desired

Simple Example

This component has many options available for display. Below is an example of a four column and white background with gray cards. There is no limit on the number of items which can be added. The items will wrap to the next line based on the number of columns selected.
More Examples