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
maxmenning
183 PointsBroken images in Workspaces.
Hi, I'm new to this site. I'm having this exact issue: https://teamtreehouse.com/forum/cant-view-images However, there doesn't appear to be any fix I can do myself. I'm in the segment: /how-to-make-a-website/creating-html-content/build-the-footer. The culprits seem to be the Facebook and Twitter logos (two instances of each), which are .png files. I've tried downloading the .zip file several times now, dragging the problematic files into Workspaces, and then dragging the same four logo files into the folder labelled "img." Before dragging them into the img folder they show a preview, but afterwards they do not. If I close Workspaces and open it again, the problematic files have disappeared. After dragging the files to workspaces again, if I rename them (e.g. twitter-wrap.png to tw-wrap.png) before dragging them to the img folder, the problem is apparently solved. They still show a preview, and they remain there after closing. However, I then have a problem with the file name change in my code challenge. Any help would be appreciated.
2 Answers
Sarah Hoopes
6,304 PointsDownload the files and unzip them. Open your workspace and create a folder called img. Drag your unzipped files into the workspace. To do this, drag them into the lower left hand corner of the workspace (in the grey area). A box will appear that says 'Drop Files to Upload". Place your png files in the img folder. Always remember to save your workspace before closing.
Don't change the name of the file. Keeping it the way it is will make it easier to follow the lesson. Your code will need to link to those files and it won't work if the names don't match.
Also, make sure your img folder didn't get placed inside another folder. Don't put it inside the CSS folder, for example. This will cause problems. It should stand alone .
Wayne Priestley
19,579 PointsHi Max,
Have you tried uploading the images using the file upload in the workspace menu bar, make sure the files are unzipped when you do this.
Hope this helps.
maxmenning
183 PointsHi, Wayne.
I tried your suggestion from the file menu and by right-clicking in the sidebar. Unfortunately, neither of those did anything at all. I guess I don't know if I'm doing something wrong there, but there wasn't any prompt to select a file.
Uploading all the files again (by dragging) and putting them into a new folder called "img2" seems to have fixed everything. I changed my code to reflect this, and everything worked perfectly in the preview. I then saved, closed the Workspaces window, opened it again, and everything was still there in the new "img2" folder. My code still worked. This is how it should function.
However, the folder has to be named "img", so I changed it. I went right back to having the same problems as before. Some of the images apparently just break for me in Workspaces under the folder name "img". Completely separate from saving my code, these broken images also disappear from the Workspaces "img" folder upon closing. I don't understand why this is, but I've tried to be descriptive, and I hope it helps someone. I'm only on the free trial right now, so this is all fine, but I wish I could've gotten further.
Thanks for the response.