A video allows British Gas to share more visual and engaging content.
British Gas creates many videos to engage customers. This component allows having these videos on the website and gives better context to the customer about what, how or why they should do something.
Use videos from Centrica YouTube channels
Use over 3 videos on a page
Use inside another component (see relationship)
Use video as the primary content
Use as supplementary content
The ratio is not related to (or affect) the ratio of the video. Changing the ratio should be used to allow the video player to fit better inside its parent component.
Make sure that the video has closed caption, a good title and useful thumbnail.
To see examples visit Storybook.
<ns-video id="dQw4w9WgXcQ" ratio="16x9" title="Rick Astley, Never going to give you up music video"></ns-video>
Does it live in a panel?
Does it live inside other components?
✅ Yes -
What layout classes can be used?
Can be found in the YouTube video URL under
Ratio of the video player
The YouTube iframe title
This is required for accessibility. The title should be unique. If there are multiple videos on the page, they should all have different titles (even if they are the same video).
Do you have insights or concerns to share? You can raise an issue via Github bugs.
See all the issues already raised via Github issues.
💩 🎉 🦄 You can also contact the team on Slack on the