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 trialDeanna O'Neal
7,278 PointsI followed all the steps, and when I refreshed my browser to preview my website, the font did not change. What is wrong?
I did the 'Changa One' font. I copied and pasted the code in index.html and main.css. I jmade sure the location in the lines of code are correct. I made sure I saved. I refreshed the browser. Ugh.
8 Answers
Keith Greatz
4,377 PointsHi Deanna, hope you found the issue for this already, as Jeff said it might have been an issue with the google link, I copied you HTML and CSS and changed the google fonts link to
<link href='http://fonts.googleapis.com/css?family=Changa+One' rel='stylesheet' type='text/css'>
And it worked, It shows the heading under the different font in my preview
Either way it appears the issue is definitely with the google font link, hope this helps.
Keiffy101
Jeff Ward
8,978 PointsGlad you figured it out!
Deanna O'Neal
7,278 PointsI still couldn't get that font to work, so I just selected a different font and all is well. Thanks!
Jeff Ward
8,978 PointsCould you paste the code here so we can see it? Also make sure you saved the css/html files to ensure it updated. That is very important. It will not update if the css/html are not saved.
Deanna O'Neal
7,278 Points<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Themes Come True | Children's Party Planner</title>
<link rel="stylesheet" href="css/normalize.css">
<link href='http://fonts.googleapis.com/cssfamily=Changa+One:400,400italic|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header>
<a href="index.html" id="logo">
<h1>Themes Come True</h1>
<h2>children's party planning</h2>
</a>
<nav>
<ul>
<li><a href="index.html" class="selected">Gallery</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
<div id = "id wrapper">
<section>
<ul>
<li>
<a href="img/gallery1.jpg">
<img src="img/gallery1.jpg" alt="">
<p>April Showers and Rainbows Party</p>
</a>
</li>
<li>
<a href="img/gallery2.jpg">
<img src="img/gallery2.jpg" alt="">
<p>Oscar Inspired "Olivia" Party</p>
</a>
</li>
<li>
<a href="img/gallery3.jpg">
<img src="img/gallery3.jpg" alt="">
<p>Annie 2014 Movie Party</p>
</a>
</li>
</ul>
</section>
<footer>
<a href="https://twitter.com/eventthemes"><img src="img/twitter-wrap.png" alt="Twitter logo"></a>
<a href="https://www.facebook.com/themescometrue"><img src="img/facebook-wrap.png" alt="Facebook logo"></a>
<p>© 2014 Themes Come True</p>
</footer>
</div>
</body>
</html>
Deanna O'Neal
7,278 PointsSpecifically:
<link href='http://fonts.googleapis.com/cssfamily=Changa+One:400,400italic|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'>
Deanna O'Neal
7,278 PointsGENERAL
*********************/
#wrapper {
max-width: 940px;
margin: 0 auto;
padding: 0 5%;
}
a {
text-decoration: none;
}
/*********************
HEADING
*********************/
#logo {
text-align: center;
margin: 0;
}
h1 {
font-family: 'Changa One', sans-serif;
margin: 15px 0;
font-size: 1.75em;
}
Deanna O'Neal
7,278 Points<link href='http://fonts.googleapis.com/css?family=Changa+One:400,400italic|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'>
And I know I saved it. I double checked that step for sure.
Jeff Ward
8,978 PointsHmm, Idk it should be working. Im just learning so maybe a more experiecned person can answer. Feel free to email me the project files in your workspace (.zip) and I will mess around with it and see if I can get it to work.
It appears your HTML code is correct... I will have to figure it out. Maybe try to get the google API link again, and just repeat the process. Perhaps it was a bad "link" generated by google. Im just spitballing here.
Deanna O'Neal
7,278 PointsI just changed to a different font and all is well. Thank you!
Jesse Jut
737 PointsI am having the exact same problem. My code is the exact same as yours but even when I try a different font its still not working
Jeff Ward
8,978 Pointslets see your code
Jesse Jut
737 Pointsfor some reason it just started working. I didn't change anything and I definitely had saved it before hand so I don't know why it wasn't working before.
Jeff Ward
8,978 PointsPerhaps it was the script from google? Or the CSS font-famil with proper ''
Elena Paraschiv
9,938 PointsI have the same problem
/*****************************************************************************
COLORS
******************************************************************************/
header{
background: #3b5998;
border-color:#f1be28;
border-width:10px;
border-style: solid;
}
nav {
background:#4e69a2;
}
nav a{
color:#fff;
text-decoration:none;
}
a{
color:#3b5998;
text-decoration:none;
}
li {
list-style:none;
}
nav a:visited{
color: #655643;
}
nav a:hover{
color:#ffc0c2;
}
/*****************************************************************************
ALIGN
******************************************************************************/
#logo {
text-align:center;
margin:0;
}
h1 {
font-family: 'Lobster', cursive;
}
#wrapper{
max-width:940px;
padding: 5% 5%;
margin:0 auto;
}
Elena Paraschiv
9,938 Points<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Elena Paraschiv | Designer</title>
<!-- link tag links to another file, the normalize.css / rel is the relationship and is a style sheet-->
<link rel="stylesheet" href ="css/normalize.css">
<link href='https://fonts.googleapis.com/css?family=Lobster|Caudex:700,700italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href ="css/main.css">
</head>
<body>
<header>
<a href="index.html" id="logo">
<h1>Elena Paraschiv</h1>
<h2>Designer</h2>
</a>
<nav>
<ul>
<li><a href="index.html" class="selected">Portfolio</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
<div id="wrapper">
<section>
<p>
<ul>
<li>
<a href = "img/numbers-01.jpg">
<img src="img/numbers-01.jpg" alt="picture 1">
<p>Acadea programata in html</p>
</a>
</li>
<a href = "img/numbers-02.jpg">
<img src="img/numbers-02.jpg" alt="picture 1">
<p>Albastrel si galmben n html</p>
</a>
</li>
<li>
<a href = "img/numbers-06.jpg">
<img src="img/numbers-06.jpg" alt="picture 1">
<p>6-le din Univers programat in CSS</p>
</a>
</li>
<li>
<a href = "img/numbers-09.jpg">
<img src="img/numbers-09.jpg" alt="picture 1">
<p>Al 9-lea roz in Mysql</p>
</a>
</li>
<li>
<a href = "img/numbers-12.jpg">
<img src="img/numbers-12.jpg" alt="picture 1">
<p>12 dungulita PHP/p>
</a>
</li>
</ul>
</p>
</section>
<footer>
<a href = "https://twitter.com/?lang=en">
<img src="img/twitter-wrap.png" alt ="Twitter Logo">
</a>
<a href = "https://www.facebook.com/">
<img src="img/facebook-wrap.png" alt ="Facebook Logo">
</a>
<p>
©2015 Elena Paraschiv
</p>
</footer>
</div>
</body>
</html>
Deanna O'Neal
7,278 Points<link href='http://fonts.googleapis.com/css?family=Changa+One:400,400italic|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'>
Keith Greatz
4,377 PointsKeith Greatz
4,377 PointsCheck out the vid to the side of the forums called "Tips for asking questions", it shows you how to copy and paste code, Im pretty new but i like to help if i can, just need more specific information.
I found the video about posting questions a little confusing so heads up the ``` is the key to the left of you #1 key. Come back with some more info and I'll try help
Keiffy101