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.

1 Answer 1


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.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.