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 trial

HTML

Posted by Nick Harmon
Nick Harmon
5,900 Points

Trouble with Custom Profile Image on About Page

I am having trouble getting my own image to appear on the profile page. I uploaded the image to workspaces and put it in the img folder along with all the other images that previously came with the download. I then wrote the code as shown on the video as:

The file is correctly labeled, as it appears as "nick_temple.jpg" in the img folder. What could the problem be? It worked correctly when using Nick Petit's included picture, but when I use my own the image only appears in workspaces, when I preview the website all that appears is my alt text "Photograph of Nick Harmon".

Any help would be appreciated. Thank you!

Ross Litzenberger
Ross Litzenberger
11,706 Points

I would like to help can send me url link.

carlosjimenez
carlosjimenez
5,504 Points

I agree with Ross, can you give us a link or at least paste in the code so we can see it? Thanks.

3 Answers

carlosjimenez
carlosjimenez
5,504 Points

There is nothing wrong with the syntax of your image tag so i'm going to go ahead and assume that you either have an incorrect image name, or an incorrect path.

Stephen Little
Stephen Little
8,312 Points
Stephen Little
Stephen Little
8,312 Points

Yes we would have to see the code to figure out what wrong for sure. At a quick guess I would suggest that you check your image type for the image you uploaded of yourself. It may be that Nick used .jpg or your is something else like .png or something else.

So check you image extension maybe? I hope this helped in some way .... Cheers!

Stephen

Nick Harmon
Nick Harmon
5,900 Points

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Nick Harmon | Designer</title> <link rel="stylesheet" href="css/normalize.css"> <link href='http://fonts.googleapis.com/css?family=Lobster|Open+Sans:400,800,700italic,700,400italic' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/main.css"> </head> <body> <header> <a href="index.html" id="logo"> <h1>Nick Harmon</h1> <h2>Designer</h2> </a> <nav> <ul> <li><a href="index.html">Portolfio</a></li> <li><a href="about.html" class="selected">About</a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> <div id="wrapper"> <section> <img src="img/nick_temple.jpg" alt="Photograph of Nick Harmon" class="profile-photo"> <h3>About</h3> <p>Hi, I'm Nick Harmon: This is my design portfolio where I share my latest work.</p> <p>If you'd like to follow me on Twitter, my username is <a href="https://twitter.com/@nickharmon89">@nickharmon89</a>.<p/> </section> <footer> <a href="https://twitter.com/nickharmon89"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a> <a href="https://facebook.com/Nicholas.K.Harmon"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a> <p>© 2014 Nick Harmon.</p> </footer> </div> </body> </html>

Nick Harmon
Nick Harmon
5,900 Points
Nick Harmon
Nick Harmon
5,900 Points

this is the URL that is on the preview page: http://port-80-qihakjajep.treehouse-app.com/about.html this is the url on the workspaces page: http://teamtreehouse.com/workspaces/1951652 the file extension is a .jpg the code for my about page is here:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Nick Harmon | Designer</title> <link rel="stylesheet" href="css/normalize.css"> <link href='http://fonts.googleapis.com/css?family=Lobster|Open+Sans:400,800,700italic,700,400italic' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/main.css"> </head> <body> <header> <a href="index.html" id="logo"> <h1>Nick Harmon</h1> <h2>Designer</h2> </a> <nav> <ul> <li><a href="index.html">Portolfio</a></li> <li><a href="about.html" class="selected">About</a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> <div id="wrapper"> <section> <img src="img/nick_temple.jpg" alt="Photograph of Nick Harmon" class="profile-photo"> <h3>About</h3> <p>Hi, I'm Nick Harmon: This is my design portfolio where I share my latest work.</p> <p>If you'd like to follow me on Twitter, my username is <a href="https://twitter.com/@nickharmon89">@nickharmon89</a>.<p/> </section> <footer> <a href="https://twitter.com/nickharmon89"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a> <a href="https://facebook.com/Nicholas.K.Harmon"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a> <p>© 2014 Nick Harmon.</p> </footer> </div> </body> </html>