Display YouTube video in lightning web component

Telegram logo Join our Telegram Channel
Hello Salesforce!!

Here a few simple steps to use youtube video in Lightning web components.

Share Button
  1. Go to the youtube video that you want to show in the lightning web component.
  2. Click on the Share button beneath the video.
  3. Copy the embed link. See image below
    Embed Link
  4. Copy the video embed code which should look like below code.
    <iframe width="560" height="315" src="https://www.youtube.com/embed/1_Gd0rgFAQ4?controls=0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
    
  5. Delete the `frameborder` and allow attribute from video embed code and place it into your lwc and you are done.

example.html
<template>
    <iframe width="560" height="315" src="https://www.youtube.com/embed/1_Gd0rgFAQ4?controls=0" allowfullscreen></iframe>   
</template>

I hope it helped you!


No comments :
Post a Comment

Hi there, comments on this site are moderated, you might need to wait until your comment is published. Spam and promotions will be deleted. Sorry for the inconvenience but we have moderated the comments for the safety of this website users. If you have any concern, or if you are not able to comment for some reason, email us at rahul@forcetrails.com