jekyll学习三(小知识点) 返回首页

发表于 2018-06-12 | 本文共 342 字

DISQUS评论


如果需要让文章支持评论功能,需要在文章头部启用

---
layout: post
title: jekyll学习( 杂项)
date: 2018-06-12
category: Jekyll
comments: true
---

comments设置为true,然后在_include目录下面新建一个comments.html。所有用到评论的地方我们可以引用这个模板。由于我使用的是DISQUS,首先需要在DISQUS官网注册账号,填写好几本信息后把下面这串代码复制到comments.html里面:

<div id="disqus_thread"></div>
<script>


var disqus_config = function () {
 this.page.url = PAGE_URL;  // Replace PAGE_URL with your page's canonical URL variable
 this.page.identifier = PAGE_IDENTIFIER; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
};

(function() { // DON'T EDIT BELOW THIS LINE
 var d = document, s = d.createElement('script');
 s.src = 'https://EXAMPLE.disqus.com/embed.js';
 s.setAttribute('data-timestamp', +new Date());
 (d.head || d.body).appendChild(s);
})();
</script>
<noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>

根据提示我们需要更改三个地方:
this.page.url = “{{ page.url | prepend: site.baseurl | prepend: site.url }}”;
this.page.identifier = “”{{ page.url }}”;
s.src = ‘https://EXAMPLE.disqus.com/embed.js’; (EXAMPLE需要替换成自己DISQUW中的名字)

引用代码片段


如果需要引用代码片段直接用双括号的形式是会被解析的,比如我们想告诉读者image意思是输出标题,但是这样引用会直接把本文的标题输出出来,所以我们需要用liquid提供的一个语法: raw来处理这样的需求:
image
处理后的结果
image

高亮显示


关于高亮显示,有很多选择,比如Pygments,Highlight JS,SyntaxHighlighter,Prismjs等等。我个人用的是Rouge,需要改下_config.yml文件:

markdown: kramdown
highlighter: rouge

然后重启下服务,jekyll serve。http://rouge.jneen.net/在这个官网可以生成对应语言的css。使用Chrome的话可以打开开发者工具在sources里面的assets文件夹里找到css文件,因为是压缩过的我们另存为本地后需要格式化一下,把高亮部分的css复制出来,另存为你的css样式,然后在head里面引入就可以了。

域名绑定


github pages支持绑定自己的域名。
方法 / 步骤:

  1. 准备一个域名,登陆到域名解析页面,添加两条记录,如下:
    image
    A记录的记录值可以在终端里用’ping your.github.io’来获取,CNAME的记录值就是你的原github pages的url(your.github.io)。
  2. 登陆到你的github pages,在Settings里有一个Custom domain的选项,填写你准备好的域名并且保存。 image
    image
  3. 在项目根目录下新建一个名为’CNAME‘的文件,注意要大写而且没有后缀,使用编辑器在里面第一行写上你准备好的域名:
    image
    接下来等域名生效就可以了,上述步骤操作顺序随意。


显示评论