Image files do not load in GitHub repository - image

My GitHub repo does not load images (all of them .png files). This includes the images in my README that I have added using relative paths from the repo. Most images are a few kB in size.
I have checked to see if there are any issues with my relative image paths. Some answers to other questions suggested it could be an issue with the case sensitivity. I have checked all of this and it doesn't change.
What's strange is that I have had this repo for months, and did not have this issue until the last month or so. Images used to load correctly and I haven't changed any paths to the images in the README.
So why are the images not loading in my GitHub repo?

I see the images on that link.

Related

What is the best way to store project's images while using Github

I'm wondering what is the best way to store project's images while I'm using Github
If I'm storing images on Github the repo becomes giant and hard to clone.
I would use CDN to store images but the architecture looks a bit weird, since I can't have the images in the git repo, and it's stored outside.
What would be the best way to store the project's images along with the code?

Github pages jekyll images not loading

I'm trying to get my personal blog up and running on github pages, and for some reason I can't get any of the pictures to display on Github, even though it works locally.
Website: https://ryanstull.github.io/
Code: https://github.com/ryanstull/ryanstull.github.io
I tried suggestions for other similar questions, such as double checking capitalization and moving the images out of the assets folder into their own folder, but neither of those seems to do anything.
When I go the a url where I'm expecting a picture to be, https://ryanstull.github.io/images/posts/classhierarchy.png for example. I just get this error message, about the image containing errors, even though it works locally.
Any advice would be much appreciated.
So it turns out the problem was github pages and git LFS don't work together, and I was storing my pictures with git LFS.
https://zhouchenzc0824.github.io/2017/05/GitHub-pages-incompatibility-with-Git-LFS/
I was able to fix it by using a hard-coded link to the LFS's binary as suggested by this comment https://github.com/git-lfs/git-lfs/issues/1342#issuecomment-334317440
For example, the link that I used for the picture that I posted in the question is https://media.githubusercontent.com/media/ryanstull/ryanstull.github.io/master/images/posts/classhierarchy.png?raw=true

Why are all images broken on my Github Pages?

I'm a new user of Git/Github and I'm traying to use Gitghub Pages for my project but for some reason the images are all broken. I was looking for solution but I did find no one with same issue :(
Github Pages: https://dannotfound.github.io/Alessandra/
Github Repository: https://github.com/dannotfound/Alessandra
Someone knows why is it happening or how to fix it?
Github Pages uses Jekyll and Jekyll will ignore files and directories with underscores. This allows you to have files and directories within your repository yet are not exposed via the web server. Such as _config.yml and _includes/.
The fix is to rename _img to img and change your links.

Images works locally, but not on github pages

I have problem with images on my page ;
github link
Locally i see everything, images works, but when i published it on ghp, images have disappeared with 404 error. I have no idea why it's not working...
I read old questions and i don't find any solution for that.
Okay, I found a problem. I published branch master/docs, so github pages omitted the whole src directory, so he had no way to see the images. I fixed it with publishing whole branch master.

Add images to README.md on BitBucket

Can I somehow reference the image from readme.md file so that it renders when viewed in BitBucket directly from project (without hosting the image elsewhere on web) ?
UPDATE:
The issue was resolved so it's working now as it was explained in the question:
I have stored readme.md file and an image file in a BitBucket repo as follows:
readme.md
images/
scheme.jpg
I reference the image from readme.md as follows:
![Scheme](images/scheme.jpg)
Update 2016-12-14
This is fixed now, please see the resolved status of this issue: https://bitbucket.org/site/master/issues/6315/relative-urls-in-readmemd-files-only-work
You can now use
![Scheme](images/scheme.jpg)
to refer to images in your repo using relative links.
Old Answer
At the moment, this is not possible. BitBucket does not support relative links to images in markdown.
The following issue in BitBucket's issue tracker has more info on this, its current status (2015-02-27) is open: https://bitbucket.org/site/master/issue/6315/relative-urls-in-readmemd-files-only-work
The BitBucket team have indicated on the ticket that they intend to fix this "in the coming quarters" (comment from 2014-12-19: https://bitbucket.org/site/master/issue/6315/relative-urls-in-readmemd-files-only-work#comment-14400835).
The ticket contains a couple of (ugly) workarounds, using a combination of two links, where one works locally, and one on the web site (https://bitbucket.org/site/master/issue/6315/relative-urls-in-readmemd-files-only-work#comment-15852315) as well as some other possible solutions, none of which are particularly nice or reliable.
Update: please see the accepted answer as the issue is now fixed and this workaround is obsolete.
According to Altassian it's not supported so you need to use absolute URLs. You can use branch names instead of commit hash to allow the link to be updated if you change the image in later commits.
For example, here is taking the /path/to/image.jpg, from the master branch:
[Your Link Text](https://bitbucket.org/username/reponame/raw/master/path/to/image.jpg)
Don't use any spaces in image or directory names. For example:
![](images/app screens/screen 10.png)
should become
Sub-folders can be used for other md documents. Again, I recommend replacing spacing with dashed even in folders that only contain md or other files.
Not sure about this, but the starting document might need to be named README.md, and images might need to be in a top-level folder named "images" in the same directory as the README.md file.
Finally, please refresh your page when you see a broken image link. I noticed some images would load and others were not even though they were in the same format.
For more Info, please, have a look at Atlassian: Add images to a wiki page and russells-rocksauce answer in bitbucket issues forum
It's very simple
Just upload your image to the repository root, and link to the filename without any path, like so:
![your_image_name](your_image_name.png)

Resources