Typecho博客添加赫蹏排版美化,通过在header.php引入CSS,容器元素添加heti类,并使用脚本实现自动间距和复制按钮功能。
AI 摘要

Github链接:赫蹏(hè tí)

只保留了中英混排优化(本来想把标点挤压也留下的,结果标点挤压遇到部分手机厂商优化过的字体反而乱套了)

  1. header.php中添加

    <link rel="stylesheet" href="//unpkg.com/heti/umd/heti.min.css">
    
  2. 在要作用的容器元素上增加 class="heti" 的类名即可:

    <article class="entry heti">
      <h1>我的世界观</h1>
      <p>有钱人的生活就是这么朴实无华,且枯燥</p>
      ……
    </article>
    
  3. 使用脚本:

    <script src="//unpkg.com/heti/umd/heti-addon.min.js"></script>
    <script>
       const heti = new Heti('.heti'); heti.autoSpacing(); 
    $(document).on('pjax:complete', function () { heti.autoSpacing(); addCopyButtonsToCodeblocks(); }); $(document).ajaxComplete(function (event, xhr, settings) { heti.autoSpacing(); });
    </script>