Update User-Added Resources to SSL-Friendly URLs?

Question

I have a field in my publish form where users can add embed code for a video, and they can also embed videos using Wygwam.

The entire site has SSL enabled, but the video embed codes use the insecure "http://" protocol, which breaks the site's SSL.

I don't want my client to have to remember to check the "use https" option on YouTube (and some of the videos are from obscure hosting services anyway).

Is there an add-on or technique I can use to automatically convert those embedded video URL protocols to "https"?

Answer 1

In your templates you can wrap any custom fields that might contain a non-https embed code with Low Replace, finding and replacing any non-https embed sources.

For example:

{exp:low_replace 
    find="http://www.youtube.com/embed" 
    replace="https://www.youtube.com/embed"
}
    {your_custom_field}
{/exp:low_replace}

Low Replace will allow you to specify multiple replacements (so you could catch all your different video embed providers in one shot) and has some other useful features, too.

Answer 2

Have you considered using jQuery for this? This answer on StackOverflow has a code example that might do the trick.

Here's my quick untested code attempt for your specific case:

$('iframe').each(function() {
    var src = $(this).attr('src');
    if (src.indexOf('http:') > -1) {
        src = src.replace('http:', 'https:');
        $(this).attr('src', src);
    }
});

Answer 3

Another option is to just have the client enter the video ID and you hard code the iframe embed code into your template. I do this when I need finite control over the video code.

In the field's description, I link to a screenshot showing them how/where to get the video ID from the video URL. Something like this:

Obviously, this will only work if the video isn't embedded in copy and is a unique field.