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 How to Make a Website Creating HTML Content Add Image Gallery Content

Images do not show up in new page/tab.

Stage 3, Creating HTML Content.

I followed the video and at the end you should have images with comments that are both hyperlinked that open a new page with just the photo. However, my code is line-for-line with the video as instructed, and when you click on either the image or the comment, it downloads a file instead and asks what program I'd like to open it with.

Any thoughts? Anyone else running into this? Thanks!

4 Answers

So thank you both for the replies, however it seems to be an issue with the files I uploaded to take the place of the pictures. I tested by cutting out the added 4 photos and changing it back to the files given, testing with numbers-01.jpg, and it worked flawlessly the first time and opened into a new page. I'm going to run a few test on file names, but the photos I uploaded were already .jpg, so I'm still not sure what the issue with them is. I do know that when you are in Workspace and select them, they do not have a preview that is view able so that might be a clue to part of the issue.

But bottom line, use the photos they supply for your first run through, as uploading your own does not appear to work properly. (Tested on Google Chrome and Mozilla Firefox.)

Edit: After checking the photos and re-uploading them, they no longer appear as "Ahri1" but "Ahri1.jpg" now, and appear to be working. If you upload your own photos, make sure that when they show up in your img file in Workspace that they have a .jpg or .png file extension!

Vrund Patel
Vrund Patel
11,994 Points

I think you need to change the settings in the browser. It is a common problem with viewing/downloading documents. Therefore, I assume a bit of changes in the settings might do the job.

So it is an issue with Chrome then, and not the code? Do you know where I would find the setting for this in Chrome's settings?

Vrund Patel
Vrund Patel
11,994 Points

Can you paste your code here?

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Jake Conlee | Gamer</title> </head> <body> <header> <a href="index.html"> <h1>Jake Conlee</h1> <h2>Gamer</h2> </a> <nav> <ul> <li><a href="index.html">Porfolio</a></li> <li><a href="about.html">About</a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> <section> <ul> <li> <a href="img/Ahri0"> <img src="img/Ahri0" alt""> <p>Ahri Base</p> </a> </li> </ul> </section> <footer> <p>Ā© 2015 Jake Conlee.</p> </footer> </body> </html>

4 images are missing, but it won't let me post them, too long. They are copy-pastes of the one shown though.

Matthew Davies
Matthew Davies
1,542 Points

I'm doing this on windows and found that changing the / to a \ in the image path fixed the link. So the that line of code went from <img src="img/numbers-01.jpg" alt=""> to <img src="img\numbers-01.jpg" alt="">