当前标签 / 博客优化 / 总共2篇

个人博客挂件基于Live2d的看板娘实现和源码

前段时间我的博客是用 Hexo 搭建的,当时我给我博客做了一个小猫咪的挂件,蛮有趣的。后来因为 Hexo 生成静态页面速度慢的问题我转向了 Hugo 来搭建我的个人博客,这个小猫咪也换成了看板娘,这些其实都是基于 Live2d 的,接下来我给大家说一下怎么给你的博客添加,无论你的博客是基于 WordPress 的还是基于 Hexo 的,或者和我一样是基于 Hugo 的都可以参考本文。

Live2d 是什么

Live2d 的官网地址:https://www.live2d.com/zh-CHS/

Live2d 是一种 2d 的绘图渲染技术,是由日本的一个叫 Cybernoids 的公司开发,通过一系列可以连续动画的的人物或者动物来建立模型,生成一种可以动的 2d 图形或者说二维模型。这种模型和二次元很接近,所以喜欢这种风格的人很多,但是也有它自身的缺陷那就是不容易商业化和更快的发展,例如现在的 3d 模型在游戏上和 VR 技术上有很大的发展空间,而 Live2d 至今还没有找到合适的契合点,但是这丝毫不影响宅男对这项技术的热爱。

阅读更多

highlight 设置行号

一、背景

笔者在开发这套博客系统时使用 Editormd 作为 Markdown 编辑器,由于不满足其代码高亮的样式,因此选用 highlight.js 插件来实现代码高亮功能。但是,highlight.js 插件不提供行号的设置功能,于是有了该文章。

二、实现原理

html 的代码块都是通过 <code></code> 进行封装,我们可以将其内容取出封装到 <ol><li></li></ol> 从而实现设置行号的效果。

三、实现方式

下边提供两种实现方式。

3.1 后端修饰

笔者使用的是 commonmark 库来实现 markdown 转换成 html。

阅读更多