带有 Jekyll 的 Github 页面未在 .md 帖子中显示图像

Question

我用 Jekyll/Github Pages 创建了一个简单的博客。目录树是这样组织的：

• _posts
  • post1.md
• 资产
  • 无标题.png
  • Untitled1.png
• _config.yml
• index.md

在 post1.md 中，我通过以下方式嵌入图像：

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

Github 预览工作正常，但在我的网站上无法显示图像。请帮我解决这个问题，我花了 2 天时间试图修复它但仍然无法正常工作。中的图像 Github preview 和 Show on website

Answer 1

要编辑的两件事

问题是，也许您没有在_config.yml 文件中设置 URL，这就是为什么不完整的 URL 会导致一些故障排除。你需要做两件事！

1. 网址设置
2. 图片标签设置

网址设置

在_config.yml 中只需添加 2 行：

#_config.yml

url: 'https://your-github-username.github.io/' # your main domain
baseurl: 'your-repo-name/' # if you're using custom domain keep this blank example: baseurl: ''

现在我们已经完成了 URL 设置，现在在 post1.md 文件中编辑锚标记或链接标记。

图片标签设置

让我们深入了解您的图像标签，它是降价格式，例如：

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

编辑成这个：

<img src="{{site.baseurl | prepend: site.url}}assets/Untitled.png" alt="Untitled" />

<!-- OR -->

<img src="{{ "/assets/Untitled.png" | prepend: site.baseurl | prepend: site.url}}" alt="Untitled" />

这里：

• {{...}} 是 Liquid 过滤器语法
• site.url 正在从 _config.yml 文件中收集 URL
• site.baseurl 正在收集 baseurl 以将其添加到 GitHub Pages 的 url 之后
• **| prepend: ** 是一个过滤器，这意味着 site.url 将被添加到 site.baseurl 之前。 这个标签将呈现这个：

<img src="https://your-github-username.github.io/your-repo-name/assets/Untitled.png" alt="Untitled" />

就是这样。我想这将有助于您完美地完成工作。事实上，这个答案已经由我在：https://stackoverflow.com/a/67733921/14387700

...

杰基林快乐