erha
erha

Reputation: 61

Insert picture to Github page?

How do you insert an image to the Github README, so that it shows up when loading a Github page that uses the README as the source?

I have written this code in my README:

<img src="https://github.com/my_username/xxx/blob/master/image.jpeg" width="1000"/>

When I look at the README in the repository, the image shows up. However, when I open my Github page (which uses the Jekyll theme), the picture shows up as a broken image symbol.

I would much appreciate some guidance! Thanks :)

Upvotes: 5

Views: 3366

Answers (2)

Facundo
Facundo

Reputation: 13

i resolved it by importing the img

import img from './assets/img.png'

the you use it normally:

<img src={img} />

it worked for me

Upvotes: 0

VonC
VonC

Reputation: 1325295

As shown here, try instead to place your image in another folder (not something with an _ underscore). Create /assets/images/ in the root of your project and place the image there.

Then in your README.md, you can reference it with either HTML or Markdown

![image](/assets/images/your-image.jpg)

(to avoid putting all images in the same folder, see the jekyll-postfiles plugin)

Check that is displays in both GitHub and GitHub pages after Jekyll processed your project.

Upvotes: 4

Related Questions