Profile Card

Highlighting Individuals

Summary

A Profile Card highlights an individual. It displays a photo, name, job title, phone number, and email address, and can be linked to a full Profile or biography.

Audience

Editors, Publishers, and Web Managers.

Example Profile Card

Framed Profile Card example.

How To

  • 1

    Open a Band

    On a Landing Page, add or edit a Band. (In this example, a 3-Column Band).

    • Add a Band:

    Add Band button.

    Add Band menu.

    • Choose a Column (in this example, Left).

    Left Column dropdown.

    • Edit an existing Band:

    Edit Band button.

  • 2

    Titles

    Add Titles, if desired.

    • Full Width Top Title — In this example, Contact.

    Full Width Top Title field.

    • This places a Top Title with an underline across the full width of the Band.

    Full Width Top Title

    • Left Top Title — In this example, DIT Leadership. This places a Title above the Profile Card.

    Left Top Title field.

  • 3

    Add Profile Card

    • From the Add dropdown menu, choose Add Profile Card.

    Ad profile Card from dropdown menu.

  • 4

    Image

    Fields marked with an asterisk (*) are required:

    • Image (*) — Click Add Media to add an image to the Profile Card.

    Add Media button.

    • In the Add or Select Media dialog box, choose Select Files or drag-and-drop to upload an image. (In this example, James A. Weaver, DIT Secretary & State Chief Information Officer).

    Select Files button.

    • Alternative Text —  Enter a short description of the image used by screen readers and displayed when the image is not loaded. This is important for Accessibility.
    • Name (*) — Enter the person's name.
    • Leave the Show in Media Library and Published options checked.

    Name and Alternative Text fields.

    • Click Insert Selected.

    Insert Selected button.

  • 5

    Image Style

    • Choose an Image Style. (In this example, Portrait).

    Image Style dropdown menu.

    Available Image Styles:

    • None — Displays original image scaled to fit.
    • Event — Displays original image scaled to fit.
    • Portrait — Crops image to 376 x 500 pixels.
    • Square — Crops image to 500 x 500 pixels.
  • 6

    Profile Card Fields

    Populate the Profile Card fields. Fields marked with an asterisk (*) are required:

    • Name (*) — In this example, James A. Weaver.
    • Job Title — In this example, Secretary & State Chief Information Officer.
    • Phone Number — In this example,  (919) 809-3845.
    • Email Address — In this example, james.weaver@nc.gov.

    Profile Card fields.

    • URL — Link the Profile Card to the individual's full Profile. Click anywhere on the saved or published Card to link to the URL entered here.

    Profile link field.

  • 7

    Frame the Card

    • Check Frame the Card to put a border around the Profile Card.

    Checkbox option for framing the Profile Card.

  • 8

    Text

    • Optional Text entered here appears below the Profile Card.

    Text field (optional).

  • 9

    Save

    • Click Save, at the bottom of the Edit page, to save the page and view results.

    Save button.