Some images aren't showing upon deployment

Hello all, I’m on break at work so it may be a few hours before I get back to any response. I appreciate any attention given here. I’m new to netlify/github and coding in general. I browsed the FAQs and found similar issues and tried to follow along their solutions. Havin a bit of a struggle. My homework was to make a portfolio and get it online with Netlify. I got it mostly there. The images on my home page don’t show up. It likely is the path but i can’t figure it out honestly. The sample projects have the images in them so it’s only my home page. There is 1 image by my introduction, and the 3 images for my previous stuff. It’s a fairly rough draft but I want to be able to show friends and all what i’ve been up to as well.

Pietro’s Portfolio (toledopietro.netlify.app)
git hub: peterpicklepiper/rep3 (github.com)

@petetoledo As you’ve already guessed, it does just appear that the paths to your images are incorrect:

Paths on the homepage that aren’t loading are:

c:\Users\Pete\OneDrive\barbershop\html5up-solid-state\images\shop.jpg
← This would only work if everyone visiting had a c: drive and had that image in the same location

../../../../Downloads/IMG_9436.jpg
← This is trying to “go back” more folders than the repository contains, it ends up being /Downloads/IMG_9436.jpg which doesn’t exist

/pic06.jpg
← This file doesn’t exist in the root (it’s in the /images/ folder)

../html5up-miniport/cream/html5up-astral/images/creamyy.jpg
← This folder doesn’t exist in the repository

To get the images working, you’ll just need to adjust the file path for any image you find isn’t loading, to point to where the image actually exists.

1 Like

Interesting, thank you very much. I will take a look at where i should have them and play around a bit. Thank you very much! Now I know what to look for

Pietro’s Portfolio (toledopietro.netlify.app)
git hub: peterpicklepiper/rep3 (github.com)

I have mostly fixed it thank you again! my images are all there, but along the way I broke the links and can’t figure how to make it work. it doesnt quite make sense. i have anchor tags on the image and the h3 so either one will take you to that page. I for the life of me can’t figure out what i’ve removed to make it dysfunctional. the 1st and 3rd image take you to the desired page, but the h3 no longer takes you to the same destination. for the 2nd image it no longer goes to the linked page, it just opens a smaller image. as far as i can tell the 3 projects have identical structure, so it may be something I did

@petetoledo The issue is as you’ve explained yourself, you’ve added some links, and you’ve pointed them to different destinations, in some instances you set the href to point to images:

For example that first one you’ve got a link wrapping the image that goes to:
../../../barbershop/html5up-solid-state/images/shop.jpg

While the link within the h3 goes to:
../../../barbershop/html5up-solid-state/index.html

I’m not sure why you’re putting ../../../ in front of your links, it’s a relative path that says “go up one directory, go up one directory, go up one directory”, except there quite simply isn’t anything three folders up within the repository.

You should probably use root relative links beginning with / for your own sanity.

See some explanations of different html file paths here:

1 Like