How to Stop or Redirect Loading of Insecure Scripts

csshttpsSecurity

I have a google font / stylesheet being loaded over http, how do I change it to https?

Its causing error messages to crop up on my secure pages like this:

Mixed Content: The page at 'https://www.mydomain.co.uk/customer/account/' was loaded over HTTPS, but requested an insecure stylesheet 'http://fonts.googleapis.com/css?family=Open+Sans:600italic,300,700,400,600'. This request has been blocked; the content must be served over HTTPS.

Best Answer

You can do it this way:

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url(//fonts.gstatic.com/s/opensans/v10/cJZKeOuBrn4kERxqtaUH3VtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
}

See src section.

Instead of having font url with http put them this way: //fonts.gstatic.com/s/opensans/v10/cJZKeOuBrn4kERxqtaUH3VtXRa8TVwTICgirnJhmVJw.woff2. Here we have omitted http:.

This will make sure it runs with http and https both.

Hope this helps.

Related Topic