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!
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
Patrick Oliver
413 Pointshelp with images and lists
Hello I am stuck on the video where it says stage 2 text and editors
and it asks you to create this code: <img src="img/logo.gif" alt="Smells Like Bakin">
I have tried refreshing my browser in my firefox but the image does not appear correctly or at all like it does in the video where nice explains it . I believe I have entered the code correctly .
is there something I am doing wrong?
20 Answers
Sam Chaudry
25,519 PointsHi Patrick if you could paste your code that would be great, so we can take a look
Patrick Oliver
413 Points<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-Type" content="text/html: charset=utf-8"/>
<title> Smells Like Bakin' Cupcake Company
<head>
<body>
<img src="img/logo.gif" alt="Smells Like Bakin">
<body>
<html>
Patrick Oliver
413 Pointsthere you go sorry tried pasting it before forgot the back ticks
Wayne Priestley
19,579 PointsHi Patrick,
You seem to be missing a closing tag.
When text is a grey colour you should double check it.
hope this helps. if you need another clue just ask.
Patrick Oliver
413 Pointsclosing tag? please clarify?
nick did not show this in the video
James Barnett
39,199 PointsTo follow up on what @Wayne said, check out this tutorial on HTML tags that should (hopefully) get you pointed in the right direction.
Patrick Oliver
413 Pointsok thanks James that worked I have changed the code to this but there still seems to be a problem. When I refresh the browser it just has text that says Smells Like Bakin but it does not show the image like it does in Nicks video.
here is the code with closing tags:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-Type" content="text/html: charset=utf-8"/>
<title> Smells Like Bakin' Cupcake Company </title>
</head>
<body>
<img src="img/logo.gif" alt="Smells Like Bakin">
</body>
</html>
James Barnett
39,199 PointsPatrick Oliver - You've fixed your issue with the title tag.
In regard to your to getting your image to show up, the 2 most common mistakes when images are not showing up are a typo with the file names or using the wrong file path, so triple check the file name and path.
Here's a tutorial on file paths that should get you going.
Patrick Oliver
413 Pointswhen I open the image file in my documents I get this opening in internet explorer :
C:\Users\Single Account\AppData\Local\Temp\Temp1_websitewaters-island01-stage02.zip\img\logo.gif
I have tried using a relative path and an absolute path and neither has worked. It is spelled correctly according to everything I have looked at.
not sure what is wrong.
Patrick Oliver
413 PointsI guess I will just treat this as a learning experience and keep moving forward with the videos without that image file working correctly. And just have an unfinished web site and learn what I can and keep going. thanks for everyones help don't know what I was doing wrong.
Erica Casey
1,271 PointsHey Patrick! I was having this exact same problem and could not figure it out. When I added in the file path from where I saved my html doc to the img file, it worked! So here's what mine looks like img src="websitewaters-island01-stage01/websitewaters-island01-stage01/img/logo.gif" alt="Smells like Bakin" Hope that's helpful and that I did it right!
Patrick Oliver
413 Pointsthanks Erica
that makes sense. I have been trying that did yours have any zip/ in the file path? did you edit or delete any part of where it was saved in your html doc before adding it in sublime text?
Patrick Oliver
413 PointsI have tried your example looks like this: img src="websitewaters-island01-stage02.zip\img\logo.gif" alt= "Smells Like Bakin"
I used the download files in stage 2 you seem to use the download files in stage one. I have also tried those files using exactly what you have and it still does not work . hmmmmmm
Erica Casey
1,271 PointsI'm so brand new to this I'm not exactly sure how to answer anything! :) No I don't have zip in any of the path but I extracted the exercise files. I just typed the path from where I saved the index file to where the img file is. So this is my line of code without the <'s:
img src="websitewaters-island01-stage01/websitewaters-island01-stage01/img/logo.gif" alt="Smells like Bakin"
My index file is in a folder I made for the Build a Simple Website project. So this is what the path looks like to get from index to img file:
(index is in the Build a Simple Website folder)>websitewaters-island01-stage01(this is also in the Build a Simple Website folder)>websitewaters-island01-stage01 (I'm sure this is redundant but that's what happened when I extracted the folder-honestly I'm afraid to change anything because then my images wouldn't work!)>img>logo.gif.
I wish I knew how to speak the language better and hopefully my way isn't completely flawed, but I literally just started on learning all this last night. I ran across your thread because I was looking for answer to the same problem. :)
Patrick Oliver
413 Pointsthanks Erica so much for your reply I have been trying to fix this all day and can't seem to get it to get fixed so the image shows up. I have moved on with out the image working correctly and will just keep learning and chalk this up to experience .
thanks for all your help Erica and everyone else.
my process went like this btw when I opened up img file in my downloads and then the logo it opened up the file in internet explorer as this: C:\Users\Single Account\AppData\Local\Temp\Temp1_websitewaters-island01-stage02.zip\img\logo.gif
so you are saying your index.html folder you have created for this project is inside of the build a simple website folder download materials for this project Erica?
maybe that is my mistake?
Erica Casey
1,271 PointsSo the way I did it before probably would have made a huge mess. I probably should have just made sure I put the index.html folder in the folder where the img folder is so that there isn't a crazy path that wouldn't even work when I launched the website since it's pointing to stuff on my computer. Try doing that, if it makes sense and see if it works.
James Barnett
39,199 Points> I wish I knew how to speak the language better and hopefully my way isn't completely flawed, but I literally just started on learning all this last night.
I'd check out this tutorial, it covers how to organize your file as well as how file paths work and the differences between absolute and relative paths.
Nick Pettit
Treehouse TeacherThe code in the videos should work if it's typed correctly and the files are in the exact same locations.
Something else that could be an issue is the incorrect use of slashes. I'm seeing a lot of backslashes in this thread. File paths on web pages should always use forward slashes. They are not always interchangeable and they can cause errors. Here's what I mean:
<!-- This is incorrect because it uses a backslash. -->
<img src="img\logo.gif" alt="Smells like Bakin">
<!-- This is correct because it uses a forward slash. -->
<img src="img/logo.gif" alt="Smells like Bakin">
Erica Casey
1,271 PointsThanks for the reply, Nick. While I guess what I had technically worked since it was all local, as I went on to the HTML Deep Dive this has all made a lot more sense for me and I think I understand how to do it correctly now. Hoping I didn't end up confusing Patrick more with my replies. :) Thanks again.
Patrick Oliver
413 Pointsthanks for the help Nick and Erica and your replies. And your replies were quite helpful and clear Erica thanks for posting them