Featured Expert Profile Card

Layout Variant: C084

Content Type: Collection


Teaser Title

Teaser Text

Teaser CTA Label

Picture & Other Media

Items

CTAs

C084 Collection 

Yes

Optional

Yes

Yes

Yes

Yes

Items (External Links)

--

--

--

Yes + Alt Text

--

URL


Aspect Ratio: 

  •  

Expected Use:

Use this component with C086C085 and H008B components to provide additional content related to speakers featured in upcoming physical or digital events, as part of an event-page layout or as a teaser snippet elsewhere on the site such as for article author profiles.

Used in conjunction with the C086 Featured expert Carousel, each C084 Featured Expert Detail Modal card provides additional content related to each carousel expert item, including links to the expert’s social media profiles, a link to their about page, and optional bio description copy and attributed article links.

**Note: C084 Modal Card can also be used with H008B Hero with Author Byline.

Building the C084 Component:

This Collection builds the details of the expert card modal. This was initially designed for the C086 Expert Profile List component and also for the H008B Hero with Offset and Byline. When you add this collections to the appropriate component it will act as a pop-up modal when clicking on the hyperlinked item. Build the C084 Collection as follows.

  • Teaser Title - The Teaser Title is highly stylized and must be built in a unique way to format correctly. The title has three actual lines of text that must be typed as one long string in the Teaser Title. The format is: 
    • Name/Title: Job Title/Company: Company Name Inc.
    • eg. ELSA Arendelle/Title: Queen/Company: Frozen Lands Inc.
  • Teaser Text - this is the main profile text/story about the expert. This can also be formatted more than is typical. It is intended to read as a bio with one or two hyperlinks at the end to documents, briefs, blogs or other content by the expert. This is optional. If the Teaser Text is empty, the modal will shrink to a smaller card with the Title, Picture, CTA and Social Links.
  • Teaser CTA Label - set this to something like "Learn More". This is the label that will show for the CTA content you add.
  • Call-to-Action-Button - you will use the "Linked-Call-to-Action Label" radio button and add a page or external link to a more detailed bio or other landing page for the expert. The CTA is pulled from the Teaser CTA Label. Note, the "Use both Custom & Linked Call-to_action Label" does not work in this component
  • Pictures and Other Media - This should be the picture (headshot) of the expert
  • Items - This will contain the social links to the experts social media accounts. These will be external links. See below for constructing these.
  • Layout Variant - Set to C084

Social External Links:

Create these external links for each of the expert's social media properties. These are simply the URL to their wall or feed of a given social property. Create the External Link as follows:

  • URL - this is the URL for the expert's social property. eg. https://twitter.com/jeffbezos
  • Teaser Title and Teaser Text - Not used in this component
  • Picture - this is the social icon that represents the property (eg. Twitter, Facebook, etc.) You need to add Alt-Text to the icon you choose here so that an appropriate text appears when someone hovers over the icon.


Please enable JavaScript to use this website.