Images not displaying in Github Pages?

html image github github-pages

90,052

Solution 1

Nevermind, I solved it.

If anyone has the same problem.

GitHub Pages are case sensitive. Not only for folders, but also for image names.

Solution 2

As @dnivog mentioned, GitHub's servers take a little time to update files.

If nothing of the above addresses your situation, just check back in a little while. ⏳

Solution 3

Write what you see.

It is Screenshot2.png. With a lower-case png and a capital S at the start.

Solution 4

While hosting a website on Github,I faced the same issue.The image file was saved as an .jpg extension on my local(in small letters) and It was working fine. I pushed the same to github. That did not work.

I had to change the extension to .JPG (in caps)since it was the original extension of the image.Github Pages are case sensitive to the name of the files being uploaded.

Solution 5

Adding my two cents for googlers: Git Pages seem to ignore the directories starting with underscore, so make sure you don't have <a href="_images/whatever.jpg">.

View more solutions

90,052

Carlton

If there is anything you think you’re not very good at, find a way to work on it, even if only for a while. It may feel stressful — and it is, reason why we often times avoid it — but a little bit of that healthy stress will serve as catalyst for growth. It will challenge yourself and make you rise to the occasion. -Some random dude that codes. Stack Overflow Isn’t Very Welcoming. It’s Time for That to Change. Now, this is a story all about how My life got flipped-turned upside down And I'd like to take a minute Just sit right there I'll tell you how I became the programmer of a town called Bel Air In west Sweden born and raised On the computer was where I spent most of my days codin' out testin' debuggin' all cool And all runnin some code outside of the school When a couple of bugs who were up to no good Started making trouble in my program-hood I got one little exception and my mom got scared She said 'You're movin' with your computer to Bel Air' I begged and pleaded with her day after day But she packed my laptop case and sent me on my way She gave me a kiss and then she gave me my ticket. I put my Spotify on and said, 'I might as well kick it'. First class, yo this is bad Drinking coffe out of a champagne glass. Is this what the programmers of Bel-Air living like? Hmmmmm this might be alright. But wait I hear they're prissy, bourgeois, all that Is this the type of place that they just send this cool cat? I don't think so I'll see when I get there I hope they're prepared for the programmer of Bel-Air Well, the plane landed and when I came out There was a dude who looked like a cop standing there with my name out I ain't trying to get arrested yet I just got here I sprang with the quickness like lightning, disappeared I whistled for a cab and when it came near The license plate said fresh and it had dice in the mirror If anything I could say that this cab was rare But I thought 'Nah, forget it' - 'Yo, holmes to Bel Air' I pulled up to the office about 7 or 8 And I yelled to the cabbie 'Yo holmes smell ya later' I looked at my kingdom I was finally there To sit on my throne as the Programmer of Bel Air

Updated on March 30, 2022

Comments

Carlton about 2 years
I added a project site to my Github project. But some photos are not displaying in the site.

Img code:
```
<img src="img/screenshot2.PNG" class="img-responsive" alt=""> </div>
```
folder structure (img is a folder):
```
img
    Screenshot2.png
index.html
```
I tried with .png and .PNG (some earlier SO answers suggested it) and none of them work

Any solutions?
- Ciro Santilli OurBigBook.com almost 7 years
  
  stackoverflow.com/questions/26196788/…
dnivog over 5 years

In my case, it worked after small delay. I assume that github hosting server took some time to update files.
Saeed Zhiany over 5 years

Welcome to SO, this answer can not solve the question, already he use th src in his image tag and the problem still remains, please read question more carefully and then try to give a useful answer.
Rocky Kev over 4 years

This was my fix as well. I renamed everything using snake-case, and lowercase, to avoid any potential unknowns. Images are now working.
Rithik Banerjee almost 4 years

Great research bro! Indeed
TheUnKnown almost 3 years

Changing .png to .PNG wouldn't solve this issue.
ow3n over 2 years

+1 by the time I scrolled past all the comments from those learning the web is case-sensitive I had started to wonder if the reason github pages can't find an image was because of that underscore in my path.
Linje about 2 years

I removed the '/' at the beginning, it solved my problem.