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

Help attaching image

I am working on my personal website currently and I am having trouble adding an image. I don't know if its because im not pinpointing exactly what folder it may be in or not.

I am using notepad++. I created one folder to keep all my documents in for the website. It is called Portfolio Website.

The image im trying to (chanel.jpg) use and the webpage im trying to attatch it to( index.html)are not in subfolders so im not sure what im doing wrong. They are both in the same folder.

i typed in

<img src="img/chanel.jpg>

maybe its not working because the name of the folder everything is is is called. Portfolio Website?

I know this may be slightly vague but any help is appreciated. -Nel

10 Answers

You said the image is not in a folder but you declared it in the img folder in your code. Make a folder called img inside the website folder. Then put the chanel.jpg image inside of it and it should work.

Please post your code so I can take a look.

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Chanel Allen | Front End Developer </title> <link rel="stylesheet" href="css/main.css" > </head> <body> <div class= "wrapper"> <header> <span>Conquering front end development, one declaration at a time</span> <h1>Chanel K. Allen</h4> </header> <nav> <ul> <li>Portfolio</li> <li>About</li> <li>Contact</li> </ul> </nav> </div>

    <section>
        <img src="img/chanel.jpg">
    </section>

    <section>
        <h3>Portfolio</h3>
        <ul>
            <li>picture 1</li>
            <li>picture 2</li>
            <li>picture 3</li>
        </ul>
    </section> 

    <section>
        <h3> About Me</h3> 
        <p>Hello, I'm Chanel Allen and welcome to my portfolio. I am a self taught front end web developer
         based in Washington DC. I am looking for a job as full-time junior
         front end developer.</p>
    </section>

    <section>
    <h3>Contact</h3>
    <p> contact form goes here</p>
    </section>
    <footer>
        <p>&copy;2014 Chanel Allen</p>

    </footer>
</body> 

</html>

ok. Im going to try it now

Let me know if it works.

it still isn't working. im not sure what im doing wrong. I created a folder named img and put the picture inside.

Can you screenshot what your folder looks like?

Also could the file be a png by any chance?

Have you pressed save?

It looks right to me so I am not 100% sure.

http://feed4.tinypic.com/rss.php?u=8oVjPCounM%2FAQjgXXRqq%2FA%3D%3D

I hope i done this right. ive never screenshot from anything other then a phone. This is a serious learning curve im hitting.

I looked at the screenshot. It looks like everything is set up fine. Are you 100% sure the file is chanel.jpg and not chanel.png or something else?

Hopefully someone else sees this. I am stumped. Everything looks right.

i will recheck that. and yes im just as confused. I got a new computer with windows 8 so everything is all over the place and im trying to figure out why its set up the way it is. LOL i will go back through and see about the image. it must be something related to that.

I put my whole file into workspaces and everything shows up so i guess ill just use workspace. When i used notepad++ i was able to put the file on the html page the only thing that happens is that picture does'nt show. its just a box with a picture of a blank file.