Featured Video¶
Summary¶
A featured video section to display an embedded video and large call out section. The video stacks on top of the call out section on mobile and tablet sizes. On desktop sizes, the video and call out section display side by side, with an option to display the video on the left or right side of the section.
Utilizes video provider and video id attributes to tie into popular video service providers such as YouTube and Dailymotion with the video id value.
Display¶
Mobile
Desktop
Create Component¶
Steps:
1. Check layout and click View/Edit Layout.
2. Click + Add New Component.
3. Select Featured Video With Overlay.
4. Enter component name and component code.
5. Set component as Active.
6. Enter following inputs in admin.
Attention
Component code should be unique to each component.
Admin Display¶
Component Attributes¶
Attribute | Description | Required |
---|---|---|
Lead-In Text | Lead-in title text to display above the call out section title. | No |
Main Text | Main text body for the call out section. Displays below the call out section title. | No |
CTA Link | The href value for the CTA button. | No |
CTA Copy | The CTA button text. | No |
Video Provider | The service provider of the featured video. Current options include:
|
Yes |
Video ID | The id or unique identifier of the featured video. For example, a Video ID value for a YouTube video would be Y2nEje0JGdQ. This value can be set to the video or embed url when using the Other option for the Video Provider attribute. | Yes |
Video Display On Right? | Mark as checked to display the video on the right side of the featured video section on Desktop sizes. | No |
Tip
If the service provider for a featured video is not listed in the Video Provider attribute options list, use the Other option as the Video Provider attribute value and enter the embed or video URL as the Video ID attribute value.
Notes¶
Notes
The Component Name is used for the call out section main title. It is also used for the CTA button text if a CTA Link attribute value is provided and the CTA Copy attribute value is empty.
Components can be set to hide or show using Not Valid Before & Not Valid After.
Default¶
Default