职业资格证书样式:样式表不适用于 Jekyll主题自由职业者引导

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

所以我在我的机器上和 github 上创建了一个新的存储库,我似乎将本地存储库连接到远程 github 上,创建了一个孤立的 gh-pages 分支,然后将 freelancer-theme 的所有版本复制到 gh-pages 分支上创建的新存储库的文件夹中。我使用命令将所有文件 (除了我认为的 git init) 移动到新存储库的父文件夹

有没有人使用这个主题,他们知道可能的原因吗?它在文档上非常稀疏。
这是我的 github 页面的 URL,样式表不起作用:http://m.github.io/mybrotheriswrong/

这是我在 gh-pages 分支上的新回购:https://github.com/m/mybrotheriswrong/tree/gh-pages

6

由于您的 github 页面站点是一个项目站点,因此他的默认 URL 看起来像user.github.io / projectrepository

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

/ projectrepository部分丢失,这就是为什么您必须在_config.yml中使用baseurl参数

在你的情况下,你只需要添加:

baseurl: /mybrotheriswrong

在您的_config.yml中。

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

这也将解决你的 js 问题。

您还应该使用site.baseurl在您的图像上,如果您计划在不同的级别上使用页面,如about / index.html或使用 post 的 permalink,如somefolder /

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

这是我如何修复错误-

_includes/head.html中更改-

<!-- Custom CSS & Bootstrap Core CSS - Uses Bootswatch Flatly Theme: http://bootswatch.com/flatly/ -->
<link rel="stylesheet" xxx="{{ "/style.css" }}">
<!-- Custom Fonts -->
<link rel="stylesheet" xxx="{{ "/css/font-awesome/css/font-awesome.min.css" }}">

<!-- Custom CSS & Bootstrap Core CSS - Uses Bootswatch Flatly Theme: http://bootswatch.com/flatly/ -->
<link rel="stylesheet" xxx="{{ "style.css" }}">
<!-- Custom Fonts -->
<link rel="stylesheet" xxx="{{ "css/font-awesome/css/font-awesome.min.css" }}">

_includes/js.html中更改-

更改-

<!-- Bootstrap Core JavaScript -->
<script src="{{ "/js/bootstrap.min.js" }}"></script>
<!-- Plugin JavaScript -->
<script src="{{ "/js/jquery.easing.min.js" }}"></script>
<script src="{{ "/js/classie.js" }}"></script>
<script src="{{ "/js/cbpAnimatedHeader.js" }}"></script>
<!-- Contact Form JavaScript -->
<script src="{{ "/js/jqBootstrapValidation.js" }}"></script>
{% if site.contact == "static" %}
<script src="{{ "/js/contact_me_static.js" }}"></script>
{% else %}
 <script src="{{ "/js/contact_me.js" }}"></script>
{% endif %}
<!-- Custom Theme JavaScript -->
<script src="{{ "js/freelancer.js" }}"></script>

<!-- Bootstrap Core JavaScript -->
<script src="{{ "js/bootstrap.min.js" }}"></script>
<!-- Plugin JavaScript -->
<script src="{{ "js/jquery.easing.min.js" }}"></script>
<script src="{{ "js/classie.js" }}"></script>
<script src="{{ "js/cbpAnimatedHeader.js" }}"></script>
<!-- Contact Form JavaScript -->
<script src="{{ "js/jqBootstrapValidation.js" }}"></script>
{% if site.contact == "static" %}
<script src="{{ "js/contact_me_static.js" }}"></script>
{% else %}
 <script src="{{ "js/contact_me.js" }}"></script>
{% endif %}
<!-- Custom Theme JavaScript -->
<script src="{{ "js/freelancer.js" }}"></script>

简而言之,我们从所有链接中删除/。为什么我删除这个在 David 的回答中解释。

0

您需要下载官方替代版本:

Jekyll Logo Jekyll Version
0

请注意,自 2016 年 12 月以来,您有了一个新的主题选择器,这将使themes的切换更加容易。
请参阅“New theme chooser for GitHub Pages ”:

现在,您只需单击几下即可构建一个主题为Jekyll的 GitHub Pages 网站。

创建new GitHub repository或转到现有的。

在存储库设置的 GitHub Pages 部分中打开主题选择器。

选择一个主题。

有关更多信息,请访问“Creating a GitHub Pages site with the Jekyll Theme Chooser

enter image description here

本站系公益性非盈利分享网址,本文来自用户投稿,不代表边看边学立场,如若转载,请注明出处

(255)
E life:SAMLTOKENLIFE TIME最佳实践
上一篇
Jsp和php有什么区别:JSP和JSTL有什么区别
下一篇

相关推荐

  • flask 调试让你的应用快速迭代

    示例示例Flask 调试是指在开发 Flask 应用时,使用 Flask 的调试机制来检测和修复代码中的错误。Flask 调试机制是一个内置的简易 Web 服务器,它能够跟踪应用程序中的错误,并把它们显示在浏览器中。…

    2023-08-10 13:49:57
    0 98 37
  • Im token:Skype如何在imo.im和 im+服务中工作

    关于Im token的问题,在im+中经常遇到,Skype 如何在 imo.im 和 im + 服务中工作?任何猜测?…

    2024-02-10 10:51:15
    0 22 67
  • Ki y no:Alexa技能 ki手动输入

    关于Ki y no的问题,在amazon echo input manual中经常遇到,我是 Alexa 技能工具包开发的新手我已经阅读了有关 Alexa 技能工具包的教程我必须实现 Alexa 技能,在其中我需要手动发送命令并希望 Alexa 说出它。…

    2024-06-18 04:19:52
    0 73 71
  • Keep招聘:提供雇用 3名以上员工的招聘人员的姓名以及未被招聘人员雇用的员工人数的查询

    关于Keep招聘的问题,在other names for recruiter中经常遇到,我有点被困在这个问题上,并希望得到一些帮助。…

    2024-06-04 12:30:27
    0 27 22
  • Un def:无法使用伪造查看器编译反应应用程序-无法编译-Autodesk未定义un-def

    关于Un def的问题,在un def中经常遇到,我们想将我们的一些 forge 查看器代码库移动到一个 react-app 中,并且无法弄清楚如何使用 viewer3d js api 而不附加所有的 Autodesk.Viewer....在我们的带有窗口的组件中使用。* 这适用于我们研究过的所有 (优秀和广泛的) git 示例。为什么?我们在和 react 登陆之间的 index.html 中加载 viewer3d.js 文件:…

    2022-11-23 08:39:12
    0 80 91
  • Book y:类型“Book”不可赋值为类型“Book”

    关于Book y的问题,在angular book中经常遇到,我试图学习如何使用角和打字稿,我是一个视频,直到一个点,他试图使一个方法(getBookId),应该采取一本书的 ID,然后检查一个数组,并返回其信息时,有一本书具有相同的 ID。…

    2022-11-23 08:29:10
    0 48 77
  • nodejs网站项目实例:使用Node.js构建功能强大的网站

    Node.js 网站项目实例是指使用 Node.js 技术构建的网站项目。它可以帮助开发者快速搭建一个网站,可以更好地处理用户的请求,并且可以提供更快的响应时间。…

    2023-05-04 11:35:09
    0 74 48
  • nodejs调试实现快速、高效的代码调试

    示例示例Node.js调试是指使用Node.js开发者工具来检查程序的运行状况,以及查看代码中可能出现的问题。Node.js开发者工具是一个用于调试Node.js应用程序的工具,它可以帮助开发者查看程序的运行状况,以及查看代码中可能出现的问题。…

    2023-03-08 15:58:05
    0 55 93

发表评论

登录 后才能评论

评论列表(15条)