Wordpress on 印记

如何搭建一个博客？

me@yinji.org (青山) — Mon, 25 Dec 2023 00:00:00 +0000

记得一个脑筋急转弯，把一头大象装进冰箱需要几步？三步，打开冰箱，然后把大象装进去，关闭冰箱。

我对于个人博客的搭建步骤也可以用三步来概括，注册域名、购买服务器、搭建博客，但当我们实际操作起来步骤远比想象的要多。

今天写一篇从0到1的博客搭建教程，希望影响更多想写博客的人。

防杠说明：我只以我的经验为基础，推荐和介绍我所用的服务器、程序，更好的方案有很多，不喜勿喷。

并不是因为没有内容可写才出一篇搭建博客的教程，相反，我希望用这篇教程，让想写博客的人，可以写。

基本概念

在介绍博客如何搭建之前，有必要解释相关的概念。这里我采用初之音博客的解释，加以修改。

访问我的博客，需要在浏览器里输入域名 yinji.org，浏览器通过域名解析服务查询到上述网址指向的 IP 地址为 64.88.88.xx，IP 地址与服务器绑定，访问IP就是访问服务器。服务器查询到 yinji.org 指向的位置是 WordPress 博客程序所在的目录，因此返回该目录下所有可以展示的文件。最后，由博客程序将内容返回给访客，显示在浏览器上。

因此，我们需要有域名、服务器、域名解析服务、IP、博客程序、运行环境。

域名

一个完整的域名有前缀和后缀，比如 yinji.org，yinji 是前缀，org 是后缀，中间用符号.链接。所以我们在注册域名时，预先想好前缀，然后在可供选择的后缀中选择合适或者喜欢的。

常见的后缀有 .com、.net、.org、.me、.top，不推荐国别域名后缀 .cn。如果用作个人博客，我推荐使用 .com、.net、.me、.im。

在国内服务商注册域名，好处是价格较便宜，支付方便，但需要实名认证，我建议使用国外的域名商，看个人选择。

国内域名服务商推荐腾讯云、阿里云，如果想注册非主流域名后缀，可以使用趣域网。国外域名服务商推荐 Name、NameCheap、NameSilo、Porkbun、Gandi，使用之前可以参考比价网站，对比不同域名后缀在不同域名服务商的注册、续费、转入价格，比如哪煮米、TLD-List、NameBeta，尽可能选择知名度较高的大厂。

服务器

云服务器和 VPS 有区别，也有联系，为了容易理解，下面都以 VPS 为介绍对象。

使用国内的 VPS，域名必须备案，所以你如果打算购买腾讯云、华为云或者阿里云等国内云服务商的 VPS，最好是在同一个服务商注册域名，方便管理和备案。

如果使用大陆以外的 VPS，比如香港、台湾、日本、美国的服务器，不用备案。

相对来说，国内 VPS 带宽小、价格便宜，其他地区的 VPS 带宽大、价格稍贵，但也有性价比不错的商家，下面会有介绍。

腾讯云、阿里云、华为云都有相应的学生认证服务，通过学生认证可以以优惠价购买配置还不错的 VPS，如果你符合该条件，可以试试。

国外的云服务商选择很多，知名的有 AWS、Vultr、Linode、搬瓦工，他们所提供的服务器质量好、售后好，但也很贵，不建议新手玩家购买。如果你每年只有300元以内的预算，推荐 CloudCone 或者 RackNerd。

我目前使用的 VPS 来自 CloudCone，在2023年4月复活节期间购买，配置为 CPU&内存：2核（vCPU）&2GB，存储：60GB硬盘，带宽：1Gbps，每个月3TB流量，25.5美元/年，续费同价。至于使用体验，可以查看我以前的文章《使用 CloudCone 的第 7 个月》。

对了，国外云服务商还有一个更重要的优点，续费同价，不像国内的套路云，往往只有新人和第一年才有优惠价。

购买 VPS 和注册域名一样，选择知名度高的厂商，虽然我推荐的这两家没有 AWS、Vultr 这些大厂名气大，但在圈内也比较知名，性价比高。

搭建博客

购买服务器

以上面提到的 CloudCone 为例，介绍从购买服务器到搭建博客的过程。

首先在 CloudCone 注册账号，该服务商需要提前充值金额，所以先看好想买的 VPS 价格，充值好对应的金额。点击头像，然后进入 Billing 页面。

下方有一个 Add funds 按钮，支持支付宝支付。

充值好金额之后，以圣诞节特惠 VPS 26美元款为例，然后进入购买页面，选择合适的系统，设置好 Hostname，即可下单。

推荐使用 Debian 或者 Ubuntu 系统，版本选择最新即可，Hostname 没有太多限值要求，英文+数字组合即可。然后等待 VPS 开通成功，之后会收到来自 CloudCone 邮件通知，包含 VPS 的 IP 地址和 SSH 登录账号和密码。

解析域名

一般域名注册商会提供免费的域名解析服务，或者使用其他服务商提供的域名解析，例如 Cloudflare。

这里以 Cloudflare 为例进行介绍。首先需要注册 Cloudflare 账号并登录，点击添加站点。

输入需要添加的域名之后，选择最下方的 Free 方案，点击继续，会提示你修改域名的 DNS 服务器。然后只需要回到域名注册商后台，修改 DNS 服务器即可。

等待 DNS 服务器更新完成，回到 Cloudflare 后台，为域名添加解析。类型选择 A，名称填写 @ 或者 www，IPv4 地址就填写上面购买的 VPS 的 IP 地址，代理状态不建议使用 Cloudflare 代理，一般用不上，建议取消，最后点击保存即可。

关于名称，多说两句。以我的域名 yinji.org 为例，如果填写 @，则解析后的域名就是 yinji.org；如果填写 www，则解析后的域名就是 www.yinji.org 。建议两种都解析，将 yinji.org 作为主域名，设置 www.yinji.org 跳转至 yinji.org。

安装环境

使用 WordPress 程序安装博客，我的常用做法是安装宝塔面板，一键配置 lnmp 环境，Linux+Nginx+MySQL+PHP。

首先需要使用任意一个 SSH 客户端登录服务器，输入账号 root 和登录密码，端口一般为22。如果你的电脑是 Windows 系统，可以直接在 Terminal 上输入命令ssh root@142.1xx.2xx.xx -p 22登录服务器。

下图是堡塔远程工具的截图，输入对应的内容登录即可。

不同的系统安装宝塔面板所用的命令也不一样，以宝塔官网提供的为准。

CentOS 系统：

yum install -y wget && wget -O install.sh https://download.bt.cn/install/install_6.0.sh && sh install.sh ed8484bec

Ubuntu 系统：

wget -O install.sh https://download.bt.cn/install/install-ubuntu_6.0.sh && sudo bash install.sh ed8484bec

Debian 系统：

wget -O install.sh https://download.bt.cn/install/install-ubuntu_6.0.sh && bash install.sh ed8484bec

只需要输入一行命令，整个过程基本上自动完成，安装成功之后，会显示面板登录地址及其账号密码，保存即可退出。

按照提供的地址和账号密码，登录宝塔面板，会弹出环境安装的选择，一般选择 LNMP，极速安装。

上述步骤完成，搭建 WordPress 博客所需的环境也就安装成功了。

创建网站

博客程序种类丰富，常见的 WordPress、Typecho 等，这里以 WordPress 为例。首先需要前往 WordPress 官网下载程序包，一个包含中文语言的压缩包。

紧接着回到宝塔面板，在左侧找到“网站”一栏，添加站点→创建站点→输入域名（例如 yinji.org）→数据库（选择 MySQL，设置账号和密码）→PHP 版本（选择 PHP-81），最后点击提交。

注意：这一步既创建了网站目录，也创建了数据库，所以后面无须再次创建数据库，记住这一步骤下的数据库名、数据库账号和密码即可。

新建一个站点之后，点击左侧“文件”，便会看到系统自动创建了一个以域名为文件名的文件夹，我们称之为网站根目录。

站点创建之后，进入该站点所在目录，删除目录内所有文件，一般只剩下一个 .user.ini 文件，删不掉也没关系。

上传下载好的 WordPress 压缩包，并解压，得到一个名为 WordPress 的文件夹，将文件夹里面的文件全部移动到网站根目录。

上述步骤完成，一般就可以在浏览器里输入域名进行程序安装，但为了减少后面的麻烦，可以先将 SSL 和伪静态提前设置好。

点击刚刚创建好的网站，选择左侧的 SSL，然后选择 Let’s Encrypt，选择需要配置 SSL 证书的域名，点击申请即可。

最后开启强制 HTTPS，点击保存。

关于伪静态设置也很简单，打开左侧的“伪静态”，下拉找到 WordPress，点击保存就可以了。

设置好 SSL 和伪静态之后，便可以在浏览器里输入绑定好的域名，进入 WordPress 程序安装环节。

安装 WordPress 程序

在浏览器里输入域名，进入程序安装界面。

这一步需要用到数据库名、数据库账号、数据库密码，这些都可以在宝塔面板里找到，数据库主机和表前缀保持默认即可，不用修改。

填写正确之后提交，下一个页面是设置站点标题、后台用户名和密码等内容。

全部内容填写完毕之后，通过 域名/wp-admin 路径进入博客后台，即可看到如下图所示的界面，即博客搭建大功告成。

后面你所需要做的事情就是熟悉 WordPress，在后台摸索文章、媒体、页面、评论，以及如何上传/更换主题、安装插件等功能。

写在最后

WordPress 是我最早接触的程序，宝塔也是我最早接触的可视化服务器面板，所以我一直以来的博客搭建方案便是 VPS+宝塔+WordPress，这些都有平替，比如 1panel，再比如直接使用命令行，手动安装环境，但我不会，学起来也比较困难。

怎么方便我就怎么来，即使有人说 WordPress 臃肿，即使有人说静态博客更好，即使有人说宝塔面板好多广告，但看个人选择吧，做好自己，不要求别人。

所以上述所有内容都是基于我个人经验写作而成，存在很强的主观性，仅仅是作为一种选择，提供给想搭建独立博客进行写作的人。同时，由于我能力和知识有限，如果上述内容有任何问题，欢迎指正。

就像东评西就的博主小饿所说：在这个日益浮躁的环境下，难得有非技术人士肯花时间再次开始写独立博客了。博客从来就不是技术人士的专属，非技术人士也可以通过自己的学习和努力搭建属于自己的独立博客，希望我的内容能帮到这些人。

作者：@huhexian 博客：印记联系：Email

多写点内容，少折腾工具

me@yinji.org (青山) — Wed, 22 Nov 2023 00:00:00 +0000

标题这句话是说给自己听的，并不是用来劝诫别人。

今天在 Hugo 上花了数小时的时间，到最后没有折腾出什么名堂，问 ChatGPT 得不到正确的答案和方法，问 Claude 却超出了免费额度，原本以为按照网上的教程一步一步设置、修改，就能得到想要的模样，结果在最后不知修改了哪里的文件和代码，导致文章页的标题凭空消失，回滚代码没有复原，也未发现原因。

遂放弃，老老实实、安安分分地继续使用 WordPress，即使看到再心动的 Hugo 主题，我也会控制自己，多写点内容，少折腾工具。

简要记录整个过程，以此为戒。

起初是看到一个静态网站托管服务——Bear Blog，被它简洁、大气的界面所吸引，而后看到群友陈昱行的博客，使用 Astro 静态程序和仿 Bear Blog 的主题，但我对 Astro 不熟悉，正巧有一款 Hugo 主题也是仿照 Bear Blog 开发，更加符合我心中的极简主义。再加上阅读完雅余的《一个极简主义博客的要素》，按耐不住内心的冲动，便捣鼓了一天的 Hugo。

刚开始还比较顺利，曾经也用过一段时间 Hugo，对于基本的操作还有印象。通过插件，将 WordPress 的文章转成 Markdown 格式，也按照自己的审美将 Bear Blog 主题的部分样式做了修改，但是在设置 OpenGraph 的途中犯了难，网上也没有详细的介绍和教程，便出现了上面提到的情况。

回过头去看我目前的博客、主题，以及 Bear Blog，发现自己有点贪心，一方面想拥有 Bear Blog 的极简，另一方面又需要 WordPress 上各种完善的功能。韩宇说你要不先试着用用 Hugo，等熟悉了再换。一开始我也是这样想，一步一步修改、一步一步转换，最后发现还是习惯使用了5年之久的 WordPress，尽管我没有开发主题和插件的能力，遇到问题还需要上网搜索，但只要有写博客的想法，我第一反应便是使用 WordPress。

多写点内容，少折腾工具。从2018年到现在，期间很多时候都会走向这样一个误区，光顾着装饰外表，忽略了内容的充实，写博客的人，大多都会将自己的网站比喻成一个小家，想方设法把它精心打扮，如有客人来访，内心也是十分兴奋。华丽的外表固然是吸引客人的原因之一，但留住客人的还得是这个家的主人。Dayu 发了一条推文，说平时他博客的 Visitors: Visits 是1:2，最近到1:2.6了，有点开心，大家似乎愿意多停留一会了。多好呀，客人愿意在你家里多待一会，想与你有更深入的了解。

折腾和写作都是 Blogger 的乐趣之一，有的人擅长写作，有的人擅长折腾，没有优劣贵贱尊卑之分，各有各的玩法和兴致，而我的这两方面还处于学习阶段，以今天的经历，告诉自己，多写点内容，少折腾工具。

最后我想分享一段在为也行频道里看到的话：

我们大可宽容些，没必要事事都嘲讽。

有人喜欢记笔记，那就记笔记，有人喜欢折腾笔记工具，那就折腾笔记工具，这个世界不会因为多了折腾工具的人而出现什么不好。

博客也是如此，那种嘲讽「博客没几篇，模版倒是换得勤」大可不必。

就像阅读，这个世界需要阅读的人，也需要买了不读的人。后者满足了自己，也给整个市场做了贡献，为他为你为大家，不好么？

如何向他人推荐博客和笔记应用？

me@yinji.org (青山) — Tue, 01 Aug 2023 00:00:00 +0000

向他人推荐产品是一个很好的习惯，但是如果做得不好，双方都会有糟糕的感受。

前几天在 Telegram 频道 @FindBlog 中发起了一个讨论：

如果你的朋友想写博客，你会给 Ta 推荐哪一种搭建博客的工具或方式？前提：你的朋友是小白，不懂技术，不懂代码。

这种问题我遇到过不少，但是我比较喜欢图省事，直截了当地和对方说，你出钱，我出力，稍后给你搭建好一个开箱即用的博客。但是到最后呢，对方可能像是被泼了一盆冷水，瞬间浇灭了兴趣。还有一种情况，对方想写博客，我有时候会尽心尽力发表建议，和 Ta 讲各种博客系统的优缺点、需要注意的地方、域名、服务器之类的内容，但对方一听这么多，太复杂了，现在没空，等我有空再找你吧，我的热情被 Ta 的一盆冷水给浇灭了。

从简单到复杂

在学习使用某类产品或者服务的时候，我的原则是从简单到复杂。任何事物的学习都是一个循序渐进的过程，还没学会走就别想着跑，写博客和使用笔记应用也同样如此。

关于上面提到的问题，我进行过对比和思考，最终也有了结果。

首先排除 Hugo、Hexo、Jekyll 等静态博客程序，因为从生成博客、发布内容、部署这一系列的流程就比较复杂，关于 GitHub、Git 这类工具和网站，普通人或许根本就不会接触，更不会了解。

接着排除使用 Notion 作为博客的程序，比如 NotionNext，因为这个需要对 Notion 有较为详细的了解，如果不是经常使用 Notion 的人，用起来也会很复杂。

WordPress 和 Typecho 这类动态博客程序我是有所考虑的，注册域名、购买服务器或者虚拟主机、上传源码程序和主题，哐当一下，就可以开始写博客。看似简单，但也需要使用者非常细心、耐心，且有较高的学习能力，在 Google 上搜索 WordPress 搭建教程，满满的一大堆人教你如何搭建博客，跟着步骤慢慢来，会成功的。我就是一开始看到关于 Emlog 的搭建教程，然后四处寻找免费虚拟主机和免费二级域名，最后慢慢了解和学习 WordPress，自己注册域名、购买服务器、搭建博客。

最后非常推荐的是在线托管类博客平台，Gridea、xLog，前者收费，后者只需要邮箱或者虚拟货币钱包地址即可注册使用，并且开源。推荐这两个，是因为他们的开发者在业界都有不小的名声，信誉度高，为大家所熟悉，关于数据是否会丢失，开发者应该会做好万全之策；其次考虑到其中的费用，Gridea 一年的开支只需要10美元，如果需要自定义域名，则需要额外注册域名，xLog 无需付费，除非也想绑定自己的域名。这类服务最大的好处是免去了维护的成本，站点遇到问题，只需要反馈给开发者，等待开发者修复即可，你需要做的事情，仅仅是写。（Typlog 也是不错的选择，但是价格更贵，这里就没有放在一起比较。）

上面这一大串内容，如果从下往上读，这大概就是一个从简单到复杂的过程。写博客其实就是这样一条路，我们得先提起对博客的兴趣，慢慢能够上手，体验到写博客、折腾博客的乐趣之后，再寻求更复杂的玩法。

从一时兴起到养成习惯

三天打鱼，两天晒网，这可不是一个正确的态度。

接着便说说笔记应用的推荐。

因为女朋友有时不时写点读后感、观后感之类的习惯，我偶然问她，有没有把这些内容统一保存在某个地方？她说没有，我所了解到的，她一般都是在手机备忘录里写完然后发表到朋友圈或者微博。存放在手机备忘录里也是足够的，但如果考虑到后续的检索，没有标签做索引的话会困难不少，于是我推荐她使用 flomo。

后面我问她感觉怎么样，她说还挺好用的，功能很多，很简洁。

最近几年各种笔记应用层出不穷，看了一圈下来，flomo 是使用门槛最低的。注册账号，开始记录，最多再打上标签，做好分类，或者上传几张图片，双链之类的“高端用法”根本就不会接触和考虑。Notion 的优点也是它的缺点，all in one，太复杂，而且迟迟不推出中文，也是劝退原因之一；Obsidian 没有官方的免费同步服务，第三方同步服务对于小白用户来说也很复杂……国内其他笔记应用就更别说了。

反观 flomo，简单、质朴，主打的就是一个随时随机记录想法和灵感的功能，即使不开通会员，其功能也足够用，它的开发者团队也值得信赖。

推荐笔记应用和推荐博客程序一样，类似于“对症下药”，不同的人群有不同的使用习惯和知识储备，不能盲目地推荐你觉得好的产品，而应该是你觉得合适他们使用的产品。根据他们的工作内容、专业知识、使用习惯去考虑，过程固然繁琐复杂，但能让对方体验到使用好产品的快乐时，感觉这一切都值得。

工具不重要

这也是一个受到广泛支持的观点。怎么写、用什么写不重要，最重要的是写。

先让他注册一个公众号，在没有什么人关注的情况下，能持续稳定有固定频率的更新一段时间再说。无法持续输出用什么工具都白扯。

仁者见仁，智者见智。有的人不受工具限制，哪哪都能写；但有个好的工具也能提高效率，改善体验。

最后，做个小小的总结。

如果你想写博客，不妨从使用 Gridea 或 xLog 开始，写下第一篇博客，然后浏览他人的博客，学习前辈的经验，再慢慢接触更复杂的程序；如果你想记笔记，不妨从使用 flomo 开始，记录自己灵光一闪的想法，像溪流一般，慢慢汇聚成大海。

关于我的博客2.0

me@yinji.org (青山) — Sun, 07 May 2023 00:00:00 +0000

终于动手写《关于我的博客2.0》。

在两年前写了一篇介绍自己博客的文章《[[about-my-blog|关于我的博客]]》，两年时间过去了，和当时相比，只能说大同小异。正好前段时间有网友留言，看到我对于 Twenty Twelve 主题的修改，问能否写个教程。我也是从网上各种教程文章扒的代码，便找时间记录下来吧。

框架

依然使用 WordPress 和 Twenty Twelve 主题，但是主题经过了比较大的修改，后面会详细说明。

运行在 CloudCone 提供的美国 VPS 上，具体情况可以看之前的文章。

域名是昨天在 NameSilo 注册的，由于我没有信用卡，无法使用 Google Domains 进行注册。Google Domains 土耳其区注册 .net 域名每年仅需人民币25元左右。亏大发了。

插件

目前加上强化拓展，一共只使用了3个插件。

分别是 WP Githuber MD（用于 Markdown 写作）、WP-Douban（用于生成豆瓣条目信息）和 object-cache.php（用于外部对象缓存）。

其他能用代码集成到 function.php 文件中的都用代码替代插件了。

主题

一开始我是基于 WordPress 官方默认主题 Twenty Twelve 进行修改的，但后面看到有一款修改程度更好的成品——Twenty Twelve 木头人修改精简版，就在它的基础上继续修改。

所以有想法的朋友可以直接使用上面提到的成品主题，或者继续看我的内容。

我修改的最终版本：2012-huhexian

首页右上角图片

先在 header.php 加入下列代码：

<a href="https://yinji.org/" title="回到首页"><img src="https://dogefs.s3.ladydaily.com/lucy/storage/1680832936501.png" alt="胡鹤仙"width="70" height="70"/></a>

具体位置大概在 <hgroup>下方，上述内容请替换为自己的网址。

然后在 style.css 中加入样式代码：

/*顶部图片*/
.site-header hgroup{position: relative;}
.site-header hgroup img{position: absolute;right: 0;}
@media (max-width: 650px) {
.site-header hgroup img{ display:none}
}

标签云

/* 标签云样式修改 */ 
 .tagcloud {
     overflow:hidden;
     line-height:20px;
 }
 .tagcloud a {
    font-size: 13px!important;
    padding: 3px;
    margin-right: 3px;
    float: left;
    display: block;
 }
 .tagcloud a:not(.dots):hover {
     background-color: #336699;
     color: #FFFFFF;
     border:0;
 }

引用

/*引用*/
.entry-content blockquote,
.comment-content blockquote
{
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTg1NTQxNjE3MDQ5IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjM3MTgiIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxkZWZzPjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PC9zdHlsZT48L2RlZnM+PHBhdGggZD0iTTQwNi41NTcyNTcgMTE4LjUzNTMxNHYxMzcuOTAzNTQzYy04Ny4xNDI0IDE5Ljk1MzM3MS0xMjguODkyMzQzIDc0LjQ3NDA1Ny0xMzQuMzYzNDI4IDE3Ni4wMTA5NzJoMTM0LjM2MzQyOHYzMjYuNzQzNzcxSDExNC4yOTMwMjlWNDkwLjUxMDYyOWMwLTE5NC4xNzk2NTcgODMuNDk5ODg2LTM0My4wMTA3NDMgMjkyLjI2NDIyOC0zNzEuOTc1MzE1bTAtNTguNTE0Mjg1Yy0yLjY3NzAyOSAwLTUuMzU0MDU3IDAuMTkwMTcxLTguMDQ1NzE0IDAuNTU1ODg1QzE3Ny41MDMwODYgOTEuMjM4NCA1NS43Nzg3NDMgMjQzLjkzMTQyOSA1NS43Nzg3NDMgNDkwLjUxMDYyOXYyNjguNjY4MzQyYTU4LjUxNDI4NiA1OC41MTQyODYgMCAwIDAgNTguNTE0Mjg2IDU4LjUxNDI4NmgyOTIuMjY0MjI4YTU4LjUxNDI4NiA1OC41MTQyODYgMCAwIDAgNTguNTE0Mjg2LTU4LjUxNDI4NlY0MzIuNDQ5ODI5YTU4LjUxNDI4NiA1OC41MTQyODYgMCAwIDAtNTguNTE0Mjg2LTU4LjUxNDI4NmgtNjQuNTI2NjI4YzE0LjQ1MzAyOS0zNy42MTAwNTcgNDEuNDI4MTE0LTUyLjE4MDExNCA3Ny41ODk5NDItNjAuNDU5ODg2YTU4LjUxNDI4NiA1OC41MTQyODYgMCAwIDAgNDUuNDUwOTcyLTU3LjAzNjhWMTE4LjUzNTMxNGE1OC41MTQyODYgNTguNTE0Mjg2IDAgMCAwLTU4LjUxNDI4Ni01OC41MTQyODV6TTkwOS43MDY5NzEgMjY0LjgyMTAyOXYxMzcuOTAzNTQyYy04Ny4xMTMxNDMgMTkuOTUzMzcxLTEyOC44NjMwODYgNzQuNDc0MDU3LTEzNC4zMzQxNzEgMTc2LjAxMDk3MmgxMzQuMzM0MTcxdjMyNi43NDM3NzFINjE3LjQ0Mjc0M1Y2MzYuNzk2MzQzYzAtMTk0LjE3OTY1NyA4My41MTQ1MTQtMzQzLjAxMDc0MyAyOTIuMjY0MjI4LTM3MS45NzUzMTRtMC01OC41MTQyODZjLTIuNjc3MDI5IDAtNS4zNTQwNTcgMC4xOTAxNzEtOC4wNDU3MTQgMC41NTU4ODYtMjIxLjAwODQ1NyAzMC42NzYxMTQtMzQyLjczMjggMTgzLjM1NDUxNC0zNDIuNzMyOCA0MjkuOTQ4MzQydjI2OC42NjgzNDNhNTguNTE0Mjg2IDU4LjUxNDI4NiAwIDAgMCA1OC41MTQyODYgNTguNTE0Mjg2aDI5Mi4yNjQyMjhhNTguNTE0Mjg2IDU4LjUxNDI4NiAwIDAgMCA1OC41MTQyODYtNTguNTE0Mjg2VjU3OC43MzU1NDNhNTguNTE0Mjg2IDU4LjUxNDI4NiAwIDAgMC01OC41MTQyODYtNTguNTE0Mjg2aC02NC40OTczNzFjMTQuNDUzMDI5LTM3LjYxMDA1NyA0MS40MTM0ODYtNTIuMTgwMTE0IDc3LjU3NTMxNC02MC40NTk4ODZhNTguNTE0Mjg2IDU4LjUxNDI4NiAwIDAgMCA0NS40MzYzNDMtNTcuMDM2OHYtMTM3LjkwMzU0MmE1OC41NDM1NDMgNTguNTQzNTQzIDAgMCAwLTU4LjUxNDI4Ni01OC41MTQyODZ6IiBmaWxsPSIjY2YzZjc0IiBwLWlkPSIzNzE5Ij48L3BhdGg+PHBhdGggZD0iTTM1OS42MTQxNzEgNjY2LjU1MDg1N2ExNC42Mjg1NzEgMTQuNjI4NTcxIDAgMCAxLTE0LjYyODU3MS0xNC42Mjg1NzFWNDkxLjI3MTMxNGgtNjguMDgxMzcxYTE0LjYyODU3MSAxNC42Mjg1NzEgMCAxIDEgMC0yOS4yNTcxNDNoODcuNzcxNDI4YzguMDg5NiAwIDkuNTY3MDg2IDYuMjkwMjg2IDkuNTY3MDg2IDE0LjM2NTI1OHYxNzUuNTQyODU3YTE0LjYyODU3MSAxNC42Mjg1NzEgMCAwIDEtMTQuNjI4NTcyIDE0LjYyODU3MXpNODcxLjYxNDE3MSA4NDIuMDkzNzE0YTE0LjYyODU3MSAxNC42Mjg1NzEgMCAwIDEtMTQuNjI4NTcxLTE0LjYyODU3MXYtMjkuMjU3MTQzYTE0LjYyODU3MSAxNC42Mjg1NzEgMCAxIDEgMjkuMjU3MTQzIDB2MjkuMjU3MTQzYTE0LjYyODU3MSAxNC42Mjg1NzEgMCAwIDEtMTQuNjI4NTcyIDE0LjYyODU3MXpNODcxLjYxNDE3MSA3NTQuMzIyMjg2YTE0LjYyODU3MSAxNC42Mjg1NzEgMCAwIDEtMTQuNjI4NTcxLTE0LjYyODU3MnYtMTAyLjEzNjY4NWgtNjguMDgxMzcxYTE0LjYyODU3MSAxNC42Mjg1NzEgMCAxIDEgMC0yOS4yNTcxNDNoODcuNzcxNDI4YzguMDg5NiAwIDkuNTY3MDg2IDYuMjkwMjg2IDkuNTY3MDg2IDE0LjM2NTI1N3YxMTcuMDI4NTcxYTE0LjYyODU3MSAxNC42Mjg1NzEgMCAwIDEtMTQuNjI4NTcyIDE0LjYyODU3MnoiIGZpbGw9IiNjZjNmNzQiIHAtaWQ9IjM3MjAiPjwvcGF0aD48L3N2Zz4=);
    background-repeat: no-repeat;
    color: rgba(0,0,0,.7);
    margin-top: 0;
    margin-bottom: 15px;
    margin-left: 0;
    margin-right: 0;
    padding: 20px 20px 20px 60px;
    position: relative;}

头像转动

/*头像转动*/
.avatar{-webkit-transition:0.4s;-webkit-transition:-webkit-transform 0.4s ease-out;transition:transform 0.4s ease-out;-moz-transition:-moz-transform 0.4s ease-out;}
.avatar:hover{transform:rotateZ(360deg);-webkit-transform:rotateZ(360deg);-moz-transform:rotateZ(360deg);}

调整网页宽度

/* 网页宽度 */
 .site {
     margin: 0 auto;
       max-width: 960px;
     overflow: hidden;
 }
html {
    margin-top: 32px !important;
}

小工具及首页文章标题下划线

/* 小工具标题字体样式以及下横线 */
 .widget-title {
     font-size: 18px;
     font-weight: normal;
     color: #21759b;
     border-bottom: 1px solid #ededed;
 }
/* 首页文章标题行高以及下横线 */
 .entry-header .entry-title {
     line-height: 2.181818182;
     border-bottom: 1px solid #ededed;
 }

二级、三级标题样式

/*标题样式*/
.entry-content h2, .comment-content h2, .mu_register h2 {
    font-weight: bold;
    background-color: #f6f6f6;
    margin: 20px 0;
    border-bottom: 0px solid #21759b;
    padding: 5px 12px;
    border-left: 5px solid #21759b;
}

.entry-content h3, .comment-content h3, .mu_register h3 {
    font-weight: bold;
    background-color: #f6f6f6;
    margin: 20px 0;
    border-bottom: 0px solid #53a7dc;
    padding: 0px 12px;
    border-left: 5px solid #53a7dc;
}

归档页面样式修改

#archives {
    position: relative;
}

#archives h3 {
    margin-bottom: 0;
    padding: 0 15px;
    border-bottom: 1px solid #ddd;
    font-size: 20px;
    font-weight: 400;
    text-align: center;
    letter-spacing: 5px
}

#archives ul {
    list-style: none;
    margin: 0 30px;
    padding: 10px 0 20px 10px;
    border-left: 1px solid #ddd;
    font-size: 18px
}

#archives li {
    list-style: none;
    position: relative;
    line-height: 30px
}

#archives ul ul {
    margin: -15px 0 0 0;
    padding: 15px 0 10px 0
}

#archives ul ul li {
    padding: 0 0 0 15px
}

#archives ul ul li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    border-top: 5px dashed transparent;
    border-bottom: 5px dashed transparent;
    border-left: 10px solid #ddd
}

#al_expand_collapse {
    display: inline-block;
    line-height: 24px;
    padding: 0 10px;
    color: #fff;
    font-size: 12px;
    text-decoration: none;
    background: linear-gradient(to bottom, #4caf50 20%, #388e3c 80%) repeat scroll 0 0 transparent;/*这个颜色和下面的我都做了一些修改*/
    background: -webkit-linear-gradient(to bottom, #4caf50 20%, #388e3c 80%) repeat scroll 0 0 transparent
}

#al_expand_collapse:hover {
    background: linear-gradient(to bottom, #388e3c 20%, #4caf50 80%) repeat scroll 0 0 transparent;
    background: -webkit-linear-gradient(to bottom, #388e3c 20%, #4caf50 80%) repeat scroll 0 0 transparent
}

#archives em {
    padding-left: 5px;
    font-size: 12px;
    color: #777
}

#archives .al_mon {
    padding-left: 5px;
    font-size: 14px;
    font-weight: 700
}

#archives .al_mon:after {
    content: "";
    position: absolute;
    left: -10px;
    top: 15px;
    width: 10px;
    height: 1px;
    background: #ddd
}

#archives .al_mon em {
    font-size: 12px;
    font-weight: 400
}

添加面包屑导航

在 functions.php 中加入下列代码：

// 面包屑导航
function breadcrumb() {
  // Check if is front/home page, return
  if ( is_front_page() ) {
    return;
  }
  // Define
  global $post;
  $custom_taxonomy  = ''; // If you have custom taxonomy place it here
  $defaults = array(
    'seperator'   =>  ' / ',
    'id'          =>  'breadcrumb',
    'classes'     =>  'breadcrumb',
    'home_title'  =>  esc_html__( '⚐ Home', '' )
  );
  $sep  = '<li class="seperator">'. esc_html( $defaults['seperator'] ) .'</li>';
  // Start the breadcrumb with a link to your homepage
  echo '<ul id="'. esc_attr( $defaults['id'] ) .'" class="'. esc_attr( $defaults['classes'] ) .'">';
  // Creating home link
  echo '<li class="item"><a href="'. get_home_url() .'">'. esc_html( $defaults['home_title'] ) .'</a></li>' . $sep;
  if ( is_single() ) {
    // Get posts type
    $post_type = get_post_type();
    // If post type is not post
    if( $post_type != 'post' ) {
      $post_type_object   = get_post_type_object( $post_type );
      $post_type_link     = get_post_type_archive_link( $post_type );
      echo '<li class="item item-cat"><a href="'. $post_type_link .'">'. $post_type_object->labels->name .'</a></li>'. $sep;
    }
    // Get categories
    $category = get_the_category( $post->ID );
    // If category not empty
    if( !empty( $category ) ) {
      // Arrange category parent to child
      $category_values      = array_values( $category );
      $get_last_category    = end( $category_values );
      // $get_last_category    = $category[count($category) - 1];
      $get_parent_category  = rtrim( get_category_parents( $get_last_category->term_id, true, ',' ), ',' );
      $cat_parent           = explode( ',', $get_parent_category );
      // Store category in $display_category
      $display_category = '';
      foreach( $cat_parent as $p ) {
        $display_category .=  '<li class="item item-cat">'. $p .'</li>' . $sep;
      }
    }
    // If it's a custom post type within a custom taxonomy
    $taxonomy_exists = taxonomy_exists( $custom_taxonomy );
    if( empty( $get_last_category ) && !empty( $custom_taxonomy ) && $taxonomy_exists ) {
      $taxonomy_terms = get_the_terms( $post->ID, $custom_taxonomy );
      $cat_id         = $taxonomy_terms[0]->term_id;
      $cat_link       = get_term_link($taxonomy_terms[0]->term_id, $custom_taxonomy);
      $cat_name       = $taxonomy_terms[0]->name;
    }
    // Check if the post is in a category
    if( !empty( $get_last_category ) ) {
      echo $display_category;
      echo '<li class="item item-current">'. get_the_title() .'</li>';
    } else if( !empty( $cat_id ) ) {
      echo '<li class="item item-cat"><a href="'. $cat_link .'">'. $cat_name .'</a></li>' . $sep;
      echo '<li class="item-current item">'. get_the_title() .'</li>';
    } else {
      echo '<li class="item-current item">'. get_the_title() .'</li>';
    }
  } else if( is_archive() ) {
    if( is_tax() ) {
      // Get posts type
      $post_type = get_post_type();
      // If post type is not post
      if( $post_type != 'post' ) {
        $post_type_object   = get_post_type_object( $post_type );
        $post_type_link     = get_post_type_archive_link( $post_type );
        echo '<li class="item item-cat item-custom-post-type-' . $post_type . '"><a href="' . $post_type_link . '">' . $post_type_object->labels->name . '</a></li>' . $sep;
      }
      $custom_tax_name = get_queried_object()->name;
      echo '<li class="item item-current">'. $custom_tax_name .'</li>';
    } else if ( is_category() ) {
      $parent = get_queried_object()->category_parent;
      if ( $parent !== 0 ) {
        $parent_category = get_category( $parent );
        $category_link   = get_category_link( $parent );
        echo '<li class="item"><a href="'. esc_url( $category_link ) .'">'. $parent_category->name .'</a></li>' . $sep;
      }
      echo '<li class="item item-current">'. single_cat_title( '', false ) .'</li>';
    } else if ( is_tag() ) {
      // Get tag information
      $term_id        = get_query_var('tag_id');
      $taxonomy       = 'post_tag';
      $args           = 'include=' . $term_id;
      $terms          = get_terms( $taxonomy, $args );
      $get_term_name  = $terms[0]->name;
      // Display the tag name
      echo '<li class="item-current item">'. $get_term_name .'</li>';
    } else if( is_day() ) {
      // Day archive
      // Year link
      echo '<li class="item-year item"><a href="'. get_year_link( get_the_time('Y') ) .'">'. get_the_time('Y') . '年</a></li>' . $sep;
      // Month link
      echo '<li class="item-month item"><a href="'. get_month_link( get_the_time('Y'), get_the_time('m') ) .'">'. get_the_time('M') .'</a></li>' . $sep;
      // Day display
      echo '<li class="item-current item">'. get_the_time('jS') .' '. get_the_time('M'). '</li>';
    } else if( is_month() ) {
      // Month archive
      // Year link
      echo '<li class="item-year item"><a href="'. get_year_link( get_the_time('Y') ) .'">'. get_the_time('Y') . '年</a></li>' . $sep;
      // Month Display
      echo '<li class="item-month item-current item">'. get_the_time('M') .'</li>';
    } else if ( is_year() ) {
      // Year Display
      echo '<li class="item-year item-current item">'. get_the_time('Y') .'年</li>';
    } else if ( is_author() ) {
      // Auhor archive
      // Get the author information
      global $author;
      $userdata = get_userdata( $author );
      // Display author name
      echo '<li class="item-current item">'. 'Author: '. $userdata->display_name . '</li>';
    } else {
      echo '<li class="item item-current">'. post_type_archive_title() .'</li>';
    }
  } else if ( is_page() ) {
    // Standard page
    if( $post->post_parent ) {
      // If child page, get parents
      $anc = get_post_ancestors( $post->ID );
      // Get parents in the right order
      $anc = array_reverse( $anc );
      // Parent page loop
      if ( !isset( $parents ) ) $parents = null;
      foreach ( $anc as $ancestor ) {
        $parents .= '<li class="item-parent item"><a href="'. get_permalink( $ancestor ) .'">'. get_the_title( $ancestor ) .'</a></li>' . $sep;
      }
      // Display parent pages
      echo $parents;
      // Current page
      echo '<li class="item-current item">'. get_the_title() .'</li>';
    } else {
      // Just display current page if not parents
      echo '<li class="item-current item">'. get_the_title() .'</li>';
    }
  } else if ( is_search() ) {
    // Search results page
    echo '<li class="item-current item">Search results for: '. get_search_query() .'</li>';
  } else if ( is_404() ) {
    // 404 page
    echo '<li class="item-current item">' . 'Error 404' . '</li>';
  }
  // End breadcrumb
  echo '</ul>';
}

然后在 header.php 末尾添加下列代码：

<?php// 文章页面添加面包屑导航
if ( function_exists('breadcrumb') ) breadcrumb();
?>

最后添加样式代码：

/* 面包屑导航样式 */
 .breadcrumb {
     font-size: 12px;
     color: #888;
     margin:0 auto;
 }
 .breadcrumb a {
     color: #888;
 }
 .breadcrumb a:not(.dots):hover {
     color: #CC0033;
 }
 .breadcrumb li {
     display: inline;
     line-height:20px;
 }

首页文章标题、正文标题下方添加元素

其中有一个用于统计每篇文章的字数的代码，需要添加到 functions.php 文件中。

//字数统计
function zm_count_words ($text) {
    global $post;
    $output='';
    if (empty($text)) {
        $text = $post->post_content;
        if (mb_strlen($output, 'UTF-8') < mb_strlen($text, 'UTF-8')) $output .= '<span class="word-count">共' . mb_strlen(preg_replace('/\s/','',html_entity_decode(strip_tags($post->post_content))),'UTF-8') .'字</span>';
        return $output;
    }
}

打开 content.php，找到以下代码：

<?php if ( is_single() ) : ?>
<h1 class="entry-title"><?php the_title(); ?></h1>
<?php else : ?>

然后在 <?php else: ?> 的上面添加以下代码：

<p class="meta"><!--文章页标题下标签-->
Auth:<?php the_author_nickname(); ?>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
Date:<?php echo the_time('Y/m/j'); ?>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
Cat:<?php the_category('、'); ?>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
Word:<?php echo zm_count_words($text); ?>
</p>

在 content.php 找到<footer></footer>，将这两个标签内（包括这两个标签）的所有内容删除，并替换为以下代码：

<?php if ( is_single() ) : ?>
            <footer class="content-foot"><!--文章页脚部显示修改-->
                <?php the_tags('⚑Tags：','、'); ?>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
            </footer><!-- .content-foot -->
        <?php else : ?>
            <footer class="home-foot"><!--除文章页脚部显示修改-->
                ◷<?php echo the_time('Y/m/j'); ?>&nbsp&nbsp
                @<?php the_author_nickname(); ?>&nbsp&nbsp
                ▤<?php the_category('、'); ?>&nbsp&nbsp
                ⚑<?php the_tags('','、'); ?>
                <?php edit_post_link( __( '——编辑', 'twentytwelve-child' ), '<span class="edit-link">', '</span>' ); ?>
            </footer><!-- .entry-meta -->
        <?php endif;  // is_single() ?>

最后添加样式代码：

/* 文章页标题、meta块、和脚部样式修改 */
#content .title {
    font-size: 24px;
    padding-bottom: 24px;
    text-align: center;
}
#content .meta {
    font-size: 13px;
    padding: 10px 0 10px 0;
    border: 1px dashed rgba(0, 0, 0, 0.15);
    text-align: center;
    letter-spacing: 0.035rem;
}
#content .content-foot {
    font-size: 13px;
    padding: 10px 0 10px 24px;
    margin: 0 -24px -24px -24px;
    letter-spacing: 0.035rem;
    background-color: #ededed;
}

禁止加载语言包

在 functions.php 中加入下列代码：

//关闭翻译
add_filter('locale', function($locale) {
    $locale = ( is_admin() ) ? $locale : 'en_US';
    return $locale;
});

为摘要添加“继续阅读”字样

//为摘要添加继续阅读字样
// Remove the ... from excerpt and change the text
function change_excerpt_more()
{
function new_excerpt_more($more)
{
// Use .read-more to style the link
return '......<span class="read-more"> <a href="' . get_permalink($post->ID) . '"><br/><br/>继续阅读»»»</a></span>';
}
add_filter('excerpt_more', 'new_excerpt_more');
}
add_action('after_setup_theme', 'change_excerpt_more');

页面添加 html 后缀

//WordPress页面链接添加html后缀
function html_page_permalink() {
global $wp_rewrite;
if ( !strpos($wp_rewrite->get_page_permastruct(), '.html')){
$wp_rewrite->page_structure = $wp_rewrite->page_structure . '.html';
}
}
add_action('init', 'html_page_permalink', -1);

修改全局字体

我采用的是开源字体——霞鹜文楷。在 header.php 添加下列代码：

<!-- Screen version -->
<link rel="stylesheet" href="https://npm.elemecdn.com/lxgw-wenkai-screen-webfont@1.1.0/style.css" />
  <style>
    body {
      /* Screen version */
      font-family: "LXGW WenKai Screen", sans-serif;
    }
  </style>

网站统计小工具

在主题目录新建文件 widget-websitestat.php，并添加下列内容。

<?php
// WordPress统计信息小工具

// 定义小工具的类 EfanWebsitestat
class EfanWebsitestat extends WP_Widget{

  function __construct(){
    // 定义小工具的构造函数
    $widget_ops = array('classname' => 'widget_Websitestat', 'description' => '显示网站的统计信息');
//     $this->WP_Widget(false, '网站统计', $widget_ops);
    parent::__construct( false, '网站统计', $widget_ops);
  }

  function form($instance){
    // 表单函数,控制后台显示
    // $instance 为之前保存过的数据
    // 如果之前没有数据的话,设置默认量
    $instance = wp_parse_args(
      (array)$instance,
      array(
        'title' => '网站信息统计',
        'establish_time' => '2021-01-01'
      )
    );

    $title = htmlspecialchars($instance['title']);
    $establish_time = htmlspecialchars($instance['establish_time']);

    // 表格布局输出表单
    $output = '<table>';
    $output .= '<tr><td>标题</td><td>';
    $output .= '<input id="'.$this->get_field_id('title') .'" name="'.$this->get_field_name('title').'" type="text" value="'.$instance['title'].'" />';
    $output .= '</td></tr><tr><td>建站时间：</td><td>';   
    $output .= '<input id="'.$this->get_field_id('establish_time') .'" name="'.$this->get_field_name('establish_time').'" type="text" value="'.$instance['establish_time'].'" />';   
    $output .= '</td></tr></table>';  
    echo $output;   
  }

  function update($new_instance, $old_instance){
    // 更新数据的函数
    $instance = $old_instance;
    // 数据处理
    $instance['title'] = strip_tags(stripslashes($new_instance['title']));
    $instance['establish_time'] = strip_tags(stripslashes($new_instance['establish_time']));
    return $instance;
  }

  function widget($args, $instance){
    extract($args); //展开数组
    $title = apply_filters('widget_title',empty($instance['title']) ? ' ' : $instance['title']);
    $establish_time = empty($instance['establish_time']) ? '2021-01-01' : $instance['establish_time'];
    echo $before_widget;
    echo $before_title . $title . $after_title;
    echo '<div class="widgest-boys"><ul>';
    $this->efan_get_websitestat($establish_time);
    echo '</ul></div>';
    echo $after_widget;
  }

  function efan_get_websitestat($establish_time){
    // 相关数据的获取
    global $wpdb;
    $count_posts = wp_count_posts();
    $published_posts = $count_posts->publish;
    $comments_count = $wpdb->get_var("SELECT COUNT(*) FROM $wpdb->comments");
    $time = floor((time()-strtotime($establish_time))/86400);
    $count_tags = wp_count_terms('post_tag');
    $count_pages = wp_count_posts('page');
    $link = $wpdb->get_var("SELECT COUNT(*) FROM $wpdb->links WHERE link_visible = 'Y'"); 
    $users = $wpdb->get_var("SELECT COUNT(ID) FROM $wpdb->users");
    $last = $wpdb->get_results("SELECT MAX(post_modified) AS MAX_m FROM $wpdb->posts WHERE (post_type = 'post' OR post_type = 'page') AND (post_status = 'publish' OR post_status = 'private')");
    $last = date('Y-m-d', strtotime($last[0]->MAX_m));
    $total_views = $wpdb->get_var("SELECT SUM(meta_value+0) FROM $wpdb->postmeta WHERE meta_key = 'views'");  
    // 显示数据
    $output = '<div class="widgest-bg widgest-bg1 wb-top"><div class="widgest-main"><div class="widgest-meat"><li><i class="fa fa-snowflake-o" aria-hidden="true"></i> 文章总数：';
    $output .= $published_posts;
    $output .= ' 篇</li></div></div></div>';
    $output .= '<div class="widgest-bg widgest-bg2"><div class="widgest-main"><div class="widgest-meat"><li><i class="fa fa-paper-plane-o" aria-hidden="true"></i> 评论数目：';
    $output .= $comments_count;
    $output .= ' 条</li></div></div></div>';
    $output .= '<div class="widgest-bg widgest-bg3"><div class="widgest-main"><div class="widgest-meat"><li><i class="fa fa-star-o" aria-hidden="true"></i> 标签总数：';
    $output .= $count_tags;
    $output .= ' 个</li></div></div></div>';
    $output .= '<div class="widgest-bg widgest-bg4"><div class="widgest-main"><div class="widgest-meat"><li><i class="fa fa-pie-chart" aria-hidden="true"></i> 浏览次数：';
    $output .= $total_views;
    $output .= ' 次</li></div></div></div>';
    $output .= '<div class="widgest-bg widgest-bg5"><div class="widgest-main"><div class="widgest-meat"><li><i class="fa fa-link" aria-hidden="true"></i> 友链总数：';
    $output .= $link;
    $output .= ' 个</li></div></div></div>';

    $output .= '<div class="widgest-bg widgest-bg7"><div class="widgest-main"><div class="widgest-meat"><li><i class="fa fa-refresh" aria-hidden="true"></i> 运行天数：';
    $output .= $time;
    $output .= ' 天</li></div></div></div>';
    $output .= '<div class="widgest-bg widgest-bg8"><div class="widgest-main"><div class="widgest-meat"><li><i class="fa fa-calendar" aria-hidden="true"></i> 建站时间：';
    $output .= $establish_time;
    $output .= '</li></div></div></div>';
    $output .= '<div class="widgest-bg widgest-bg9"><div class="widgest-main"><div class="widgest-meat"><li><i class="fa fa-clock-o" aria-hidden="true"></i> 最后更新：';
    $output .= $last;
    $output .= '</li></div></div></div>';
    //   页面生成耗时+数据库查询  
    $output .= '<div class="widgest-bg widgest-bg10"><div class="widgest-main"><div class="widgest-meat"><li><i class="fa fa-podcast" aria-hidden="true"></i> 数据查询：';
    $output .= get_num_queries();
    $output .= ' 次 </li></div></div></div>';
    $output .= '<div class="widgest-bg widgest-bg11 wb-bottom"><div class="widgest-main"><div class="widgest-meat"><li><i class="fa fa-hourglass-half" aria-hidden="true"></i> 生成耗时：';
    $output .= timer_stop(0,5);
    $output .= '秒</li></div></div></div>';
    echo $output;
  }
}

function EfanWebsitestat(){
  // 注册小工具
  register_widget('EfanWebsitestat');
}

add_action('widgets_init','EfanWebsitestat');

?>

然后在 functions.php 文件中加入下列代码。

//添加站点统计小工具
include("widget-websitestat.php");

网站后台添加小工具即可。

写完哪本书了？

详见文章《ChatGPT 帮我写代码，实现“已写完哪本书”统计》

大致就是以上这些，具体还有一些小细节，我直接在 style.css 对照审查元素进行修改了，没有记录，需要的可以下载文件，对照我博客进行修改。

参考文章：

下载地址

我修改的：GitHub
木头人修改版：蓝奏网盘

关于我的博客

me@yinji.org (青山) — Sat, 06 Feb 2021 00:00:00 +0000

之前在网上看到过这样一句话：当你不知道该写什么的时候就写如何搭建博客。不过，我这篇不是要讲如何搭建，而是介绍下我博客的相关信息。因为经常会有网友给我留言，问我博客是什么程序、什么主题，用的什么服务器之类的问题，今天就整理下。

博客程序	WordPress
博客主题	Twenty Twelve
域名	腾讯云
服务器	腾讯云（学生机）
域名解析	DNSPod
服务器面板	宝塔面板

博客基本的信息就是表格里所示。现在详细说一说。

服务器

其实如果对个人博客要求不高的话，简单的虚拟主机就可以满足。2018年我刚开始建博客的时候用的就是虚拟主机，从**老薛主机，到网硕互联**，最后才到腾讯云的学生机。服务器可以折腾很多东西，不喜欢折腾只想简简单单写博客的，虚拟主机是最好的选择。

对于服务器，如果你是25岁以下的用户，你可以享受腾讯云和阿里云的学生优惠，对付一个博客足够了；如果不是，腾讯云和阿里云也有实惠套餐供你选择。国内服务器推荐阿里云和腾讯云，国外服务器没用过，不做推荐。

对于虚拟主机，篱落主机、老薛主机、衡天主机、恒创主机，价格实惠，配置较好，可以尝试。

域名

域名不建议选择非主流域名，我博客第一个域名是 men 后缀：longest.men，取“最长的男人”之意，现在用的 com 域名都是在网硕互联买虚拟主机的时候赠送注册的。

是否备案取决自己，各有各的好处。已备案的域名可以享受国内服务器/虚拟主机和CDN服务，速度较快，但是多多少少会受到约束；未备案的域名只能使用大陆以外地区的服务器/虚拟主机，约束少，但速度会受到影响。

com/cn/net可以考虑首选，me做个人博客域名很适合。域名注册平台，国内可以选择新网、万网(阿里云)、西部数码、趣域……国外平台可以选择 Namecheap、GoDaddy(狗爹)、NameSilo、Dynadot、Porkbun……另外推荐域名比价平台：哪煮米、NameBeta。

程序

前前后后用过 WordPress、Typecho、zblog、emlog，最后觉得 WordPress 更上手，生态强大，可操作性强，容易折腾，功能也比较完善。尽管有人觉得它过于臃肿，加载较慢，但看看我博客，慢吗？当然方案也不止这一种。

静态博客也是一个不错的选择，例如 Hexo、Gridea、Jekyll、Hugo……这些皆可搭配 Github、Coding，再配上免费的二级域名，无成本即可搭建一个博客，我不太了解，网上教程很多，自行搜索即可。

插件

在插件方面，我一向就是能用代码尽量不用插件。

commonWP
Comet Cache
twentytwelve 主题功能增强
积木箱子
豆瓣读书观影记录

第一个用来缓存博客后台相关文件，第二个类似 WP Super Cache ，第三个插件是我基于 沙唐桔 制作的主题增强插件，在他的代码基础上加了别的功能。并且采用 ZWWoOoOo 的文章归档教程制作了 归档页面 。用 豆瓣读书观影记录 制作了两个页面：阅读记录、观影记录。主题css方面稍微修改了，具体修改在哪，自行查看源代码并对比原版主题即可。

主题

个人博客的话，官方的主题基本能满足需求。例如我现在用的 Twenty Twelve，过去使用的 Twenty Fifteen，各有特色。诸如此类的免费主题还有很多，各大主题聚合站基本都有；付费主题作者推荐：nicetheme、XinTheme，主题质量和售后服务蛮不错。

优化

建议的优化方案是配置 CDN，开启动静分离，但我没这么做，太复杂了，我折腾容易出错。于是我就在服务器方面进行了优化。使用 Memcached 缓存数据库加速 WordPress 网站；使用 Comet Cache 静态缓存插件。在主题方面，简化代码、屏蔽没用的功能，这些用上面提到的 twentytwelve 主题功能增强 插件就可以做到。CDN 推荐七牛云、又拍云、腾讯云、阿里云，如果是国外服务器，则推荐 Cloudflare。

RSS阅读

这方面主要有两个方案：自己建的和第三方平台。

自建 RSS 主要推荐：蚁阅、Tiny Tiny Rss
第三方平台推荐：Inoreader、Feedly、RSS 追踪可以参考我以前的文章：
RSS追踪：Windows平台上一款好用的RSS阅读器
我还是更喜欢这样的RSS阅读

上述所列的仅供参考，具体使用还得看个人。我的博客马上三周年，写了近三年，用了 WordPress 近三年，多多少少也有点经验，今天写出来权当分享经验，如有错误，欢迎指正。如果对博客建设方面还有问题，欢迎联系我。