I cannot get an image to display

Help
1

Hi, I’m using Jekyll and created a post in the _posts folder. The post is an HTML file and saved in the “_posts” folder
I made sure that I did a Jekyll Build command and a Jekyll server command. Then I went to
http://localhost:4000/2017/08/01/bills-lindyhike.html I made sure that the jpg file is in the same folder as the HTML post file. No matter what I do, the link to the photo is always broken. What am I missing here? How do I install photos into the Jekyll Blogs?

Here is the HTML note that I tried.

Hike to Lindy Peak

–>

Does anyone out there see what I’m doing wrong?

2

If you just put an image into the _posts folder, I really don’t know what would happen to it, my guess is that it wouldn’t do anything, jekyll is only processing html or md files that are named with the date.

Normally I would put an image into /assets/img in the root, then reference that path in the img tag like

<img src="{{site.baseurl}}/assets/img/my-image.jpg">

Though you could put the image in other places, I have read about some people trying to keep the post together with its images, but I don’t remember how they did it. My sites are not post oriented so I just pile them all into assets/img and occasionally use sub folders in there to separate certain types of images as needed.

3 Likes
3

I keep getting the following messages that the jpg is not found. All I
did was create an html post within the * _post* folder and then put the
photo in the same folder.

image.png998×429 40.7 KB

Below is my HTML file:

4

As @rdyar mentioned above, Jekyll by default doesn’t copy assets placed in the _posts folder… that’s why your image is missing after build.

You’ll need to place it in another folder (not something with an _ underscore). The suggestion above is a good one. Create /assets/images/ in the root of your project and place the image there.

Then in your post you can reference it with either HTML or Markdown

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

or

<img src="/assets/images/your-image.jpg" alt="">

And if you’re not hosting with GitHub Pages you can use the Jekyll Post Files plugin which allows you to organize your images alongside your posts.

1 Like
5

Hi,

​

helpxx.jpg925×545 195 KB

6

Don’t use underscores in your folder names. Jekyll ignores them.

Rename _assets/_images/ to assets/images and adjust the source in <img> to do the same.

Then when you run jekyll build or jekyll serve you should see your image at _site/assets/images/lindyhike.jpg.

1 Like
7

Thanks! This solved for loading images into posts for me.

8

2 years later there is still no way to keep images with a post?

1 Like
9

If you can install plugins there’s one that lets you store images and other files in the same folder as your posts. It’s been around for years…

1 Like
10

just for clarification: Jekyll does not ignore the underscores, it ignores all content (files or folders) beginning with an underscore.
In all probability everyone knew that already :).

1 Like
11

I spend probably some hours on this…
At the end, what for me is this solution: