2 Star 0 Fork 11

收集开源 / SimpleCnblogTheme

forked from edata / SimpleCnblogTheme 
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
MIT

1. 一款专注于阅读的博客园主题

本主题基本于esofar/cnblogs-theme-silence的开源项目,做得非常不错,我这里我只是对它做了一些非常小的更改。效果预览:我的博客

  • 添加代码行号显示
  • 添加关注按钮
  • 细节上的修改

可以在我的博客查看效果,这里简单展示一下。

原始的风格如下:

简约 · 蓝

暗黑 · 绿

女神 · 粉

代码行号显示,并显示代码类型:

添加关注我的按钮:

2.使用本主题

这里仅简单介绍,详细参考这个文档,或者原部署文档.

2.1 添加样式文件

进入博客园设置页面,博客皮肤选择Custom,再将主题样式文件默认黑色粉色中的代码复制到页面定制CSS代码框中:

2.2 添加js文件

上面完成后,在侧边栏公告中添加如下js代码,请按需更改成你自己的

<script src="https://files.cnblogs.com/files/endlesscoding/silence.min.js"></script>
 
<script type="text/javascript">
    $.silence({
	base: {
            avatar: '//pic.cnblogs.com/avatar/1139651/20180330102648.png',
            favicon: 'https://files.cnblogs.com/files/endlesscoding/favicon.ico',
        },
        catalog: {
            enable: true,
            move: true,
            index: false,
            level1: 'h1',
            level2: 'h2',
            level3: 'h3',
        },
        signature: {
            enable: true,
            home: 'http://blog.esofar.cn',
            license: 'CC BY 4.0',
            link: 'https://creativecommons.org/licenses/by/4.0'
        },
        sponsor: {
            enable: true,
            paypal: null,
            wechat: 'https://files.cnblogs.com/files/endlesscoding/my_wepay.gif',
            alipay: 'https://files.cnblogs.com/files/endlesscoding/my_aipay.gif'
        },
        github: {
            enable: true,
            link: 'https://github.com/wj-data',
	        target: '_blank'
        }
    });
</script>

此外还需要在页脚html代码中添加如下代码,这个代码主要是用显示代行号。

<!-- 放置于页脚代码区 -->
<script src="https://files.cnblogs.com/files/endlesscoding/highlightjs-line-numbers.min.js"></script>
<script src="https://files.cnblogs.com/files/endlesscoding/jquery.cookie.min.js"></script>

<script>
    $(function() {
        /* markdown模式下为代码加入行号, 调用插件highlightjs-line-numbers.js */
        hljs.initHighlightingOnLoad();
        hljs.initLineNumbersOnLoad();
    });
</script>

3. 自定义功能介绍

  • 添加最近评论列表,这个对于你查看最近的评论和及时回复有点帮助。
  • 添加夜间模式日间模式按钮,可切换深色阅读和浅色阅读模式。

要实现这个功能,除了要添加上面的的silence.js文件外,还需要将dark.min.css文件添加到你博客的

主题切换按钮 主题文件上传
MIT License Copyright (c) 2018 Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

简介

简约博客园主题(Cnblog Theme) 展开 收起
CSS
MIT
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
CSS
1
https://gitee.com/collectBusiness/SimpleCnblogTheme.git
git@gitee.com:collectBusiness/SimpleCnblogTheme.git
collectBusiness
SimpleCnblogTheme
SimpleCnblogTheme
master

搜索帮助

14c37bed 8189591 565d56ea 8189591