Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialAnthony Conti
Courses Plus Student 2,213 PointsWhat is wrong with my Google font code?
I went to validate my HTML code, and it says I'm having an error with my font code I used from Google Fonts. Mine is exactly the same as shown in the tutorials I don't understand what's wrong with it.
<link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'>
This is what is giving me the error for this:
Error Line 7, Column 142: Bad value http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800 for attribute href on element link: Illegal character in query: not a URL code point. β¦ne|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'> Syntax of URL: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20.
3 Answers
Rich Bagley
25,869 PointsHi,
In your code replace the pipe ( | ) symbol after 'Changa+One' with %7C, for example:
<link href="http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800" rel="stylesheet" type="text/css">
would become:
<link href="http://fonts.googleapis.com/css?family=Changa+One%7COpen+Sans:400italic,700italic,400,700,800" rel="stylesheet" type="text/css">
-Rich
Anthony Conti
Courses Plus Student 2,213 PointsYes! That worked. Thanks Rich, you're the best. Why was it doing that?
Rich Bagley
25,869 PointsNo problem, glad you managed to fix it. The character set doesn't accept the pipe character and so you need to URL encode it for it to be allowed.
Hope that helps! Don't forget to mark it as the Best Answer if you're sorted :)
-Rich
Sean Kelley
7,118 PointsHad the same issue, thanks for this