Google web fonts and SSL error

Viewed 24420

My site is working well with Google webfonts UNTIL the user hits the SSL portion of the site.

At that point, chrome throws the partial encoding error, and my cufon menu losses it's kerning.

I'm including my webfont with this css:

@font-face {
src: local('Lusitana'), url(https://themes.googleusercontent.com/static/fonts/lusitana
/v1/tAIvAkRzqMJf8Y4fM1R7PXYhjbSpvc47ee6xR_80Hnw.woff) format('woff');
}

My js console then gives me this error:

[blocked] The page at https://domain.com/ecommerce.php ran insecure content from http://fonts.googleapis.com/css?family=Lusitana:regular,700&subset=latin.

Any ideas how I can get google fonts to force SSL?

4 Answers

I also had this error caused by a theme in WordPress. It caused slow page loading and the following error reported by development console:

Mixed Content: The page at 'https://xxxxxxx.co.uk/' was loaded over HTTPS, but requested an insecure stylesheet 'http://fonts.googleapis.com/css? family=Droid+Serif%3A400%2C700%2C400italic%2C700italic&ver=5.4.1'. This request has been blocked; the content must be served over HTTPS.

The culprit was Wordpress theme called "Fresh and Clean". It inherits code written in 2014 which contains 'pre-SSL' coding practices

To resolve the problem all need to do is make changes inside the following file in the theme:

/wp-content/themes/wpex-freshandclean/functions/scripts.php

Look inside for any occurences of http:// and change each one to https://

Related