Fonts and Font Awesome icons not loading over SSL

Question

I\'m trying to get my website to load correctly over SSL, and every time I view the page, the icons and font aren\'t loading.

Here\'s what I\'m using for my CSS and

Answer 1

Try downloading the font-awesome zip (css & assets) and serve them from your own server/directory - instead of using the CDN links.

Then just refer to the font-awesome css file in your own directory using https://

This worked for me.

Answer 2

I had the same SSL/TLS error/issue over the chrome. It worked OK on the firefox. I had to switch the sources.

There is issue with MaxCDN you need to use KeyCDN.

Switch from:

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>

to:

<link href="https://opensource.keycdn.com/fontawesome/4.7.0/font-awesome.min.css" rel="stylesheet"/>

Answer 3

I had this same problem - after lots of attempts using the CDN links, with and without https://.., I decided to download the font-awesome zip file and serve them instead from my own server.

Put all the css and assets on your own server, instead of loading them from the CDN link with https://..

Then, just refer to font-awesome.css file using https://..

Eg:

<link rel="stylesheet" href="https://yourdomain-name.com/assets/font-awesome-4.7.0/css/font-awesome.min.css">

This fixed it for me, after going round in circles.

Answer 4

Try remove http: from href:

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

There is a great article about protocol-relative here: paulirish.com/2010/the-protocol-relative-url/

Answer 5

In my case change http source to https while using @import statement in css file works fine.

@import url(https://opensource.keycdn.com/fontawesome/4.7.0/font-awesome.min.css);
[class*="fontawesome-"]:before {font-family: 'fontawesome', sans-serif;}

Answer 6

Try using

//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css

and maybe its a simple issue of using "http" instead "https" because the google apis use https for secure link transfer. Replace http with https