如何在jekyll中添加脚本标签？

Question

Jekyll 是一个简单的、博客感知的静态站点生成器，适用于个人、项目，我如何在这样的 ruby 项目中添加脚本标签。

我的index.html 看起来像这样：

---
layout: default
---

<div class="home">

  <h1 class="page-heading">Posts</h1>

  <ul class="post-list">
    {% for post in site.posts %}
      <li>
        <span class="post-meta">{{ post.date | date: "%b %-d, %Y" }}</span>

        <h2>
          <a class="post-link" href="{{ post.url | prepend: site.baseurl }}">{{ post.title }}</a>
        </h2>
      </li>
    {% endfor %}
  </ul>

  <p class="rss-subscribe">subscribe <a href="{{ "/feed.xml" | prepend: site.baseurl }}">via RSS</a></p>

</div>

文件夹结构也由文件和文件夹组成，如下所示：

about.md  _config.yml  css  feed.xml  _includes  index.html  _layouts  _posts  _sass  _site

我正在尝试探索静态网页的 jekyll 平台。

Answer 1

第1步：制作脚本文件。

照常创建脚本 (

.js

) 文件。

您可能希望保存在适当的文件夹中，例如：

../assets/js/some-script.js

如果没有，您可能需要创建

/assets/

文件夹。

不要在文件夹名称前面使用下划线 (

_

)，然后 Jekyll 会简单地将该文件夹和内容复制到“_site”的构建中作为静态资产。

第 2 步：在 html 中调用/引用脚本。

然后按照你想要的方式称呼它，例如：

...<script src="{{ base.url | prepend: site.url }}/assets/some-script.js"></script>...

.

如果您希望脚本在每个页面上可用，请将调用放入您的

default.html

布局文件中。然后，使用该 default.html 布局的每个页面都将调用该脚本。该布局文件可以在

_layouts/default.html

找到。

如果您只想在当前页面上使用它，只需在

some-page.md

markdown 中以相同的方式调用它即可。

如果您只想在它运行时调用它，并且不想在开发时调用它（例如，谷歌分析脚本），则将调用包装在 if 语句中，如下所示：

{% if site.environment == "production" %}<script src="//localhost:35729/livereload.js"></script>{% endif %}

希望这有帮助。

Answer 2

您可以将

<script>

标签添加到文件中：

_includes/head-custom.html

然后它将包含在所有页面上。