Big Fish
Big Fish

Reputation: 5

Change iframe source from HTTP to HTTPS with jQuery

I have a plugin on my WordPress site that automatically adds an iframe to each of my product pages. I have recently started using CloudFlare's Flexible SSL and now that iframe URL won't load because it's considered insecure. Is there any way that I could dynamically change the iframe's URL to be https instead of http?

I have already confirmed that both versions of the URL work the same.

Upvotes: 0

Views: 3133

Answers (2)

user4563161
user4563161

Reputation:

This will search and replace http for https on all the iframes on page.

need any further help putting it in let me know;

fiddle

jQuery(document).ready(function($) {
  $("#pros_reviews iframe").each(function() {
    var $frame = $(this)
    $frame.attr('src', $frame.attr('src').replace('http:', 'https:'))
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="pros_reviews">
  <iframe src="http://www.w3schools.com"></iframe>
</div>

Upvotes: 1

Tom
Tom

Reputation: 4826

To load the iframe with the same protocol (http or https) use a relative scheme : '//example.com' instead of 'http://example.com'. '//' indicate to use the same scheme as the parent page

Note that it is not secure. a most secure way will be to always load 'https://' (and set up a 301 redirect for all pages from http to https)

Upvotes: 0

Related Questions