Problem with Google Fonts

Thiago Duarte

unread,

Jul 15, 2014, 6:37:49 PM7/15/14

to web...@googlegroups.com

Hello! I'm having a problem: I upload a file with the following code in my application "static" folder (I'm using PythonAnywhere):

<html>
<head>
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Nunito">
<style>
#font {
  font-family: 'Nunito', sans-serif;
  font-size: 48px;
}
</style>
</head>
<body>
  <div id="font">Text here!</div>
</body>
</html>

Well, when I open the html file everything works perfectly, but when I open the page of the uploaded file the font looks like a simple Arial sans-serif. Do I have to add some line in somewhere to my code work?

Thanks in advance!

Leonel Câmara

unread,

Jul 16, 2014, 7:55:12 AM7/16/14

to web...@googlegroups.com

I don't see anything wrong with it (well you could use https instead of http so it also works if you're browsing it using https). Can you clarify exactly when does it not work? What do you mean by "when I open the page of the uploaded file"?

Thiago Duarte

unread,

Jul 16, 2014, 10:10:01 AM7/16/14

to web...@googlegroups.com

well you could use https instead of http so it also works if you're browsing it using https

I'm not sure if it's what you are talking about, but the url already is https, If I try delete this final s and reload the page, the url backs to be https. Moreover I uploaded the same file in two host sites, PythonAnywhere and Orgfree, and everything seems okay with the page hosted in Orgfree.

Can you clarify exactly when does it not work? What do you mean by "when I open the page of the uploaded file"?

I meant the above code is the content of a file which I uploaded in the "static" folder of web2py and when I access the page that corresponds to the file, the font isn't Nunito, it's Arial.

Thiago Duarte

unread,

Jul 16, 2014, 7:30:37 PM7/16/14

to web...@googlegroups.com

Thanks to a guy from the Stack Overflow, I tried change the third line to <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Nunito">, removing "http" from href, and it worked. Thank you anyway Leonel.

Leonel Câmara

unread,

Jul 17, 2014, 7:05:17 AM7/17/14

to web...@googlegroups.com

Thiago by removing http it uses whatever protocol you're using. So my solution would also have worked. The reason for your problem is that when you request a webpage using HTTPS the browser blocks non-secure requests so HTTP is blocked.

I told you to use https:// instead of just // so it also works if you open the file locally. Whereas using // it would become <link rel="stylesheet" type="text/css" href="file://fonts.googleapis.com/css?family=Nunito">, which of course wouldn't work.

Thiago Duarte

unread,

Jul 18, 2014, 12:05:26 AM7/18/14

to web...@googlegroups.com

I'm sorry, I had not understood the hint between parenthesis. Thank you for your answer and explanation.

Reply all

Reply to author

Forward