How to use Google Fonts under both SSL and non-SSL without SSL insecure messages
The fix for this is very simple and will work under all the common browsers. This has been tested on IE9, Firefox 13, Safari and Chrome.
locate this line on your HTML page (or template):
<link href='http://fonts.googleapis.com/css?family=Dosis:400,700' rel='stylesheet' type='text/css'>
and change it to this:
<link href='//fonts.googleapis.com/css?family=Dosis:400,700' rel='stylesheet' type='text/css'>
This simple change will make your browser call the Google Font page in the applicable mode (HTTP vs HTTPS).
Enjoy!
Not in a millions years would I have guessed this! I applied the fix and now all the content of the site is secure which was NOT the case before!
Great thank you 🙂 Works well!
Pingback: Google Fonts mit SSL und Ohne SSL Ohne Weiche | Mkuh
Thanks for this tip. Was the only issue on my non-secure page. Now all good 😉
Thanks!!! It works!!!
Perfect!! Works a great thanks!
Perfect.
groovy dude!
This just saved me! Thank you!
Pingback: Knowledge Base: Google Webfonts Locked Down in Intranet | the Mix-mash
Thank you!!!!! This was the last thing on my site making it ‘unsecure’.
You saved my day, thank you
Thanks!
I had a WP plugin that even though it had https://fonts.googleapis.com in its CSS code, the pages rendered as http://fonts.googleapis.com causing non secure elements. Using your fix amazingly fixed this! Brilliant!
Thank you very much for your tip, it helps me a lot ^_^
I owe you a cold bottle of beer! ~ Thanks Pal
This sounds great but it isn’t working quite so well for me. I have these lines in my theme:
@import url(//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,600,700,300);
@import url(//fonts.googleapis.com/css?family=Roboto+Slab:400,700,300);
As you can see, I’ve removed the “http:” and I’m still not getting a secure page. I’ve checked and, according to a “Why No Padlock” internet tool, this is still rendering as http: This is the only issue hanging things up. Any input would be very much appreciated.
Thanks.
Great tip – thank you very much!
Thanx, just what I needed!
D’oh! So simple I never woulda figured it out. My SSL site is looking good with font: ‘Roboto’ !
works like charm. Thank you for let me know about this 🙂
Pingback: Google fonts a protokol Https | Virtuální grafické studio Design Green Cat
This could depend on which sort of CMS you are using. Drupal does have some issues with this.
Couple of ways you can try to get around this.
1) hard specify https://fonts.googleapis.com in the @import line (try that)
2) download the font packages directly on your own, place them on your server and link to them directly on your own server, bypassing the need to load them from Google. (This will work 100%)
Can anyone give me an idea of where in my wordpress site files I would find this code so that I can change it?
I tried this exactly as you noted. Unfortunately, now Whynopadlock.com says:
fonts.googleapis.com returned an error (Possibly 404 not found or other webserver error.
Any ideas sure would be helpful. This is the last thing holding the site back from being fully secure.
Where can I locate this code so that I can change it from my WordPress dashboard?
I just added a new post specifically dealing with WordPress and HTTP/HTTPS errors.
http://www.amixa.com/blog/2015/06/24/wordpress-and-google-fonts-http-and-https-error-messages-and-resolutions/
HOW TO LOCATE THAT FILE IN MAGENTO OR WHERE CAN I REWRITE THE CODE
Pingback: Switched to HTTPS/TLS – Wavether
Anthony M. Davis – I am experiencing this same issue, were you able to fix it and how?
Nice Post
HEI DEAR !!! Help me
I tried this exactly as you noted. Unfortunately, now Whynopadlock.com says:
fonts.googleapis.com returned an error (Possibly 404 not found or other webserver error.
Any ideas sure would be helpful. This is the last thing holding the site back from being fully secure.
Thank you so much! I did in my Design Agency website and it works like charm!
http://www.zebro.ca
Hello,
I have a magento theme but I cannot find anywhere.
Any help?
I meant to say,
I cannot find http://fonts.googleapis.com/css anywhere in my magento theme.
thank you so much brothre
Thanks font crash fixed.^^
It’s work into a joomlaimage 00071 simplex theme. Thank you.
How can i locate the file?
I don’t know where it is to change. I’m in wordpress
THAAAAAAANNNXXXXXXX!!!
Thank you very much!
Brilliant! Thanks a million times. For hours, I have been scrapping and scratching my cranium for solution not until I came across your tips. And this did the miracle.
God bless
Brilliant
Nice trick..and so helpful..thank you for the tips..
Old but Gold!
Amazing trick, works like a charme for me
Thanks!
Thanks. It Works
nice trick.
I found the link to googleapis under theme-functions.php. If not then look under functions.php.
thank you so much
Thanks!!! It works!!!
It is great.
Thanx, just what I needed! Really Helped me
Thanks for this tip!
great stuff thank you
Thanks! Helped me
Thank you so much for helpful information. It works.
thanks too mate, was stuck for a bit there!