使用主题的Github页面上的GIF [英] Gif on Github pages using a theme

问题描述

我正在尝试获取要在我的GitHub页面上呈现的gif。该页面使用了Jekyll主题，并且当前正在呈现我的readme.md文件。由于某种原因，我可以在自述页面上呈现我的gif：https://github.com/JpBongiovanni/PythonFunctionLibrary/blob/main/README.md

但不是我的Jekyll页面：https://jpbongiovanni.github.io/PythonFunctionLibrary/

下面的代码为自述文件呈现了正确的礼物，但不是Jekyll。

![zigzag](/PythonFunctionLibrary/movies/zigzag.gif)

我错过了什么？

谢谢！

推荐答案

2要编辑的内容

问题是，您没有在_config.yml文件中设置任何内容，这就是为什么URL不完整进行了一些故障排除。您需要做两件事！

1. URL设置
2. 图像标记设置

URL设置

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

#_config.yml

url: 'https://jpbongiovanni.github.io/' # your main domain
baseurl: 'PythonFunctionLibrary/' # if you're using custom domain keep this blank example: baseurl: ''

theme: jekyll-theme-hacker

现在我们已设置好URL设置，现在编辑readme.md文件中的锚定标记或链接标记。

图像标记设置

让我们深入了解一下您的图像标记，其格式如下：

![zigzag](./movies/zigzag.gif)

编辑为此：

<img src="{{site.baseurl | prepend: site.url}}movies/zigzag.gif" alt="zigzag" />

<!-- OR -->

<img src="{{ "movies/zigzag.gif" | prepend: site.baseurl | prepend: site.url}}" alt="zigzag" />

此处：

• {{.}}是一种流畅的过滤语法
• site.url正在从_config.yml文件中收集URL
• site.baseurl正在收集baseurl以将其添加到GitHub页面的url之后
• **|Prepend：**为过滤，表示site.baseurl会加在site.baseurl前面。 此标记将呈现以下内容：

<img src="https://jpbongiovanni.github.io/PythonFunctionLibrary/movies/zigzag.gif" alt="zigzag" />

就是这样。我想这会帮助你把工作做得完美…

JEKYLING快乐

这篇关于使用主题的Github页面上的GIF的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！