盘古之白调教日记!

  嗨呀终于把所有(让我不爽的)盘古之白的问题都解决了。
  话说我为什么今天行动力这么高呢,大概是因为星期天要交下一话的稿子了,众所周知交稿前那么几天除了画画以外干什么都超有动力……【编辑:?


.+†+.

  说起来启用盘古之白的理由其实很弱智,就是因为我在处理标点缩进的时候被迫采用了一套衬线字体,导致中英文混排的时候观感非常差,手动加空格吧又像个刚学写字的小学生,年纪大了养新习惯可不是那么容易的事。
  于是才启用了盘古之白把非衬线(微软雅黑)的中文和衬线的英文数字隔开。当然启用了这个插件之后发现了各种各样的问题,比如首当其冲的:为什么省略号和汉字之间要加一个空格?
  当然这个还是小问题,因为我用的标点字体本身“…”这个符号左边的空白就稍微多一点,然后我没事用手机刷自己blog的时候又发现了一个问题:为什么分类页面变得这!么!丑!
  在我修正之前分类页面的文本是这样的:

1
2
3
4
5
6
7
-| 梦蚀°( 10)
-断章-(4 )
空集( 1)
Prism Tune°( 4 )
杂物箱 †(22 )
三题故事( 2 )
流年 · 歌祭( 15)

  看出来什么毛病了吗?用来统计文章数量的数字也被加了空格,而且数字旁边的括号还没有被统计进文本内,导致括号里不仅出现了空格,而且这个空格还不对称。
  我看见这个沙雕bug的时候简直眼前一黑……
  当然可喜可贺的是目前这两个bug都被修正了,接下来是折腾笔记。

去掉省略号之后的空格

  其实这个上一篇已经记过了,方法很简单,省略号(三个点)的字符编码是u2026,在两个js文件里搜索\u2026,两个js.map文件里搜索\\u2026分别替换掉就可以了。
  但是我还遇到一个莫名其妙的bug就是,这么改完以后本地浏览的时候生效了,但部署之后又出现了空格,仔细检查了所有git上的文件都没有发现问题。最后我突发奇想把pangu.swig文件里js链接的版本号去掉了,这个阴魂不散的空格就消失了……
  虽然正常理解这应该是浏览器的缓存问题。
  但我还是要吐槽,写代码果然是一种宗教活动吧?

限定盘古之白的生效范围

  上一篇里也提到了,当时的设想是在某个地方加一行代码屏蔽/categories/url,但是在我仔细研究了一下几个layout文件之后,发现好像并不是这么个原理。
  分类页面变形的原因是盘古之白的js被链接在了主layout文件里,想要实现分页渲染的话就必须把主layout文件里的盘古之白删掉,再在其它需要处理的文字部分加上。

  • 需要删掉的部分:
    next\layout\_layout.swig拉到最下面,有一排include标签的地方,ctrl+F找到pangu那一行,整行剪切掉备用。
  • 需要添加的部分:

    • next\layout\post.swig24行,有两个连着的div结尾标签,把刚才剪切下来的include pangu贴进去。检查一下贴进去的这一行应该在"post-spread"的外面,"posts-expand"元素以内。

      1
      2
      3
      4
          {% endif %}
      </div>
      {% include '_third-party/pangu.swig' %}
      </div>
    • next\layout\index.swig18行有一个include标签,把刚才剪下来的include pangu贴到这一行下面去。检查一下贴进去的这一行应该在"posts-expand"下面,block content标签以内。

      1
      2
      3
      	  {% include '_partials/pagination.swig' %}
      {% include '_third-party/pangu.swig' %}
      {% endblock %}

  至此文章正文部分已经启用了盘古之白,其它页面和元素均不受影响。因为我启用盘古之白主要是为了解决衬线字体的问题,所以这两个地方已经足够。通过修改swig实现全站启用但是单独屏蔽categories界面的方法暂时没有想到,因为categories和pages的swig文件好像是有部分重合的,如果在其它页面的模板文件(pages)里启用盘古,那categories必然会受影响。
  不过还是有一个曲线救国的办法,就是在需要启用盘古的自定义页面结尾加上两行:

1
2
<script src="https://【你的域名】/lib/pangu/dist/pangu.min.js"></script>
<script type="text/javascript">pangu.spacingPage();</script>

  就可以加上空格啦~
  不过这样做的话页面的标题也会加上空格,不想要这个效果的话手动加空格也不错_(:з」∠)_