又用回了博客园

Posted 2021-03-26 longling2344

序

之前用博客园只是简单记录一点开发中遇到的问题的解决小技巧。
博客园写博客默认的是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>

完成！

参考文章链接：

• https://github.com/esofar/cnblogs-theme-silence
• https://github.com/EYHN/hexo-helper-live2d
• https://www.cnblogs.com/jajian/p/9763946.html