自定义博客园cnblog主题样式Ⅱ(SimpleMemory)

Outline

之前捣鼓了下自定义博客园主题样式,顺手记录了下:
https://www.cnblogs.com/bigtreei/p/8450686.html

看了下留言评论,有不少小伙伴感觉我当前这个主题样式还不错,也想设置下;

我这个主题是github上一个开源主题:https://github.com/BNDong/Cnblogs-Theme-SimpleMemory
想深度定制化的可以去研究下。

这里简单记录下怎么设置、应用这个主题。

后台设置概览

管理-->设置

自定义博客园cnblog主题样式Ⅱ(SimpleMemory)

 管理-->选项

确保勾选了 “公告” 这一项,其他的根据自己需求来。

自定义博客园cnblog主题样式Ⅱ(SimpleMemory)

 GitHub主题仓库

选择主题样式版本:https://github.com/BNDong/Cnblogs-Theme-SimpleMemory 

选择一个你想要用的版本(建议选择最新版本)

自定义博客园cnblog主题样式Ⅱ(SimpleMemory)

 博客具体设置

设置皮肤

管理-->设置-->博客皮肤-->SimpleMemory

自定义博客园cnblog主题样式Ⅱ(SimpleMemory)

 设置代码高亮

自定义博客园cnblog主题样式Ⅱ(SimpleMemory)

 设置页面定制CSS代码

CSS代码位置:
https://github.com/BNDong/Cnblogs-Theme-SimpleMemory/blob/v2/dist/simpleMemory.css  (注意选择你所需版本)

将代码copy到输入框,同时勾选 “禁用模板默认CSS ”

自定义博客园cnblog主题样式Ⅱ(SimpleMemory)

 设置博客侧边栏公告

在侧边栏公告选项HTML输入框输入:

<script type="text/javascript">
    window.cnblogsConfig = {
      info: {
        name: 'userName', // 用户名
        startDate: '2021-01-01', // 入园时间,年-月-日。入园时间查看方法:鼠标停留园龄时间上,会显示入园时间
        avatar: 'http://xxxx.png', // 用户头像
      },
    }
</script>
<script src="https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@v2.0.7/dist/simpleMemory.js" defer></script>

自定义博客园cnblog主题样式Ⅱ(SimpleMemory)

 

 更多细节定制可以到github仓库查看,这里不做赘述(github文档里写的很详细)

 

至此,点击 “保存”并且发布,新皮即可生效。

(这款主题真的很赞,希望大家可以支持开源作者,多给Star~~)

上一篇:Ubuntu安装qt-opensource-linux-x64-5.11.1教程


下一篇:博客园美化皮肤