样式表不适用于Jekyll主题Freelancer引导程序 [英] Stylesheets not working for Jekyll theme Freelancer bootstrap

问题描述

我的个人博客已经有一个 username.github.io 存储库，现在我的目标是使用与我发现的完全不同的主题创建另一个github托管的jekyll页面.这是我正在使用的主题的链接: https://github.com/jeromelachaud/freelancer-theme

I already have a username.github.io repository for my personal blog, and now my goal is to create another github-hosted jekyll page using a completely different theme I found. Here's the link to the theme I'm using: https://github.com/jeromelachaud/freelancer-theme

因此，我在机器和github上创建了一个新的存储库，将本地存储库连接到远程github上，创建了一个孤立的gh-pages分支，然后分叉了freelancer-theme并将其克隆到新文件夹中我在gh-pages分支上创建的存储库.我使用命令将所有文件(我认为的git init除外)移到新存储库的父文件夹中.我删除了freelancer-theme分支文件夹，并使用gem install jekyll安装了Jekyll的最新版本.然后，我运行jekyll服务，该网站在我的计算机上完美呈现.进行了一些修改，但仍可以使用新的修改效果很好.将这些更改推送到我在github上存储库的gh-pages分支之后，我现在转到username.github.io/nameofmynewrepository，我得到了一个包含主题所有组件的网站，但是css似乎无法正常工作.

So I created a new repository on my machine and on github, connected the local repository to the remote github on, created an orphan gh-pages branch, and then forked the freelancer-theme and cloned it into the folder of the new repository I created while on the gh-pages branch. I used a command to move all the files (except the git init i think) into the parent folder of the new repository. I deleted the freelancer-theme fork folder and installed the most recent version of Jekyll with gem install jekyll. Then I ran jekyll serve and the site renders perfectly on my machine. Made some modifications, still renders fine with new modifications. After pushing those changes to the gh-pages branch of my repository on github, I now go to username.github.io/nameofmynewrepository and I get a site with all the components of the theme but the css doesn't seem to be working.

有人从事过这个主题吗，他们知道可能的原因吗?文档非常稀疏.
这是我的github页面的网址，其中的样式表不起作用: http://mpron.github.io/mybrotheriswrong/

Has anyone worked with this theme and do they know the possible cause? It's very sparse on documentation.
Here is the url for my github page with the stylesheets not working: http://mpron.github.io/mybrotheriswrong/

这是我在gh-pages分支上的新仓库: https://github.com/mpron/mybrotheriswrong/tree/gh-pages

And here is my new repo on the gh-pages branch: https://github.com/mpron/mybrotheriswrong/tree/gh-pages

推荐答案

由于您的github页面站点是一个项目站点，因此他的默认URL类似于 user.github.io/projectrepository .

As your github pages site is a project site, his default url looks like user.github.io/projectrepository.

这意味着当您在/resourcefolder/ressource.css 中查找资源(css，js或img)时，它会在 user.github.io/resourcefolder/ressource中查找资源.css .

This means that when you look for a resource (css, js or img) at /resourcefolder/ressource.css it look for it at user.github.io/resourcefolder/ressource.css.

缺少/projectrepository 部分，这就是为什么必须在 _config.yml

The /projectrepository part is missing and that's why you have to use the baseurl parameter in _config.yml

在您的情况下，您只需添加:

In your case, you just have to add :

baseurl: /mybrotheriswrong

在您的 _config.yml 中.

标记随后将其添加到您的css href中，并成功在/mybrotheriswrong/css/font-awesome/css/font-awesome.min.css 中找到它

The tag will then prepend it to your css href and successfully find it at /mybrotheriswrong/css/font-awesome/css/font-awesome.min.css.

这也将解决您的js问题.

And this will also resolve you js problem.

如果您打算在不同级别(如 about/index.html )上放置页面，或使用帖子的固定链接(如)，则还应在图像上使用 site.baseurl > somefolder/

You also should use site.baseurl on you images if you plan to have page on a different level like about/index.html or use post's permalink like somefolder/

<img src="{{ site.baseurl }}/img/portfolio/{{ post.img }}" class="img-responsive" alt="{{ post.alt }}">

这篇关于样式表不适用于Jekyll主题Freelancer引导程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！