资源分享

使用css给网站添加一个背景

最近有空给网站除草了，在这里也做了一些小优化，添加网站背景图片看起来不这么单调。 简单记录折腾日志。 添加渐变背景 CSS 折叠 复制 body::before { content: ''; position: fixed; top: 0; left: 0; right: 0; bottom: 0; …

2024 年 07 月 13 日

1 分钟

浏览器原生img懒加载方案 - Lazy loading

Lazy loading，在浏览器滚动像素识别，在首屏的图片先完成加载，其他屏幕外的图片通过将资源标识为非首先加载，从而在需要加载的时候再加载，从而提升网页浏览体验。

2023 年 07 月 25 日

1 分钟

Navidrome - 自建云端音乐播放器

Navidrome是开源的音乐服务器，它可以把硬盘的音乐文件以流媒体的方式呈现出来，就可以在任何的浏览器收听自己的音乐，并兼容subsonic API接口，也可以在第三方的客户端，最终在PC和手机，平板上实现全平台的音乐输出。

2023 年 07 月 05 日

3 分钟

openWrt 安装 Zerotier 实现访问局域网设备

之前不是介绍过了自建的zerotier控制器，这一次就想在路由器上安装zerotier实现访问内网的设备，不用每一个设备都安装上。如果是在路由器上还是要替换成自建的planet文件，不然就是使用官方的节点转发。

2023 年 03 月 21 日

2 分钟

使用 pace.js 为网页添加加载进度条

在页面中引入Pace.js，页面就会自动监测你的请求（包括Ajax请求），在事件循环滞后，会在页面记录加载的状态以及进度情况。 准备工作 作者的主页：PACE 在head标签之内引入相对应的JS和CSS

2023 年 03 月 15 日

1 分钟

使用 CardLink 生成卡片式链接

逛知乎的时候，常看到卡片式的链接。卡片式链接不仅直观显示出网址、标题、网站的头像等等信息。 这个方案是看到目的地 的文章，我这里也测试了一下。 引入JS GitHub：Lete114/CardLink

2023 年 03 月 04 日

2 分钟

网页自动适配操作系统/浏览器夜间模式

最近在浏览一些博主的网站，发现一个很好玩的效果，当手机浏览器切换到暗色模式后，网页也跟着切换暗色效果，切换白天模式就会切换另外的一个效果，然后用F12深入了解一下，就发现一个prefers-color-scheme这个新的css类，以前没有了解过，赶紧上网查一下。

2022 年 12 月 21 日

2 分钟

typecho自定义文章样式

很久就想实现一个文章自定义样式，就是懒就没有行动。这一次是想完善仿的DUX的一个文章样式，之前看到就是文章加头图看多就腻了，看见最新版本的大前端主题有无图模式，就想扒下来。

2022 年 12 月 16 日

2 分钟

windows10无法访问NAS共享目录解决方法

最近抛弃了Mac系统，回到了Windows10的系统，我安装的是LTSC版本，虽然电脑能检测到NAS的网络共享就是进入不了，提示“找不到网络路径”。

2022 年 11 月 30 日

1 分钟

在线测试宽带网速网站/APP收集

今天在群友讨论测速问题，我也调侃一下哎！之前发现测速不稳，反馈给宽带师傅，师傅上门拿仪器检测没有问题，我之后和师傅聊起我之前使用测速网测速最近一直跑不满，师傅建议我使用360测速来测速，但是360测速确实可以跑满带宽。这边分享使用过的在线的测速工具和app分享给你们，当然有更好可以和我说一下。

2022 年 11 月 12 日

2 分钟

typecho实现附件图片缩略图和输出多张图片方法

最近在折腾主题的时候，我想让图片显示得更加规范一点，比如显示多张，总不能老是获取第一张图片做缩略图，DIY自定义一下。 在百毒搜索一番没有找到确实答案，于是一番折腾在Joe主题找到大部分答案，我把代码记录下，一通Ctrl+C+V。

2022 年 11 月 09 日

2 分钟

微软edge浏览器屏蔽隐私信息采集

使用edge 必应搜索的时候，有时候从标签打开一些网站就很卡，有时候白屏时间比较长。在响应的时候发现了一个不应该出现的加载域名browser.events.data.msn.com、assets.msn.cn，然后就去浏览器设置关闭一些安全、隐私、用户体验这些，发现还是会默认在后台加载。

2022 年 10 月 27 日

2 分钟

使用vanilla-lazyload实现懒加载

给主题配置一个全新的lazyload库，来自verlok的vanilla-lazyload开源js库，支持更多的特性和特效。 vanilla-lazyload是一个轻量级、灵活的脚本，可将图像、背景、视频、iframe等实现懒加载

2022 年 05 月 14 日

2 分钟

CSS 图片显示模糊解决方法

旁边的brand的图片明显糊掉，但是设置 height: 100%; ，一样会显示模糊不清。经过一番咨询好友后，得到以下答案并解决了问题。 使用 image-rendering 优化 CSS 属性 image-rendering 用于设置图像缩放算法。它适用于元素本身，适用于元素其他属性中的图像，也应用于子元素。

2022 年 04 月 10 日

1 分钟

华为云 Debian 设置双网卡双IP配置

最近给华为云升级了一下带宽300Mbps，检查发现只有主网卡的IP可以连接，扩展的网卡无法ping。在服务器中配置双网卡双IP单网关，双网卡配置都可以对外提供上网服务。在华为云文档和腾讯云文档找到了相关内容。

2022 年 03 月 20 日

3 分钟

PVE部署LXC容器内运行Docker

在软路由安装Proxmox后，可以使用LXC容器化安装Docker，来实现无限套娃。就没有必要去使用KVM再去安装一个系统来单独运行Docker。

2021 年 09 月 19 日

2 分钟

Docker配置国内镜像加速源

由于要从Docker拉取某个镜像，但是通过默认的源地址拉取镜像的时间很长而且下载缓慢。我们可以通过切换国内加速源来达到加速的目的。 国内加速地址 名称 加速源地址 腾讯云镜像 https://mirror.ccs.tencentyun.com 网易163镜像 https://hub-mirror.c.163.com 中 …

2021 年 08 月 27 日

1 分钟

Typecho 启用 Service Workers 浏览器缓存加速首屏访问

提到网站访问速度，很大一部分原因要归功于 VOID 主题作者在这款主题中运用 PJAX 无刷新访问技术、Lazy­load 图片懒加载以及 Ser­vice Work­ers 浏览器缓存，这些技术的加持大大提升了网站的访问体验。

2021 年 08 月 14 日

2 分钟

CSS 图片添加高斯模糊渐变特效

看见一个挺不错的特效。 CSS 折叠 复制 @-webkit-keyframes blur { 0% { -webkit-filter: blur(10px); /* Chrome, Opera */ -moz-filter: blur(10px); -ms-filter: blur(10px); filter: …

2021 年 07 月 03 日

1 分钟

Typecho支持webp图片格式解析

webp是谷歌提供的有损压缩与无损压缩的图片格式，能大幅度降低图片压缩比例同时不丢失图片的清晰度。至于兼容性，主流的浏览器基本都支持。typecho目前还不支持webp的图片格式，如果上传系统会认为是文件格式而不是一张图片，插入文章最终会呈现出链接的形式。

2021 年 06 月 08 日

1 分钟

Kangle访问控制模块wiki文档

模块分类 kangle访问控制模块，按功能分为匹配模块和标记模块，按位置分为请求控制模块和回应控制模块。匹配模块只用来匹配相关数据，而不修改，标记模块就有可能修改，或特殊目的。

2021 年 04 月 08 日

22 分钟

网页通过Prettify.js实现代码高亮、显示行号功能

这段时间在折腾typecho主题的代码高亮，尝试了很多的方案但是都不是很满意，如果使用插件的解决方案，个人不是很喜欢。 这里我使用Google Code的一款开源的js库Prettify.js，它提供一种简单的形式来着色HTML页面上的程序代码，最值得亮点的地方是不需要指明代码的语言类型，它会自动进行判断。大家也可以在 …

2020 年 12 月 08 日

3 分钟

解决transform scale 放大图片变模糊问题

最近在博客加了一个移动鼠标到图片放大的特效，使用了transform scale特效。但是发现放大后图片变得模糊，放大前半秒还是可以看见的，完全放大后像加了一层灰蒙模板一样。

2020 年 12 月 04 日

1 分钟

Typecho 非插件实现内容回复可见功能

之前看见WP的博客，部分内容都带着阅读回复可见的功能。所以在网上找了很多的版本，所以这个也是从网上搬来的。这个方法已经测试过可行，分享给你们。来自: typecho wiki

2020 年 12 月 01 日

2 分钟

Typecho实现类似微博几分钟、几天前的词义化时间

在看见别人的博客评论框显示着，几分钟前，几个天前的时间显示，而不是单纯的显示一个完整的时间。于是上网一通搜索，在大佬的博客找到方法。 编辑文件 var/Typecho/I18n.php 找到如下代码。 PHP 折叠 复制 /** * 词义化时间 * * @access public * @param string …

2020 年 11 月 27 日

3 分钟

Github下载文件时raw.githubusercontent.com无法链接

今天在Github想Download文件的时候，发现下载总是报错。疑似域名被污染，访问时好时坏，联通/电信网络访问还好，移动访问简直惨不忍睹。

2020 年 08 月 28 日

2 分钟

typecho社交应用分享小卡片优化

看见wp主题很多通过浏览器分享的页面，都会生成一个小卡片。看着炫酷，总比看着一寸长长的链接好吧，后来发现浏览器是通过OG协议去抓取相当于的内容。og是一种新的HTTP头部标记，即Open Graph Protocol，有兴趣的可以查看去OG官网文档了解一下。

2020 年 04 月 13 日

2 分钟

Typecho主题开发相关函数

站点名称 PLAINTEXT 折叠 复制 <?php $this->options->title() ?> 点击展开查看更多 站点网址

2020 年 04 月 10 日

6 分钟

windows命令行查看文件的MD5、SHA1、SHA256

有时候我们下载了文件，想要比较下载是否一致，可以使用下面命令来显示MD5或者SHA1，来对比两个文件的MD5值。 我们可以在要效验的文件夹中，按快捷键：ctrl+shift+r 快速打开cmd，也可以在资源管理器地址栏中输入cmd快速进入当前目录的命令行，非常方便。

2020 年 03 月 22 日

1 分钟

Windows修改电脑软件默认安装目录

都知道Windows系统的电脑，默认的安装位置在C盘上，当然我个人是不喜欢把程序放在C盘，但是个别的默认安装真的无力吐槽，都喜欢往C盘上装，还有国内个别软件还喜欢带全家桶套餐。下面通过修改注册表来修改电脑的默认安装位置。

2020 年 03 月 16 日

1 分钟

给HS8145V光猫打开IPv6功能

敲小黑板 iPv6是英文"Internet Protocol Version 6"（互联网协议第6版）的缩写，是互联网工程任务组（IETF）设计的用于替代IPv4的下一代IP协议，其地址数量号称可以为全世界的每一粒沙子编上一个地址。

2020 年 02 月 07 日

2 分钟

在 Linux 搭建 Go语言开发环境

最近在折腾内网穿透，想把家里的迷你机搭建的环境放到外网进行访问。而折腾了frp，ngork，nps等等，还是感觉nps比较强大，而nps需要安装Go环境，通过查询资料后安装完成，记录一下安装的踩坑。

2020 年 02 月 02 日

2 分钟

Typecho 博客文章/页面内添加时间轴记录

看到很多Wordress的博主都有时间轴模块来记录自己的建站大事记，很漂亮。其实typecho也可以添加代码来实现。

2019 年 12 月 08 日

2 分钟

typecho搬家，图片链接批量替换字符

最近更换了新的主机和新的域名。以前的数据也有少少备份不能恢复到全部，这里写一下搬家后进行的一些操作把图片都改过来！ 原理

2019 年 11 月 02 日

1 分钟

typecho/wordress 实现点击加载更多文章

首先找到 index.php, 然后把主题默认的分页导航的容器换成下面的容器。 PLAINTEXT 折叠 复制 <!-- typecho用这个 --> <?php $this->pageLink('点击查看更多','next'); ?> <!-- …

2019 年 11 月 02 日

2 分钟

typecho主题模板制作常用代码汇总

typecho是一款不错的轻量化博客系统，圈子里也拥有众多爱好者。博客除了后台的发布功能之外，最重要的算得上是博客的外观了，别人的制作的主题可能有时候不怎么符合自身需求或者使用习惯。这时候就有必要了解一下主题小修改或者进行一下个性化的改造。以满足自身需求。

2019 年 09 月 18 日

6 分钟

Typecho利用HTML5代码实现本地视频播放

HTML5 Video标签的使用 钧言自用Video标签含有src、poster、preload、controls、width、height等几个属性， 以及一个内部使用的标签。

2019 年 09 月 11 日

3 分钟

Typecho添加页面加载耗时时间显示

第一步 编辑functions.php 添加函数 PLAINTEXT 折叠 复制 function runTime(){ $timer = explode(' ', microtime()); return $timer[0] + $timer[1]; } 点击展开查看更多 第二步 编 …

2019 年 08 月 29 日

1 分钟

利用JS给图片添加fancybox灯箱效果

之前我都是用 Typecho文章图片添加灯箱效果 这个教程。发现渐渐不能满足我DIY的需要。 FancyBox是一款优秀的弹出框Jquery插件 允许我们用鼠标和键盘上的四个方向键切换图片 可以根据当前窗口大小自动调整弹出框的大小，当我们改变浏览器窗口大小时，将会看到弹出框自动缩放 支持缩略图列表、放大、全屏等功能 …

2019 年 08 月 27 日

2 分钟

实现网站页面秒开-预加载JS脚本instant.page

instant.page 原理的话我们不必深层了解，只需知道： 在用户点击网站链接之前，他们将鼠标悬停在该链接上。当用户徘徊65毫秒时，他们将点击该链接有两个机会，因此 instant.page 此时开始预加载，平均超过 300 毫秒，以便页面预加载。

2019 年 08 月 23 日

2 分钟

Typecho文章图片添加灯箱效果

FancyBox是一款优秀的弹出框Jquery插件，FancyBox提供了一种简洁优雅的方式去为图片、网页和多媒体添加灯箱功能。此教程为大家介绍 FancyBox在Typecho主题上的应用。

2019 年 08 月 10 日

1 分钟