一定要勾选公告,其他可根据需要自行设置;
并禁用模板默认CSS;
独立于base.min.css之外,添加如下代码:
背景图片根据个人喜好更改即可;
开通js权限;
以下配置的内容,直接添加到window.cnblogsConfig={}中;
window.cnblogsConfig={blogStartDate:'2019-01-01',}将这些基础信息整合到window.cnblogsConfig={}中的效果就是:
版本>=v1.3.3后该配置值为-1时,当页面失去焦点,页面title显示的文字不会变化。
window.cnblogsConfig={webpageTitleOnblurTimeOut:-1,}webpageTitleFocus-获取焦点标签文字当页面获取焦点,页面title显示的文字;显示后,延时恢复原title。
版本>=v1.3.3后该配置值为-1时,当页面获取焦点,页面title显示的文字不会变化。
页面使用日/夜间模式优先级:用户设置>自动切换>默认。
自定义菜单数据,显示在默认数据下方。
把你想更换的图标的名字替换到icon-github即可;
window.cnblogsConfig={/**jinrishici:每次刷新随机获取一句古诗词。one:每日获取一句话*/homeBannerTextType:"one",}效果展示图:
当然你也可以自定义标语,格式如下:
window.cnblogsConfig={homeBannerText:["我是标语一","我是标语二","我是标语三","我是标语四",],}每次刷新,会随机从数组中获取一条文字显示。
二者择其一设置即可;
window.cnblogsConfig={codeMaxHeight:true,}限制代码框的最大高度;如开启,代码框高度不会超过页面可视区域的70%,隐藏部分通过滚动的方式查看。
window.cnblogsConfig={codeLineNumber:true,}是否渲染代码行号,如开启会在代码框左侧增加行号显示,默认不开启。
不与博客园行号渲染兼容,如果博客园添加代码时勾选显示行号并同时开启此配置,会出现双行号的现象。
window.cnblogsConfig={essayCode://代码框统一样式设置,目前只有字体设置{fontFamily:"UbuntuMono',monospace",//代码框字体fontSize:"14px"//代码框字体大小},}essayCodeHighlightingTypewindow.cnblogsConfig={//代码高亮样式//cnblogs:使用博客园代码高亮样式essayCodeHighlightingType:"cnblogs",}使用博客园代码高亮样式,介意加载速度的可以使用此配置。
window.cnblogsConfig={//页脚配置footerStyle:1,//页脚样式,可选值:1和2}footerStyle:1对应样式:
footerStyle:2对应样式:
当然你也可以自定义样式;
如何使用呢?
将上述base.min.css文件通过VisualStudioCode或Notepad++打开;
按住ctrl+F检索关键字:footer-image,找到下面这段代码:
用浏览器打开这个url,你会发现,这就是footerStyle:1对应的图片;
接着检索关键字:footer-background.foreground,找到下面这段代码:
同样打开这个url,你会发现,这就是footerStyle:2对应的图片;
那么,聪明的你是不是知道该如何做了?
没错,把我们自定义的矢量图上传到网上,然后将该矢量图的url替换掉上面的url即可;
因为我侧边公告栏的footerStyle:1配置为1,所以,我将自制的透明矢量图的url替换掉检索到的第一个url;
这样,我的页脚样式就变成透明的了;
最后,将更改后的base.min.css代码粘到页面定制CSS代码中就行了;
是不是不太明显?
那么,如何让他明显一点呢?
同样的方式,按住ctrl+F检索关键字:eof,找到下面这段代码:
essaySuffix-eof{font-weight:700;font-size:16px;text-align:center;color:#ddd;text-indent:0}