添加 html 代码

如果您的 typecho 博客模板是 handsome，则直接在主题后台自定义输出 body 尾部的 HTML 代码中添加如下 html 代码：

<div class="deng-box1"> <div class="deng"> <div class="xian"></div> <div class="deng-a"> <div class="deng-b"><div class="deng-t">新年</div></div> </div> <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div> </div> </div>
<div class="deng-box2"> <div class="deng"> <div class="xian"></div> <div class="deng-a"> <div class="deng-b"><div class="deng-t">快乐</div></div> </div> <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div> </div> </div>

添加 css 代码

在您的模板后台自定义 css 中添加如下代码：

.deng-box1 {
    position: fixed;
    top: -30px;
    left: 5px;
    z-index: 9999;
    pointer-events: none;
}

.deng {
    position: relative;
    width: 120px;
    height: 90px;
    margin: 50px;
    background: #d8000f;
    background: rgba(216, 0, 15, 0.8);
    border-radius: 50% 50%;
    -webkit-transform-origin: 50% -100px;
    -webkit-animation: swing 5s infinite ease-in-out;
    box-shadow: -5px 5px 50px 4px rgba(250, 108, 0, 1);
}

.deng::before {
    position: absolute;
    top: -7px;
    left: 29px;
    height: 12px;
    width: 60px;
    content: " ";
    display: block;
    z-index: 999;
    border-radius: 5px 5px 0 0;
    border: solid 1px #dc8f03;
    background: #ffa500;
    background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03);
}

.xian {
    position: absolute;
    top: -20px;
    left: 60px;
    width: 2px;
    height: 20px;
    background: #dc8f03;
}

.deng-box1 {
    pointer-events: none;
}

.deng-a {
    width: 100px;
    height: 90px;
    background: #d8000f;
    background: rgba(216, 0, 15, 0.1);
    margin: 12px 8px 8px 10px;
    border-radius: 50% 50%;
    border: 2px solid #dc8f03;
}

.deng-b {
    width: 45px;
    height: 90px;
    background: #d8000f;
    background: rgba(216, 0, 15, 0.1);
    margin: -2px 8px 8px 26px;
    border-radius: 50% 50%;
    border: 2px solid #dc8f03;
}

.deng-t {
    font-family: 华文行楷,Arial,Lucida Grande,Tahoma,sans-serif;
    font-size: 1.5rem;
    color: #ffa500;
    font-weight: bold;
    line-height: 42px;
    text-align: center;
    width: 25px;
    margin: 0 auto;
}

.shui-a {
    position: relative;
    width: 5px;
    height: 20px;
    margin: -5px 0 0 59px;
    -webkit-animation: swing 4s infinite ease-in-out;
    -webkit-transform-origin: 50% -45px;
    background: #ffa500;
    border-radius: 0 0 5px 5px;
}

.shui-c {
    position: absolute;
    top: 18px;
    left: -2px;
    width: 10px;
    height: 35px;
    background: #ffa500;
    border-radius: 0 0 0 5px;
}

.shui-b {
    position: absolute;
    top: 14px;
    left: -2px;
    width: 10px;
    height: 10px;
    background: #dc8f03;
    border-radius: 50%;
}

.deng::after {
    position: absolute;
    bottom: -7px;
    left: 10px;
    height: 12px;
    width: 60px;
    content: " ";
    display: block;
    margin-left: 20px;
    border-radius: 0 0 5px 5px;
    border: solid 1px #dc8f03;
    background: #ffa500;
    background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03);
}

.deng-box2 {
    position: fixed;
    top: -30px;
    right: 5px;
    z-index: 9999;
    pointer-events: none;
}

.deng-box2 .deng {
    position: relative;
    width: 120px;
    height: 90px;
    margin: 50px;
    background: #d8000f;
    background: rgba(216, 0, 15, 0.8);
    border-radius: 50% 50%;
    -webkit-transform-origin: 50% -100px;
    -webkit-animation: swing 5s infinite ease-in-out;
    box-shadow: -5px 5px 30px 4px rgba(252, 144, 61, 1);
}

.deng-box2 {
    pointer-events: none;
}

@-moz-keyframes swing {
    0% {
        -moz-transform: rotate(-10deg)
    }

    50% {
        -moz-transform: rotate(10deg)
    }
 
    100% {
        -moz-transform: rotate(-10deg)
    }
}

@-webkit-keyframes swing {
    0% {
        -webkit-transform: rotate(-10deg)
    }

    50% {
        -webkit-transform: rotate(10deg)
    }

    100% {
        -webkit-transform: rotate(-10deg)
    }
}

如果您不想在手机端显示效果，可以在自定义 css 中追加如下代码：

@media (max-width: 900px){.deng-box1{display:none;}}
@media (max-width: 900px){.deng-box2{display:none;}}

最后，清除网站缓存刷新下页面，灯笼就出来了。

特别说明：本文来源于网络

截至2022.8.19号jishula.com正在搭建中

本站历史网站源码文章：

域名

建站首先需要拥有一个属于自己的域名，可以选择在腾讯云阿里云聚名等注册商进行注册，市面上常见的有com cn net等，推荐大家注册这三种主流的后缀。

如何注册

以腾讯云为例，首先打开腾讯云官网注册一个自己的账号并实名认证通过，让后点击域名注册，输入自己想好的前缀点击注册即可，需要注意的是域名是按年购买续费的。

服务器

首先需要选择使用国外还是国内的服务器，选择国内的服务器需要进行备案，注意这里备案指的是备案自己的域名，选择国外则不需要备案。国外的服务器相对来说会比较贵一点而且国内用户访问会非常慢，国内服务器需要进行域名备案才可以使用，国内用户访问网站速度快。推荐大家进行网站备案选择国内服务器。

如何挑选服务器

新手首次建站选择一个配置最低的就可以，因为访问量比较少不太吃配置，服务器商有很多市面上常见的大厂有腾讯云阿里云华为云等。以腾讯云为例推荐购买最便宜的轻量应用服务器，购买地址https://curl.qcloud.com/1XazdfiS

如图，最便宜的低至65/年，当然一个用户只能购买一次，而且续费不是同价。对于新手建站足够用了。

如何使用服务器

首先进入控制台，点击轻量应用服务器找到自己的服务器，点击更多-管理-重装系统让后选择官方镜像-应用镜像-宝塔 Linux 面板，进行安装，安装成功后会告诉你面板的账号密码以及地址。后返回刚才的页面，点击更多-管理-防火墙-放行80端口即可。

以上操作完成后前往你的面板地址，输入账号密码登录即可，按照提示安装环境，等待安装成功后就可以建站啦！

解析

腾讯云控制台-域名-解析-找到自己的域名点击解析，点击添加记录主机记录就是域名前缀，常见用法有：
www ：解析后的域名为 www.dnspod.cn
@ ：直接解析主域名 dnspod.cn
*：泛解析，匹配其他所有域名 *.dnspod.cn

记录类型选择A，记录值填写自己服务器的公网IP，点击确认即可

添加站点

登录宝塔后点击网址，添加站点，输入自己的域名点击提交，提交成功后点击自己添加好网站的根目录进行上传文件，文件及网站的源码，可以去本博客下载自己喜欢的源码，比如https://6hi.cn/118.html个人介绍页源码，下载上传并解压即可。在次访问你的域名就可以看到漂亮的网站了。

另外有什么不懂的可以在下方评论。

webp是谷歌推出的一种图片格式，它的优点就是同等画面质量下，体积比 jpg、png 这些少了 25% 以上。

webp图片的好处

一张 jpg 图片大小"2M"，转化为webp格式后成了"1M"，这样以来可以减少服务器的存储空间，提高图片的加载速度。

webp图片的坏处

那么既然 webp 这么好，为什么没有大范围使用呢？因为老版本的浏览器可能不兼容，可以在 caniuse 上可以查到webp目前浏览器的兼容情况。

废话不多说那么接下来教大家如何把jpg/png格式的图片转换为webp图片

如何批量转换

在市面上一些比较火的网站或者软件，不是收费就是不能批量转换。这里推荐大家一款应用，可以免费批量转换格式。

IrfanView转换工具，IrfanView是一款快速、紧凑、小巧且免费的图像查看器和转换器，IrfanView官网为：www.irfanview.com

另外推荐两个良心软件：智图、格式工厂

如何下载安装

首先需要下载安装包，根据自己的设备选择，32位就选32位的 64就选择64位的。选择下载安装程序安装即可。

下载并安装完成后需要下载插件，这里建议直接下载所有插件。

如何设置为中文

首先需要下载安装语言包，下载地址https://www.irfanview.com/languages.htm

下载完成后将下载的文件解压缩到“IrfanView\Languages\”文件夹中。启动IrfanView并进入“Options--> Change - Language”更改语言即可

如何使用

启动IrfanView并进入"文件 - 批量转换"选择需要转换的图片，如何选择转换后储存的目录，点击转换即可。

Typecho如何完全配置伪静态

首先需要在宝塔面板配置伪静态为typecho，也可以直接复制这串代码加到伪静态里，保存即可。

    if (!-e $request_filename) {
        rewrite ^(.*)$ /index.php$1 last;
    }

若设置伪静态后，网站无法正常访问，请尝试设置回 default。

Typecho地址重写功能

配置伪静态还需要在typecho后台-设置-永久链接-开启地址重写功能。地址重写即 rewrite 功能是某些服务器软件提供的优化内部连接的功能。打开此功能可以让你的链接看上去完全是静态地址。

什么是伪静态，伪静态有什么作用

伪静态是相对真实静态来讲的，通常我们为了是为了增强搜索引擎的友好面，非常有利于SEO。伪静态不仅对搜索引擎友好，而且看起来链接也非常的简介。

如何自定义文章路径，使链接达到最简

在typecho后台-设置-永久链接-自定义文章路径中选择个性化定义，更改为

/{cid}.html

这样以来伪静态就配置完成了，地址也做到最简了。最后提醒大家修改伪静态需谨慎，修改链接后会造成原链接失效的问题。

不要去记你的密码，而是记住一种规则你将拥有无数个无法被破解的密码。

不知道大家使用的密码里是否包含了自己的生日、名字这种字符，本篇文章为大家分享一下如何拥有一套强大的切安全的密码系统。

一个密码的强大与否和他的字符的复杂程度有关，比如一串生日注册的密码，在暴力破解下只需要几秒就可以完成。暴力破解就是用计算机对数字、字母或符号进行各类组合，直到组合出你的密码，虽然听起来像是碰运气，但是只要计算机的速度够快，如何你的密码又简单的话，破解就是分分秒秒的事。

如何设置极度安全的密码?

处于安全考虑我们首先要优化密码的复杂程度，如何优化：

1. 首先不要包含你个人的任何信息，名字、生日或者是你喜欢的人的名字，通通不要！
2. 至少要包含数字、大小写字母和符号
3. 避免连续的数字和字母
4. 密码尽可能的长
5. 总之要选择一个只有你自己才能一眼看明白的密码
6. 还有一个非常重要的问题，就是你不要在所有平台使用相同的密码，当不法之徒知道了你的一个密码他就可以尝试登录的其他平台。还有就像是前些天"学习通"一样，有可能平台会不小心泄露用户的密码。

md5加密

除了以上这些以外还有一种更安全的方案就是md5加密这是一种不可逆的加密算法，程序员们应该都很熟悉，编程时非常常见的加密方式。

完结撒花愿大家的密码永远不会被破解。

特别声明：素材来源于网络

如何添加浏览数统计插件

首先需要下载此插件，后将插件上传到typecho文件夹下的 /usr/plugins/ 目录下。然后启动该插件，此插件会在 contents 表中新增字段:viewsNum，这样以来就有了浏览量统计的功能。浏览数据保存在 cookie中，在不清除 cookie 或者 cookie 未过期的情况下不会重复计数。

添加完成后如图所示：

typecho浏览量统计插件下载地址

typecho浏览量统计插件

密码：6hi.cn

如何使用评论邮件提醒插件

首先需要下载此插件，让后将插件上传到typecho文件夹下的 /usr/plugins/ 目录下。然后启动该插件并配置smtp服务器、邮箱地址、密码、以及端口。以 QQ 邮箱为例。
smtp 服务器地址： smtp.qq.com
邮箱地址：用来发送邮件的账号
密码：开启 smtp 服务的时候系统生成的 授权码 ，注意不是自己的邮箱登录密码
端口：端口 465 或 587

typecho评论邮件提醒文件下载地址

typecho评论邮件提醒插件

密码：6hi.cn

使用国内服务器

因为本站域名已经备案成功，所以使用的是国内服务器，这样以来要比国外以及香港快不少。

图片压缩

由于现在拍照设备都比较先进，像素自然高，随便一张照片就能高达十几M，这样以来用户访问网站时加载速度便会非常缓慢。

我的解决方案是压缩图片，在图片失针少的前提下尽可能压缩图片的体积，这样以来图片的加载速度将会大大提升。

我使用的图片压缩网站：https://tinypng.com/

本站的卡片背景图之前用的是几十M大小的高清壁纸，所以用户首次加载也需要一定的时间，现已全部通过图片压缩的方式全部替换。

转换图片格式为webp

一张 jpg 图片大小 "2M"，转化为 webp 格式后成了 "1M"，这样以来可以减少服务器的存储空间，提高图片的加载速度。

如何转换：https://6hi.cn/107.html

CDN加速

已经备案完成，那就自然要用cdn进行加速了。

什么是cdn：CDN 的全称是 Content Delivery Network，即内容分发网络。CDN 是构建在网络之上的内容分发网络，依靠部署在各地的边缘服务器，通过中心平台的负载均衡、内容分发、调度等功能模块，使用户就近获取所需内容，降低网络拥塞，提高用户访问响应速度和命中率。CDN 的关键技术主要有内容存储和分发技术。

我使用的是腾讯云的cdn，目前首单活动3元50G还是比较划算的

活动链接：【腾讯云】爆款云服务器限时体验20元起，更多上云必备产品低至1元

我刚购买完腾讯云就发短信告诉我新用户首购赠送10G国内流量包。

让后呢，我刚接入成功又给我发短信说赠送10G。

最后我配置完成又赠送了100G免费试用流量包，分5个月每个月20G。

这次腾讯云实在是太良心了！三块钱我算了一下一共买了170G的流量包，买50G送120G实在是舒服。

镜像存储

镜像存储服务是一种快速的数据迁移和加速服务。可以帮助用户实现无缝数据迁移。它实现的功能是用户在访问镜像域名上的一个资源时，云存储会先检测该资源在云存储服务器上是否已经存储，如果有则直接返回，没有的话，会根据路径到源站（也就是你的博客）获取对应的资源，然后返回给用户。除了用户第一次访问时要回源速度稍慢，后面就会完整发挥 CDN 的优势，速度都会非常快。

举个栗子，假如我博客的域名是 https://6hi.cn，配置的镜像存储域名是 https://cdn.6hi.cn，那么，在第一次访问下面这个链接时：

https://cdn.6hi.cn/path/to/whatever/pig.jpg

镜像存储就会到下面这个地址获取内容， 然后返回给用户：

https://6hi.cn/path/to/whatever/pig.jpg

后面镜像存储已经存储了这张图片时，就会直接返回给用户，速度很快。

以上为我自己所用的几个方法，当然优化网站还有很多的方法，暂时就不介绍了(打死也不会说其他方法我不会的)。可能你觉得我的博客图片加载速度还是缓慢，这主要是我文章卡片背景图引起的，可能有些压缩的不够彻底，所以就算你网速在好，加载图片还是很缓慢的。

放上一张测速图，绿油油的真好！

测速详情： https://www.boce.com/http/3df0b6e73af8780a29d8e231c198ede0.html

咦，鸡屁股为啥不绿

用别人提供的不如用官方的

1.API 接口（qq 号式）：

https://q1.qlogo.cn/g?b=qq&nk=QQ号码&s=640

不想用 ssl，请把 s 去掉。

640 是大小，可以是 640,100

2.API 接口（邮箱式）：

https://q2.qlogo.cn/headimg_dl?dst_uin=QQ邮箱&spec=640

亲测 100 也有效

3.API 接口（来自 QQ 空间）：

https://qlogo.store.qq.com/qzone/QQ号/QQ号/大小

同时它的地址前缀可以换成 qlogo1、qlogo2、qlogo3、qlogo4 哦，其实都一样的。 640,100 都行

还可以利用 api 接口地址获取你的 QQ 空间头像地址：

http://users.qzone.qq.com/fcg-bin/cgi_get_portrait.fcg?uins=1176996982

再附一个 https 的 QQ 头像 API 接口：

http://ptlogin2.qq.com/getface?appid=1006102&imgtype=3&uin=1176996982

同样会返回 json 数据，然后自行提取你的专属头像网址。