Skip to Content

Profile Spotlight

Profile Spotlights are large callouts to highlight specific profiles (1 – 2)

How to Build

Using the backend editor is recommended to build out page components.

  1. Click the Add New Element plus icon to add a component to the page
  2. An Add Element window will appear, choose the Profile Spotlight option
  3. The settings dialog box will appear with a general tab and 1 or 2 profile tabs depending on the option selected in the general tab
    • General Tab

      Complete these Profile Spotlight settings first. The selection here will change the available profile content tabs available and display of the spotlight.

      • Background Color: the background color of the spotlight, purple or blue
      • Number of Profilessetting to display either 1 or 2 profiles in the spotlight, refer to the examples before to see the layouts of each
      • Header: the main heading of the spotlight
      • Description: the main description of the spotlight
    • Profile Tab (1 or 2)

      The options for each profile tab will be the same, the amount (1 or 2) will be dependent on the Number of Profiles selection in the general tab

      • Profile Image: an single image selection for the profile
      • Full Name: full name for the profile
      • Subtext: a designation for the profile, typically for a title, school, degree, honorific, graduating year, etc
      • Description: description of the profile
      • Button: URL and link text to accompany this profile

     

  4. After all tabs are completed, click Save changes.

Examples

Purple Spotlight with 1 Profile Spotlight

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Single Profile
Honorific for Profile
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Home Page

Blue Spotlight with 1 Profile Spotlight

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Profile 1
Honorific for Profile
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Home Page
Profile 2
Honorific for Profile 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Home Page

Read the Johns Hopkins University privacy statement here.

Accept