又用回了博客园
序
之前用博客园只是简单记录一点开发中遇到的问题的解决小技巧。
博客园写博客默认的是inyMCE(推荐)
的富文本编辑器,不是很好用
也没有注意到在设置中这个是可以更改为markdown
,就改用其它博客,
现在发现博客园也可以支持markdown
,并且主题可以自己定制,自由度很高
还支持上传图片,上传文件(css,js,html...)。
在github找到一个不错的主题和博客右下角的小萌娘。
这理记录一下博客园的装修过程。
Markdown
设置默认编辑器为Markdown:
登录博客园进入后台管理
-->选项
-->默认编辑器
选择Markdown
就可以了
页面定制CSS代码
https://github.com/esofar/cnblogs-theme-silence
这个是使用的模板项目地址,按说明文档进行设置就可以了。
重点步骤:
- 开通js权限,这个很简单,点击申请输入理由后很快就会审核通过。
- 把找到的主题CSS样式拷贝到输入框,
后台管理
-->设置
-->页面定制CSS代码
下面链接是我使用的代码
https://github.com/esofar/cnblogs-theme-silence/blob/master/dist/themes/default.min.css - 禁用模板默认CSS不勾选
博客侧边栏公告
按项目的文档https://github.com/esofar/cnblogs-theme-silence/blob/master/docs/deploy.md
上传脚本
打开./dist文件夹,获取主题的 JS 脚本文件silence.min.js。
进入『文件』界面,将该文件上传到自己的博客中。上传完成后,点击文件名便可在浏览器地址栏中获取上传文件的外链,类似如下所示:
https://blog-static.cnblogs.com/files/esofar/silence.min.js
然后使用
进入『设置』界面,将上面生成的网页脚本引用复制到「博客侧边栏公告」文本域中。
说明:主题脚本文件silence.min.js非必须上传到博客园,也可上传到七牛云等对象存储空间,但必须开启 HTTPS 访问。
页脚Html代码
让右下角出现一个目光跟随鼠标的小萌娘。用的项目:https://github.com/EYHN/hexo-helper-live2d
添加下面代码到 页脚Html代码
<script src="https://l2dwidget.js.org/lib/L2Dwidget.min.js"></script>
<script type="text/javascript">
L2Dwidget
.on('*', (name) => {})
.init({
dialog: {
// 开启对话框
enable: true,
script: {
// 每空闲 10 秒钟,显示一条一言
'every idle 10s': '$hitokoto$',
// 当触摸到角色身体
'tap body': '哎呀!别碰我!',
// 当触摸到角色头部
'tap face': '人家已经不是小孩子了!'
}
}
});
</script>
完成!
参考文章链接: