Github pages with Jekyll not showing images in .md post

I created a simple blog with Jekyll/Github Pages. The directory tree is organized like this:

-_posts
  |_ post1.md
- assets
  |_ Untitled.png
  |_ Untitled1.png
- _config.yml
- index.md

In post1.md I embed images by:

![Untitled](/assets/Untitled.png)
![Untitled1](/assets/Untitled1.png)

The Github preview works just fine, but in my website it can’t show up images. Please help me with this problem, i spent 2 days trying to fix it but still not working.

The problem are the absolute paths (starting with /). The URL for your page over all is something like https://username.github.io/repo/, so the “assets” directory will appear at https://username.github.io/repo/assets/. An absolute path is resolved relative to just the host, so with those links the browser looks for e.g. https://username.github.io/assets/Untitled.png.

To resolve this you either need to use a relative path (I’d prefer this, because it works wherever you deploy the Jekyll page) or include the repository name in the absolute path.

Thanks for your support. But when I use relative path (“assets/Untitled.png” instead of “/assets/Untitled.png”) it doesn’t work both Github Preview and my webpages. I’ve tried to replace with permalink, the Github Preview works but my webpages still not showing images. I think maybe I made a mistake somewhere?

How the relative path should look depends on the path under which your post ends up. You might need to go up a few levels, e.g. if the path for your post is

/repo/posts/2021/09/03/hello-world.html

a relative path to go to /repo/assets/picture.png would have to look like this:

../../../../assets/picture.png

.. is the parent directory.

can you give us the link of your repo? just to see everything here, thanks