嵌入式 Twitter 时间轴在 Jekyll 网站上不起作用

Question

Objective: 在我们的 Jekyll GitHub 页面网站上嵌入我组织的 Twitter 时间线。

当我创建一个包含以下代码的本地 index.html 并使用 Google Chrome 打开它时，它会正确显示时间轴，但是这在 JSFiddle 和我们的网站本身都不起作用。

<html>
  <head>
    <title>"Hello, World"</title>
  </head>
  <body bgcolor=white>
    <h1>Hello, World</h1>

    <div>
      <a class="twitter-timeline" data-theme="dark" href="https://twitter.com/CodeForBuffalo?ref_src=twsrc%5Etfw">Tweets by CodeForBuffalo</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
    </div>

  </body>
</html>

这是代码所在的上下文。我尝试将脚本添加到包含其他 js 脚本文件的 js 文件夹（然后引用该文件路径）。我尝试将其包含在 head.html 中，然后是 footer.html，但是 none 这些尝试都奏效了。

Twitter 提供的脚本应该可以运行，因为它在本地是成功的，但它所显示的只是指向 Twitter 时间轴本身的超链接。这是 Twitter 端的内容还是我使用 Jekyll/JavaScript 不正确？如果没有，是否有其他方式嵌入我们的 Twitter 时间线？

Here's the link to the GitHub Repo

<section id="main-description">
  <div class="container">
    <div class="row">
      <div class="col-md-8">
          ...
      </div>
      <div class="col-md-4">
        <div>
          <a class="twitter-timeline" href="https://twitter.com/CodeForBuffalo?ref_src=twsrc%5Etfw">Tweets by CodeForBuffalo</a><script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
        </div>
      </div>
    </div>
  </div>
</section>

Answer 1

我在我的 Jekyll 网站上对此进行了测试，它可以立即运行。我只是在 root/twitter/.index.html:

中创建了一个新页面

---
layout: page
title: "Twitter feed"
heading: "Twitter feed"
excerpt: "Twitter feed."

permalink: twitter

---

Twitter feed placeholder:



<section id="main-description">
  <div class="container">
    <div class="row">
      <div class="col-md-8">
        ...
      </div>
      <div class="col-md-4">
        <div>
          <a class="twitter-timeline" href="https://twitter.com/CodeForBuffalo?ref_src=twsrc%5Etfw">Tweets by CodeForBuffalo</a>
          <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
        </div>
      </div>
    </div>
  </div>
  </section

并得到了预期的结果：

如果问题仍然存在，请检查浏览器控制台是否有任何错误。也许您缺少 JS 依赖项？除了上面的代码，我没有添加任何东西，但我的网站确实有 Bootstrap 并且相关的 JS 库已经包含在内。不确定 async 脚本中是否需要或已经提供这些。

嵌入式 Twitter 时间轴在 Jekyll 网站上不起作用

Embedded Twitter timeline not working on Jekyll site

html

javascript

twitter

jekyll

github-pages