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
Jason Causey
2,686 PointsI am trying to build a website using notepad ++ but I cant figure out how to upload my images to the document.
Just trying to build a website but cant get the image location right I guess. All I see is the broken image when I run the document on the browser. How do I place the right image path?? I use <img src="image.jpg' />
3 Answers
Ryan Bent
6,433 PointsMy recommendation is to take your images and put them in a folder called "img". Place that folder in your websited folder. That way when your browser goes to look for your images it will find them. ex <img src="img/exactfilenameofpic.png, jpeg or whatever you call it.
Hope this helps
Jason Causey
2,686 PointsI have a folder , which is placed in the documents, called Future of Me Website. Inside that folder I have an images folder with the images I am trying to use. Also inside the Future of Me Website folder I have the index.html file.
I can get pics from the internet to work but cant use my own... :(
Jason Causey
2,686 Points<img src="images/IMG_0678.JPG" />
Heres the code I use inside the html document.
Zack Taylor
9,021 PointsHi Jason ....
Right lets see what I can do to help. First of all your need to structure the folders. Your main folder is ' Future of Me Website '. Now create two other folders inside '' Future of Me Website folder. Name these 'Img' and 'css'. ( This file structure will be very simple )
Hierarchy view ' Future of Me Website ' <--- Main folder || ================== [ 'Img' ] < ---- folder 1: Place an img in here. || ==================== [ 'css' ] <---- folder 2 || [ 'Index.html' ] <--- This file sits in the Future of Me website folder.
Now in your index.html we have to set up the minimum html5 document standards .... check below
'''
<html> <head> <meta charset="UTF-8"> <title> Future of Me | Jason Causey </title> </head>
<body>
// Below is adding an img tag. Can you see the part where it says img src="img/filename.gif" . The img/ <-- represents the img folder. [folder1]. filename.gif is your img.
<img src="img/filename.gif" alt="filename">
</body>
</html>
'''
Problems your might have.... 80% of the time its because the file structure is not correct. Also check to see if all files are correct. Example.... you might be trying to put an extention of .jpg but your image is a .png. Check to see if all your " " [tags] are closed off. If your really in doubt check your website in different browsers and try and use the developer console to check to see if your file is using the correct code.
Good luck my friend. Its probably a very stupid mistake that your not noticeing. Im sure your find it and start kicking yourself once found. Have a good day and keep coding ;)
p.s) I hope this makes sense as in my eyes it does but i'm the one writing it and following my way of doing things. If at a last resort. Go back to treehouse videos and watch it again or go to http://www.w3schools.com/ for reference.
David Tonge
Courses Plus Student 45,640 PointsDavid Tonge
Courses Plus Student 45,640 Pointspost the code you're using for your
HTML <img src="#" />links