Robin Lundgren Robin Lundgren - 4 months ago 11
Javascript Question

How to solve "Mixed content"-issue on Google-Chrome Console

I have an issue where the following is being displayed:


Mixed Content: The page at 'https://www.feelhome.se/produkt/fighting-elephants/' was loaded over HTTPS, but requested an insecure stylesheet 'http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,600italic,600,400italic,300italic,300,200italic,200'. This request has been blocked; the content must be served over HTTPS.


Does anyone have an idea on how I can solve this so it won't appear?

Answer

The problems is that the you are loading the fonts using http instead of https if you change the font url to use https you'll be ok.

So you need https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,600italic,600,400italic,300italic,300,200italic,200

instead of http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,600italic,600,400italic,300italic,300,200italic,200

The fonts seam to be loaded from the template.css and bootstrap.css files. Have a look at the attached image.

enter image description here