How to Add An External Image to A Github post - github

I want to add an image which is hosted on an external source to Github, but I see only link when I confirm it to be posted.
![Image](https://ibb.co/kOnOrb)
I use this format but it does not work. I click on the link that is created and I see the message Non-Image content-type returned.

The problem was, the link you provided wasn't the image itself. It was the link to a website that contained the image.
By clicking on the image and copying the adress of the image you get the url of the actual image.
This should work for you:
![Image](https://image.ibb.co/g0SdPw/Screenshot_from_2018_01_05_11_14_40.png)

Related

Add images on readme page

Recently I found out about the "secret" readme page on Github and I added some information including a few images.
The problem I face is that my images won't appear.
And this is the root.
And lastly my markup for the images
Use this instead:
[![Twitter](https://raw.githubusercontent.com/username/username/master/images/twitter.png)](Twitter link here)
Replace username/username with your actual username or user/repo for a repository readme, and add your Twitter link where indicated.
Same thing for other images, this way when users click on the image, they will directed to your twitter link

Unable to load images from GitHub in markdown file

I am adding an image in markdown which is hosted on GitHub.
![alt-text](https://github.com/neutraltone/awesome-stock-resources/blob/master/img/splash.jpg)
When I run the docusaurus server using npm start it doesn't load the image for me but returns 404 Not Found.
By visiting the image URL, you can see the hosted image is present.
Any ideas on how to fix this? I'm on Docusaurus 1.14.
Thank you
This is not a Docusaurus issue.
The image URL is a GitHub page containing the image, of HTML type, not an image file. You can obtain the image URL by right clicking and getting the source. Try this - https://raw.githubusercontent.com/neutraltone/awesome-stock-resources/master/img/splash.jpg
Use this so that your image will display
![alt-text](https://github.com/neutraltone/awesome-stock-resources/blob/master/img/splash.jpg?raw=true)

Get Image from Github repo using GraphQL [Javascript]

I want to get image from a github repository and show it in my website.
Say, I have a image in my github-repo called banner.png. I have been successful at getting the content of README.md file which is a plain text. But images are binary thus I don't know how to get them (or just a url to that image) to use in img tag. I've searched and the blob does have a commitUrl but I don't know what that is for. I've tried using as the src for img but it doesn't work. I've even tried visiting that url but it just give a 404 not found.
If your repo is public, you can use a free hosting solution such as https://www.jsdelivr.com which can serve the file from Github (https://www.jsdelivr.com/features#gh) with the right content-type. You just have to build the url according to :
https://cdn.jsdelivr.net/gh/<user>/<repo>#<branch>/path/to/file.png
A few example :
https://cdn.jsdelivr.net/gh/bertrandmartel/newhaven-oled-dk51#master/img/newhaven-dk51.jpg
https://cdn.jsdelivr.net/gh/bertrandmartel/websocket-java#master/exemples/readme_images/clientSide.png
https://cdn.jsdelivr.net/gh/bertrandmartel/fritzing-parts#master/metec-braille-line-20-cell/metec-braille-line-20-cell.svg

After uploading an image to google cloud, how can I get a link to that image?

After uploading an image, I get back metadata that has a mediaDownloadLink that will download the file when accessed. Is there a way to get a link that will display the image in the browser without downloading it?
In general, any object you set to be publicly accessible (which presumably you wanted to do to use it to host images on a website), you can then access with https://storage.googleapis.com/<bucket>/<object>. You can see this link also if you go to the cloud console and make an object publicly viewable and look for the Public link you can click.
If you have problems with the link downloading instead of displaying by itself in a browser, you may need to make sure the content-type header is set correctly; for example if using ByteArrayContent to upload data using the Java API, you'll want to set a string like "image/jpeg" in its constructor for "type".

How to make dynamic github badges, that is, images in README which change state?

How do you add a "badge" in GitHub README so that it is dynamic? By "badge", I mean
The question is even if one puts a URL in GitHub README which maps to a server returning an svg/png, how does it update automatically on GitHub README page?
As an example if you visit the link
, you'd see the updated status of the issue (which is closed), but my GitHub README page still shows outdated badge, that is, shows the issue being open.
What is an example server code (say in golang) which can render github badges dynamically?
It's just an image at a URL. It's up to the server (your example looks like Jenkins) to decide what image to provide.