How do I enable fullscreen mode for a YouTube video embed?
To enable fullscreen mode for an embedded YouTube video, you need to include specific attributes in the <iframe>
tag of your embed code. Here’s how to do it effectively:
Steps to Enable Fullscreen Mode
Use the
allowfullscreen
Attribute: This attribute must be added directly to the<iframe>
tag to allow the video to enter fullscreen mode.Add the
allow
Attribute: Additionally, includingfullscreen
in theallow
attribute is recommended for broader compatibility across different browsers.
Example Embed Code
Here’s a sample code snippet that demonstrates how to set this up:
<iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEO_ID" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture; fullscreen" allowfullscreen></iframe>
Important Notes
If you encounter issues with fullscreen not working, double-check that there are no conflicting parameters in the URL, such as
&fs=0
, which disables fullscreen functionalityWhen fullscreen feature is enable, you can see a fullscreen control in the Youtube embed player on your website
Use Beyondspace Youtube Embed code generator to quickly enable/disable fullscreen feature of Youtube embed code without edit the code directly.
Place the Youtube video URL to the Video URL input
In Player Options, toggle Disable Fullscreen to disable/enable fullscreen feature
Click Generator Code to create the embed code