首页 > 其他分享 >博客园 - 博客园主题装饰

博客园 - 博客园主题装饰

时间:2023-05-24 16:56:56浏览次数:34  
标签:博客园 主题 目录 效果图 HTML 生成 导航 装饰

自动生成可导航的目录 · 效果图

自动生成可导航的目录 · 脚本内容

鼠标点击彩色圆点特效 · 效果图

 

 

 

自动生成可导航的目录 · 效果图

添加了文章目录自动生成的脚本,以及通过JS自定义了导航栏。 标题1则为:1 标题2则为:1.1 标题号会自动生成,所以即使博文未以标题标注层次,该脚本也会自动生成层次分明的序号

 

图1 可导航的快捷目录效果图

 

图2 可导航的快捷目录效果图2

 

 

 

自动生成可导航的目录 · 脚本内容

 

脚本配置位置:【页首HTML代码】或【页脚HTML代码】

 

<script>

/*通过选项,去除控件失效,直接根据id移除*/

$(function(){

/*$("a").remove("#blog_nav_admin");  *//*删除管理栏目*/

/*$("div").remove("#sidebar_links1226849");  *//*删除侧边栏链接*/

/*$("div").remove("#sidebar_postarchive");  删除随笔档案*/




/*$("#navList").append('<li><a >首页</a></li>');*/

//添加导航,直接复制上面一行,修改链接和文字




//添加“清单”导航

$("#navList").append('<li><a>清单</a></li>');

});

</script>


<!--引入js库,用于实现文章自动生成目录索引begin-->
<link type="text/css" rel="stylesheet" href="https://files.cnblogs.com/files/miangao/maodian.css">
<!--<script src="https://files.cnblogs.com/files/miangao/maodian.js"></script>-->
<script src="https://files.cnblogs.com/files/z00377750/maodian.js"></script>
<script src="https://files.cnblogs.com/files/miangao/bootstrap.min.js"></script>


<!--引入js库,用于实现文章自动生成目录索引end-->

 

 

鼠标点击彩色圆点特效 · 效果图

 

 

脚本配置位置:【页首HTML代码】或【页脚HTML代码】
<!-- 鼠标点击特效 -->
<script src="https://blog-static.cnblogs.com/files/yjlblog/cursor-effects.js"></script>
<canvas width="1366" height="662" style="position: fixed; left: 0px; top: 0px; z-index: 2147483647; pointer-events: none;"></canvas>

 

 

配置说明:

https://cloud.tencent.com/developer/article/2005902

https://www.yuque.com/awescnb/user

预览效果:JanYork(小简) - 博客园 (cnblogs.com)

 

 

标签:博客园,主题,目录,效果图,HTML,生成,导航,装饰
From: https://www.cnblogs.com/harleyblogs/p/17428849.html

相关文章

  • 【Kafka从入门到成神系列 七】Kafka 位移主题
    ......
  • 直播平台app开发主题功能的实现
    在我们使用短视频直播软件的时候,有没有注意到这样一个事情,每一个直播平台都有自己的主题特色,这就引发直播平台app开发商们的需要知道一个问题,那就是如何去自定义自己直播平台app的主题那?这就是我今天要给大家分享的一个知识:直播平台app开发主题功能的实现。一、直播主题功能包括什......
  • Open Live Writer 写博客园
    windows客户端下载地址https://openlivewriter.azureedge.net/stable/Releases/OpenLiveWriterSetup.exe项目开源地址https://github.com/OpenLiveWriter/OpenLiveWriter竟然将主题也从博客园上拉了下来,预览效果,如下图所示:......
  • 盘点界面控件DevExpress WinForms的几大应用程序主题
    DevExpressWinForm控件包含了50+个自定义皮肤,其中涵盖了MicrosoftOffice和Windows11启发式的应用程序主题。PS:DevExpressWinForm拥有180+组件和UI库,能为WindowsForms平台创建具有影响力的业务解决方案。DevExpressWinForm能完美构建流畅、美观且易于使用的应用程序,无论是Of......
  • 隐藏博客园上方标题栏
    问题解决在页面定制CSS代码中添加#top_nav{display:none}现在没了,舒服了参考评论区第9楼:全新bili主题-GShang-博客园(cnblogs.com)......
  • Python 2-07 装饰器 @decorator
    Python装饰器@decoratorPython装饰器其实就是对函数的包装,函数作为参数,在不修改函数源代码的基础上,并对函数做一些包装,然后返回增加了包装的函数,即生成了一个新函数。登录校验,权限校验,日志记录等,这些功能在各个环节都可能需要,但又十分雷同,可以通过装饰器来抽象、剥离这部分代码......
  • py之路——day12-20230521:装饰器
    作者:zb一、装饰器1、装饰器的定义:装饰器的“器”是函数的意思,即装饰器本质上是函数,用def关键字定义2、装饰器的功能:装饰其他函数,即为其他函数添加附加功能,为函数实现他们本身没有的功能3、装饰器的原则:⑴不能修改被装饰函数的源代码(有影响线上业务的风险)⑵不能修改被装饰......
  • Django后台 + Wordpress主题,只要自己看上的主题都可以让它变成自己的
    既然学习了PythonWeb怎么能没有自己的一个小站呢?没有自己精心打造的一个小站怎么敢说自己学习过PythonWeb呢?说的再多不如直接干,我的个人网站也已经部署上线。Django后台+Wordpress主题,只要自己看上的主题都可以让它变成自己的为什么要选择Wordpress主题呢?自己在刚开始学习P......
  • 博客主题-cnbook
    博客主题——cnbook-GShang-博客园https://www.cnblogs.com/gshang/p/12986360.html......
  • python中的装饰器原理和作用
    装饰器的作用就是用一个新函数封装旧函数(是旧函数代码不变的情况下增加功能)然后会返回一个新函数,新函数就叫做装饰器,一般为了简化装饰器会用语法糖@新函数来简化例子:这是一段代码,但功能太少,要对这个进行增强,但又不能改变代码。defhello():return"helloworld!"现在我......