google-tag-manageryoutube-iframe-apimixed-content

google tag manager gives "mixed content" error

I'm using google tag manager:

<script>
(function(w, d, s, l, i) {
    w[l] = w[l] || [];
    w[l].push({
        'gtm.start': new Date().getTime(),
        event: 'gtm.js'
    });
    var f = d.getElementsByTagName(s)[0],
        j = d.createElement(s),
        dl = l != 'dataLayer' ? '&l=' + l : '';
    j.async = true;
    j.src = '//www.googletagmanager.com/gtm.js?id=' + i + dl;
    f.parentNode.insertBefore(j, f);
})(window, document, 'script', 'dataLayer', 'GTM-XXXX');
</script>

But when I used https:// to call the page, it gave me mixed content error: 1) .... was loaded over HTTPS, but ran insecure content from 'http://www.youtube.com/iframe_api': this content should also be loaded over HTTPS. 2) .... was loaded over HTTPS, but ran insecure content from 'http://s.ytimg.com/yts/jsbin/www-widgetapi-vflFaZyew/www-widgetapi.js': this content should also be loaded over HTTPS.

I can't figure out why or how to fix this, could you please help? Thanks.

Solution

  • You may want to make sure that your tags (especially custom tags) are not specifying the http protocol. You can make URLs work on both http and https by not using the protocol portion of the URL. For example:

    //www.google.com/