宝塔面板 Nginx 启用 pagespeed 模块

1. 转到软件商店 - 运行环境，安装 Nginx，方式选择编译安装，点击添加自定义模块。
2. 填写模块名称和模块描述；模块参数：

--add-module=/www/server/ngx_pagespeed

3. 填写前置脚本：

cd /www/server
wget https://github.com/apache/incubator-pagespeed-ngx/archive/v1.13.35.2-stable.zip
unzip v1.13.35.2-stable.zip
rm v1.13.35.2-stable.zip
NPS_DIR=$(find . -name "*pagespeed-ngx-1.13.35.2-stable" -type d)
mv $NPS_DIR ngx_pagespeed
cd ngx_pagespeed
NPS_RELEASE_NUMBER=${1.13.35.2-stable/stable/}
PSPL_URL=https://dl.google.com/dl/page-speed/psol/${NPS_RELEASE_NUMBER}x64.tar.gz
[ -e scripts/format_binary_url.sh ]
PSPL_URL=$(scripts/format_binary_url.sh PSOL_BINARY_URL)
wget ${PSPL_URL}
tar -xzvf $(basename ${PSPL_URL})
rm $(basename ${PSPL_URL})

4. 勾选模块，点击提交。安装好之后可以执行 nginx -V，检查是否有 --add-module=/www/server/ngx_pagespeed，如果有，说明安装成功。

之后，我可能会写一篇关于配置 ngx_pagespeed 的文章，敬请期待。

HTML 启用赫蹏

赫蹏是一款中文排版工具。

全局

1. 在页面的 </head> 标签前引入 heti.css 样式文件：

<link rel="stylesheet" href="//cdn.casecori.top/npm/heti/umd/heti.min.css">

2. 在要作用的容器元素上增加 class="heti" 的类名：

<article class="entry heti">
  <h1>我的世界观</h1>
  <p>有钱人的生活就是这么朴实无华，且枯燥。</p>
  ……
</article>

增强脚本

在页面的 </body> 标签前引入 JavaScript 脚本后初始化即可：

<script src="//cdn.casecori.top/npm/heti/umd/heti-addon.min.js"></script>
<script>
  const heti = new Heti('.heti');
  heti.autoSpacing();
</script>

古文

<div class="heti heti--ancient">……</div>

诗词

• 诗词：

<div class="heti heti--poetry">
  <h2>九月九日忆山东兄弟<span class="heti-meta heti-small">[唐]<abbr title="号摩诘居士">王维</abbr></span></h2>
  <p class="heti-x-large">
    独在异乡为异客<span class="heti-hang">，</span><br>
    每逢佳节倍思亲<span class="heti-hang">。</span><br>
    遥知兄弟登高处<span class="heti-hang">，</span><br>
    遍插茱萸少一人<span class="heti-hang">。</span>
  </p>
</div>

• 诗节：
  在古文版式 <div class="heti heti--ancient"> 中，为诗句添加名为 heti-verse 的 class 可以将其居中显示：

<div class="heti heti--ancient">
  <h2>一剪梅·红藕香残玉簟秋<span class="heti-meta heti-small">[宋]<abbr title="号易安居士">李清照</abbr></span></h2>
  <p class="heti-verse heti-x-large">
    红藕香残玉簟秋。轻解罗裳，独上兰舟<span class="heti-hang">。</span><br>
    云中谁寄锦书来，雁字回时，月满西楼<span class="heti-hang">。</span><br>
    花自飘零水自流。一种相思，两处闲愁<span class="heti-hang">。</span><br>
    此情无计可消除，才下眉头，却上心头<span class="heti-hang">。</span>
  </p>
</div>

行间注

为容器元素 <div class="heti"> 添加名为 heti--annotation 的 class 后，搭配 <ruby> 元素即可实现整齐的行间注效果：

<div class="heti heti--annotation">……</div>

多栏排版

为容器元素 <div class="heti"> 添加名为 heti--columns-2 的 class 即可实现双栏排版：

<div class="heti heti--columns-2">……</div>

竖排排版

<div class="heti heti--vertical">……</div>