Jekyll 使用记录

常阳时光(SYN)已删除 2015-08-26)基本上能正常运行了,趁热打铁,把折腾的一些过程记录一下,算是笔记吧。需要的网友也可以参考一下。PS:可能会有些非常非常业余的代码,所以参考的自己看着办吧。

<!--more--> 标签

我在 WordPress 发布的所有文章,都在第一段后手工加了 <!--more--> 标签,这样首页内容能带 html 样式显示(WordPress 自动截断会把样式都去掉,虽然高度看起来统一了,但是内容看起来可能就怪怪的了)。Jekyll 会自动取每篇文章从开头到第一次出现 excerpt_separator 的地方作为文章的摘要。 如果没有配置 excerpt_separator,Jekyll 默认会截取文章第一段作为摘要。我用的是这个方法,所以把 WordPress 导出的文章的 <!--more--> 标签批量删除掉了。

如果想自己控制输出多段,可以在需要截断的地方添加 <!--more--> 标签,并且在 _config.yml 文件中添加配置:excerpt_separator: "<!--more-->"

当然,也可以像 WordPress 那样添加 <!--more--> 标签,并添加 Read More 链接。使用下面的代码就可以了,原文(没有测试)

{% if post.content contains '<!--more-->' %}
{{ post.content | split:'<!--more-->' | first }}
<p class="more"><a href="{{ post.url }}">Read More &raquo;</a></p>
{% else %}
{{ post.excerpt }}
{% endif %}

详细请参考:官方文档

分页功能

Jekyll 目前只能对首页进行分页,分类/标签下的文章无法分页,如有方法能实现,请留言告知,谢谢。

开启分页功能很简单,只需要在 _config.yml 里面添加一行 paginate 配置每页显示多少篇文章即可。如,每页最多显示 8 篇文章,添加如下代码即可。

paginate: 8

下面我的分页代码,修改自:V2EX,代码放到 index.html 恰当位置即可。

  <div id="post-pagination" class="pagination">
{% if paginator.page == 1 %}
<span class="page-numbers current">1</span>
{% else %}
<a class="page-numbers" href="/">1</a>
{% endif %}

{% assign pageSize = 2 %}
{% assign startPage = paginator.page | minus:pageSize %}
{% if 2 > startPage %}
{% assign startPage = 2 %}
{% endif %}
{% assign endPage = paginator.page | plus:pageSize %}
{% if endPage >= paginator.total_pages %}
{% assign endPage = paginator.total_pages | minus:1 %}
{% endif %}

{% assign pageTemp = pageSize | plus:2 %}
{% if paginator.page > pageTemp %}
<span class="page-numbers dots"></span>
{% endif %}

{% for count in (startPage..endPage) %}
{% if count == paginator.page %}
<span class="page-numbers current">{{ count }}</span>
{% else %}
<a class="page-numbers" href="/page{{ count }}">{{ count }}</a>
{% endif %}
{% endfor %}

{% assign pageTemp1 = pageSize | plus:1 %}
{% assign pageTemp = paginator.page | plus:pageTemp1 %}
{% if paginator.total_pages > pageTemp %}
<span class="page-numbers dots"></span>
{% endif %}

{% if paginator.page == paginator.total_pages %}
<span class="page-numbers current">{{paginator.total_pages}}</span>
{% else %}
<a class="page-numbers" href="/page{{paginator.total_pages}}/">{{paginator.total_pages}}</a>
{% endif %}

</div>

参考 CSS:

/*分页*/
.pagination {font-size: 14px;margin-top: 18px; text-align: center; }
.pagination .page-numbers{color:#111;display: inline-block;text-align: center;width: 24px;line-height:24px;margin:5px;background: #E4E5E1;}
.pagination .page-numbers.current{ background: #c30;color:#fff;}
.pagination .page-numbers.dots{border-color:rgba(0,0,0,0)}

效果如下图,修改 pageSize 值即可控制当前页前后输出的页码数。

详细参考:官方文档非官方中文(翻译不是很准确)

分类 & 标签功能

Jekyll 的分类和标签功能没有 WordPress 完善,凑合着用吧。

模板代码和样式参考自:谢益辉 & 天涯孤鸟

评论

必须得用第三方评论系统,这个是最大的硬伤,若不是,我可能彻底投奔 Jekyll 了。 国外的 Disqus 感觉更有节操,不过国内加载实在是太慢了。所以放弃了 Disqus + 多说 两种评论框一起用。

RSS

代码来自:jekyll-rss-feeds,只针对个人模板配置小改了一下——site.name 改为 site.title,需根据个人配置修改。

代码就不贴了,需要的可以到 Github 看源文件。

sitemap

对于 sitemap,WordPress 是安装插件解决的,Jekyll 好像也可以安装插件解决,比如:jekyll-sitemap,不过我是没有折腾成功。如果你愿意,也可以试试这个插件

不过我现在用的是免插件方法:Generating a Sitemap in Jekyll without a Plugin

SEO 优化

这个不大懂,目前只优化了一下网页 title,分页加上了"第 xx 页"字样。用下面的代码替换掉原始的 …… 之间的 title 代码即可。

    <title>
{% if page.title %}{{ page.title | strip_html }} &#8211; {% endif %}
{{ site.title | strip_html }}
{% if paginator.page > 1 %}
&#8211; 第 {{ paginator.page | strip_html }} 页
{% endif %}
{% if page.layout == 'default' %}&#8211; {{ site.description | strip_html }} {% endif %}
</title>

除非注明,垃圾站文章均为网络收集,本文地址 https://cyhour.com/189/,转载时烦请以链接形式注明原始出处。
声明:我们不销售主机,选主机需合法使用。任何主机需定期备份,防止数据丢失。信息以实际为准,评测仅供参考不代表权威!
🍄:Netflix 奈飞 YouTube 合租

WordPress 博客网站数据库和文件备份插件 BackWPup 兼容 PHP8 版本

老头使用 BackWPup 这款 WordPress 博客网站数据库和文件备份插件好几年了,测试过使用备份的 sql 数据库文件和 XML 文件恢复,没有问题。 以前使用虚拟主机的时候使用 BackWPup 备份,一份直接上传 DropBox,一份 Email 发送到邮箱。后来换了 VPS,就只备份到 VPS 本地,然后使用脚本连同其它备份…

ThinkPad E450C 换电池

ThinkPad E450C 是内置电池,换起来比较费劲,基本上要把整机拆散。 百度经验有详细的拆机教程——联想(Thinkpad)E450 E450C 拆机教程,螺丝卸掉,一步一步,慢慢拆,不要用蛮力,基本上不会出啥问题。 按理是要把主板拆下来才可以拿出电池更换,不过我是偷懒换。把红色地方螺丝拆掉,主板轻轻…
浏览: 149 标签:  ,  , 

Adobe Flash Player 修改版 及可用 Flash Player 模拟扩展 Win10 可用

Adobe 在2020年12月31日后将不再支持 Adobe Flash Player,从2021年1月12日开始,阻止 Flash 内容在 Flash Player 中运行。截图 虽然不喜欢 Adobe Flash Player,但是有些网站目前仍然离不开 Adobe Flash Player,过渡解决方法是:安装中国特供版 Adobe Flash Player 或者安装网友修改 Adobe Flash…
浏览: 68 标签:  ,  ,  , 

Comments:4

  1. 个人觉得此类的静态博客完全属于一个玩具。

    2015.08.06 14:36 # 回复
    1楼
    • @寒烟 作为一个安心写文字的地方,Jekyll 还是挺不错的,基本功能与 WordPress 是一样的,只是资源没那么丰富。

      2015.08.06 15:45 # 回复
  2. 欢迎加入 hard 模式大家庭。

    2015.08.12 02:53 # 回复
    2楼

发表留言

Vultr 送$100,搬瓦工年付最低$49,优惠码 BWH3HYATVBJW,更多推荐VPS信息