Question

所以我刚开始使用Jekyll和GitHub-Pages，所以我可以运行自己的投资组合网站。由于制作漂亮是我的一个弱点，我选择了一个Jekyll版本的HTML5UP Helios模板来修改我的目的。 Here是当前网站（我知道正在进行的工作）

我决定将我的项目页面分别设置为帖子，以便在需要时可以轻松添加新的项目页面;每个帖子也会将左侧边栏布局作为其模板，您可以在导航栏上看到。

我认为将markdown文件链接到自己的页面很简单，只需使用模板即可。这是我试图用其中一个＆＃34; carousel＆＃34;帖子：

---
layout: left-Sidebar
title: C++ Big Int Class
desc: This is a sample post that is added under the "desc" part of the YAML.
img: pic01.jpg
categories: carousel
---

这是我在旋转木马中链接它的地方：

{% for post in site.categories.carousel %}
    <article>
        <a href="{{post.url}}" class="image featured"><img src="images/{{ post.img }}" alt="" /></a>
        <header>
            <h3><a href="{{post.url}}">{{ post.title }}</a></h3>
        </header>
        <p>{{ post.desc }}</p>
    </article>
{% endfor %}

现在我认为这样可行，但是我得到的帖子看起来像这样:(我没有足够的声誉来发布两个以上的链接，所以你可以通过点击找到它轮播链接名为＆＃34; C ++ Big Int Class＆＃34;）

如果有人能告诉我出了什么问题（以及您可能发现的任何其他错误，我会对此感到陌生），我们将非常感激。

我发布了文件树结构，但它的方式很大，所以如果您想查看其他文件，可以在我的Github repo中查看它们{{3 }}

Answer 1

页面正在失去风格，因为您将css和js包含在相对路径中，例如：

https://joe-mccann.github.io/carousel/2015/02/01/carousel1.html

中的

<script src="js/jquery.min.js"></script>

该剧本应该在https://joe-mccann.github.io/carousel/2015/02/01/js/jquery.min.js。

要修复它，请使用此过滤器absolute_url包含完整路径：

<script src="{{ 'js/jquery.min.js' | absolute_url }}"></script>

Jekyll帖子正在显示内容，但没有正确格式化正确的布局

1 个答案: