How to add an image in Jekyll post

Help
1

I need to add an Image in a Jekyll post.

I have created an image folder in the root directory called ‘images’.

I have the post in markdown as follows:

---
layout: post
title:  "Restraunt"
date:   2023-08-02 01:05:22 -0400
categories: jekyll update
---

PARAGRAPH 01

![Image](/images/IMG_20231109_171049.jpg)

I am able to see the post once I run the command bundle exec jekyll serve . This opens the post and I am able to see the image.

But when I deploy the code and visit the site I get the following result:

I look in the logs and see the following error:

Failed to load resource: the server responded with a status of 404 ()

jekyll-err-03
jekyll-err-03934×863 39.6 KB

I inspect the error is due to the image unable to load to the server or the server is unable to find the image file.

Any help or comment will be highly appreciated.

2

I did make a assets/image folder in the root directory. Then I placed the image in there.

I still see the same error.

3

Is your “root” within the Jekyll file hierarchy?

4

Try setting baseurl in _config.yml as per docs.

5

you probably need to set the baseurl in the config file and then ALSO prepend the image url with the baseurl by either using site.baseurl or by using the relative url filter like {{ "/assets/style.css" | relative_url }}.

So on your post reference an image as either of these - this is assuming you are using GH for hosting which puts your repo in a sub folder on the server which causes this issue:

![Image]({{ site.baseurl }}/images/IMG_20231109_171049.jpg)

or

![Image]({{"/images/IMG_20231109_171049.jpg", | relative_url }}) <<-- I’m not positive I have this formatted correctly.

more info:

6

Thank you so much @rdyar

I followed the link you presented and I applied the baseurl method.

It works perfectly.