正如标题所述，本文主要介绍在使用 typecho 后针对 Moricolor 主题的各种插件、魔改与优化。

HTTPS

似乎目前在搭建 lnmp 环境创建虚拟环境时已经可以自动选择添加 Let's Encrypt 的证书。
如果需要自己手动进行操作，推荐 Let's Encrypt现已正式支持泛域名证书 一文进行阅读学习。因为上文较现在时间有点远，也可以去搜索引擎进行学习。
如果是手动进行认证，需要使用 linux crontab 进行定时自动更新，具体自行搜索。

Sitemap

Sitemap 即 网页地图，是否想让自己的博客在搜索引擎上更容易被搜到呢？Sitemap 可方便网站管理员通知搜索引擎他们网站上有哪些可供抓取的网页。Google Search Console，谷歌站长工具是适用于谷歌的站长平台，注册使用后可以很方便的查看网站/博客的浏览点击数据，有利于更好更优质的管理站点在搜索引擎的表现。

在右侧索引的站点地图内提交自己 sitemap 地址可以帮助谷歌更好的进行检索。
本博客使用的 sitemap 工具下载即可使用：https://github.com/bayunjiang/typecho-sitemap
最后的站点地图名即为 myblog.com/sitemap.xml

Google Analytics

Google Analytics 是一个更进一步的网站数据管理工具。

Google Analytics（Google分析）是Google的一款免费的网站分析服务，自从其诞生以来，即广受好评。Google Analytics功能非常强大，只要在网站的页面上加入一段代码，就可以提供丰富详尽的图表式报告。
Google Analytics（分析）向您显示人们如何找到和浏览您的网站以及您能如何改善访问者的体验。提高您的网站投资回报率、增加转换，在网上获取更多收益。

ga 代码在其官网即可复制使用，直接将 script 放入 footer.php 即可。
但是 ga 代码对 ajax/pjax 并没有很好的支持，因为其阻塞加载的特性，其他 js 文件很可能被阻塞以至于无法完成加载。以下是对其进行完善之后的代码：

var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
var head = document.getElementsByTagName("head")[0] || document.documentElement;
var script = document.createElement("script");
script.src = gaJsHost + "google-analytics.com/ga.js";

var done = false;

script.onload = script.onreadystatechange = function() {
    if (!done && (!this.readyState || this.readyState === "loaded" || this.readyState === "complete")){
        done = true;
        try {
            var pageTracker = _gat._getTracker("UA-123456-16");
            pageTracker._trackPageview();
        } catch(err) {}
        script.onload = script.onreadystatechange = null;
    }
};
head.insertBefore(script,head.firstChild);
 

背景图的优化

背景图是影响博客加载的一个很重要的因素，本博客目前使用的背景图，原背景图大小为 15.4 mb，格式为 jpg 。这个大小的图片作为背景图就极为不合适了，而 webp/jpeg 是一个很好的选择：

对于能够显示 WebP 格式的浏览器尽量使用 WebP 格式。因为 WebP 格式具有更好的图像数据压缩算法，能带来更小的图片体积，而且拥有肉眼识别无差异的图像质量，缺点就是兼容性并不好

最终我的背景图经过格式转换和压缩后大小为 2mb ，而清晰度仍然极高可以满足要求。
下面是推荐的一个较好的 webp 格式转换网站：
https://cloudconvert.com/jpg-to-webp