博客园开通及美化

开通账号

注册
申请博客权限
申请JS权限
参看其它博友文章

主题介绍

主题源码链接
 主题配置文档若访问不了，请看

以下是官方文档介绍, 可以了解一下特性

界面简洁优雅，响应式网页设计。（移动端只能说还行）
轻量配置，文档给力，非常容易使用。（配置的确简单易上手）
提供暗黑模式和多种色彩主题，可随时切换。（较少使用，自动切换白天/黑夜）
支持自定义导航栏菜单项、悬浮标题目录等。（这个功能很好👍）
提供文章版权签名、赞赏功能等。（👍）
项目结构清晰，代码简单，可实现高度定制化开发。（有前端开发能力的可以看看）

主题配置

Step1：获取文件

可以访问前面的Github地址，获取最新的RELEASE包

└─dist
  └─silence.min.css
  └─silence.min.js

也可以直接使用下载 CDN 文件链接，当前版本是 3.0.0-rc2, @2023-05-13, 当前时间国内 fastly.jsdelivr.net被墙，导致资源访问不了

https://fastly.jsdelivr.net/gh/esofar/cnblogs-theme-silence@3.0.0-rc2/dist/silence.min.css
https://fastly.jsdelivr.net/gh/esofar/cnblogs-theme-silence@3.0.0-rc2/dist/silence.min.js

或者使用我已经上传到cnblogs的文件链接

官方JS文件            https://files.cnblogs.com/files/blogs/792178/silence.min.js
官方CSS样式           https://files.cnblogs.com/files/blogs/792178/silence.min.css
格式化+字体处理+标题margin调整  https://files.cnblogs.com/files/blogs/792178/silence-custom.css

Step2：配置 CSS

配置方案一

将 Step1 获取的 CSS 文件使用文本编辑器或浏览器打开，然后将全部内容复制粘贴到「页面定制 CSS 代码」处。
!注意「禁用模板默认CSS」需要勾选。
!注意，文件中字体文件引用了 https://fonts.gstatic.com/链接，该链接国内可能下载不了，建议使用本人格式化+处理过后的css样式表

官方配置CSS
CSS样式文件中字体配置

配置方案二

或者使用我已经格式化过后的css样式（字体文件放在我云端服务器上,屏蔽了cnblogs的一个广告位）

定制化CSS下载链接

Step3：配置 JS <-> 页脚 HTML 代码

将 Step1 获取的 JS 文件托管到博客园后台获取外链（也可以直接使用 jsDelivr 提供的访问地址），然后使用<script>标签引用。(偶然触发一个异常,这个script标签需要使用尖引号包起来,否则会导致下面的文案看不到,怀疑是cnblogs官方禁用script脚本标签导致)

接下来，将以下配置参数放在页脚HTML代码块中，其中各项配置可以参见配置选项

点击JS配置

<script type="text/javascript">
  window.$silence = {
    avatar: 'https://pic.cnblogs.com/avatar/3185985/20230428174546.png',
    favicon: 'https://files.cnblogs.com/files/blogs/792178/favicon.ico',
    github: 'https://github.com/copyboy',
    defaultMode: 'auto',
    defaultTheme: 'a',
    showNavAdmin: true,
    hljsln: true,
    catalog: {
        enable: true,
        index: true,
        active: false,
        levels: ['h1','h2', 'h3','h4']
    },
    signature: {
        enable: true,
        author: '一根会思考的芦苇',
        license: ['署名-非商业性使用-相同方式共享 4.0 国际', 'https://creativecommons.org/licenses/by-nc-sa/4.0/'],
        remark: '记录生活，记录成长。',
    }

  };
</script>

<script src="https://files.cnblogs.com/files/blogs/792178/silence.min.js?t=1683905786&download=true"></script>

Step4：配置页首HTML代码

<h2> 文案可以随便替换

点击页首HTML代码

<div class="light-loading">
  <div class="box">
    <h2>hi</h2>
    <span></span><span></span><span></span><span></span><span></span><span></span><span></span>
  </div>
</div>