iframe element not working on Firefox – solution

Contents

The problem

It's a common problem that Firefox doesn't fully support the iframe html element, and the cause of the problem is the src attribute of the element. For example, if you have an iframe like this one:

<iframe width="560" height="315" src="https://www.youtube.com/watch?v=fsJ33JSt1j8" frameborder="0" allowfullscreen=""></iframe>

You will be dissapointed to find out that it is not displayed in Firefox. The problem here is that Firefox currently supports only the embed version of the video as a correct value for the src attribute. Example:

//www.youtube.com/embed/fsJ33JSt1j8

The solution

The only programmatically soundproof solution up to now, is to change the src attribute of the iframe element. Using php, you can isolate the 11-character code from YouTube and then append it to the "embed" YouTube string.

Example

Try the following PHP code:

$videolink = 'https://www.youtube.com/watch?v=fsJ33JSt1j8';
/*Isolating the 10 char code from Youtube and adding it to the embed string to make it work with Firefox.*/
$ytCode = substr($videolink, 32, 11);
$ytLink = '//www.youtube.com/embed/' . $ytCode;

Paul Isaris