使用博客园主题——cnblogs-theme-next

想换个高端大气上档次的博客园主题。试试这位大佬基于next-theme的博客园主题cnblogs-theme-next。

Github地址:https://github.com/MakerGYT/cnblogs-theme-next

博客园申请js权限。(管理-设置-申请js权限)

步骤见该文:https://www.cnblogs.com/asahi-front/p/14364626.html

设置页面

1.博客皮肤选Custom禁用css模板


2.将以下三个文件内容分别复制入相应区域(页首、页尾、定制css)

  head.html   <--> 页首 HTML 代码
  foot.html   <--> 页脚 HTML 代码 
  custom.css  <--> 页面定制 CSS 代码

这里在html里把对应的github链接修改成自己的。

3.【选项】页面,勾选首页仅列出标题与摘要,控件显示勾选公告

4.设置成功啦,看下效果

其他:

可以自行在custom.css(页面定制css代码)里设置主题颜色修改。

/*custom.css*/
:root {
 --primary-color:#027AFF;/* 全局主色*/
 --body-bg-color: #f5f7f9; /*页面背景色*/
   --content-bg-color: #fff; /*页面内容背景色*/
   --heading-color: rgba(0, 0, 0, 0.85); /* 标题色 */
   --text-color: #353535; /*主文本色*/
   --text-color-secondary:rgba(0, 0, 0, 0.45);/*次文本色*/
   --text-color-grey:rgba(0, 0, 0, 0.25); /*失效色,无需关注色*/
 --link-color: #555; /*链接色*/
 --code-bg-color:#f0f0f0; /*代码块背景色*/
}

通过随笔写文章,填写摘要和标签后发布。

首页头像的显示:手动在foot.html头部配置avatar(可在头像设置上传后右键头像获取链接)

其他可配置部分如下

  github:右上角跳转github用户名,默认为本仓库链接
  author:作者,默认取后台设置
  siteTitle:网站标题默认取后台设置
  gallery: 要展示的相册ID(新建相册后在url中获取ID,如1796566)
posted @ 2021-02-02 23:46  朝日asahi  阅读(536)  评论(0编辑  收藏  举报