- Introduction To HTML
- HTML Editors
- HTML Basic Examples
- HTML Elements
- HTML Attributes
- HTML Headings
- HTML Paragraphs
- HTML Styles
- HTML Formatting Elements
- HTML Quotation
- HTML Comments
- HTML Colors
- HTML Styles - CSS
- HTML Links
- HTML Images
- HTML Tables
- HTML Lists
- HTML Block And Inline
- HTML Class
- HTML Id
- HTML Iframes
- HTML JavaScript
- HTML File Paths
- HTML Head
- HTML Layout
- HTML Responsive
- HTML Computer Code
- HTML Semantic
- HTML Forms
- HTML Form Attributes
- HTML Form Elements
- HTML Input Types
- HTML Input Attributes
- HTML Input Form Attributes
- HTML Canvas
- HTML SVG
- HTML Media
- HTML Video
- HTML Audio
- HTML YouTube
HTML YouTube
HTML YouTube Videos
YouTube is the easiest way to play videos in HTML.
Struggling with Video Formats?
Converting videos to various formats can be challenging and time-consuming.
A simpler solution is to embed YouTube videos on your website.
YouTube Video Id
YouTube will display an id (such as tgbNymZ7vqY) when a video is saved or played.
You can use this id to reference your video in HTML code.
Playing a YouTube Video in HTML
To play your video on a web page, do the following:
- Upload the video to YouTube
- Take a note of the video id
- Define an
<iframe>
element in your web page - Let the
src
attribute point to the video URL - Use the
width
andheight
attributes to specify the dimension of the player - Add any other parameters to the URL (see below)
<html>
<body>
<iframe width="420" height="345" src="https://youtu.be/v3CaxeJqec0">
</iframe>
</body>
</html>
YouTube Autoplay + Mute
By adding autoplay=1 to the YouTube URL, you can have your video begin to play automatically when a user visits your page. However, automatically starting a video is irritating to your site visitors!
Add mute=1 after autoplay=1 for your video to automatically begin playing (but muted).
<html>
<body>
<iframe width="420" height="345" src="https://youtu.be/v3CaxeJqec0?autoplay=1&mute=1">
</iframe>
</body>
</html>
YouTube Loop
YouTube Playlist
A list of videos to play, separated by commas (in addition to the original URL).
YouTube Loop
Add loop=1 to make your video loop indefinitely.
Default (value 0): The video will only play once.
The video will loop once (forever).
<html>
<body>
<iframe width="942" height="530" src="https://www.youtube.com/embed/v3CaxeJqec0" title="Mytat video on Simplified Assessments" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</body>
</html>
YouTube Controls
Add controls=0 to disable the display of video player controls.
Value 0: Player controls does not display.
Value 1 (default): Player controls display.
<html>
<body>
<iframe width="420" height="345" src="https://youtu.be/v3CaxeJqec0?controls=0">
</iframe>
</body>
</html>
Products
Partner
Copyright © RVR Innovations LLP 2024 | All rights reserved - Mytat.co is the venture of RVR Innovations LLP