On our website which is built in Kentico we have embedded a youtube video, as follows:
<div class="youtube">
<iframe width="100%" height="100%" src="https://www.youtube.com/embed/<%# Eval("YouTubeId") %>?autoplay=0&autohide=1&controls=1&loop=0&playlist&rel=0&fs=1&wmode=transparent&showinfo=0&modestbranding=1&iv_load_policy=1&start=0&theme=dark&color=red&enablejsapi=1&" frameborder="0" allowfullscreen></iframe>
</div>
The above iframe has a thumbnail associated with it, which looks like this
<div class="poster"><span></span><%# IfImage("Thumbnail",GetBrickImage(Eval("Thumbnail"), "featurevideo", Eval("Title")), "") %></div>
and sits just under the closing div of class youtube.
Now my issue is when the users come to the site and presses play on the thumbnail the video doesn't play straight away instead the thumbnail disappears and the default youtube play button appears making the user press play again, when I use the developer tool bar and press play for the first time I get the error
Blocked loading mixed active content "http://www.youtube.com/iframe_api"
I cannot for the life of my figure out what is going wrong, We have recently installed a SSL certificate on the server this site currently sits on and since then its been causing this issue. From what I have read and see people were suggesting to drop the www. so it would be https://youtube.com.... again this didn't help me. I then went and tested this on IE10/Chrome and the issue is still happening. Can anyone suggest anything for this?