木灵鱼儿
阅读:95
typecho 自定义分类和分类高亮处理
前言
目前个人认为最合适的一个判定了,但是我的做法只支持二级分类,如果你有多级分类,就需要自行调整了。
先上个实际html渲染图:
可以看到,我进入的是HTML子分类,那么对应的子分类class上已经有active
类名了,而它的父级分类前端,在类名上也存在了active
。
教程
不多说,直接上源码
版权申明
本文系作者 @木灵鱼儿 原创发布在木灵鱼儿 - 有梦就能远航站点。未经许可,禁止转载。
相关推荐
利用typescript实现原生css变量的主题切换功能类
前言主题的切换研究过好久了,个人认为目前最好的两种实现:原生css变量实现,性能好,但是不太兼容旧设备利用预处理scss这种做一个主题类名,通过最上层类名变化从而改变嵌套的子类名的颜色,兼容性好,但是需要把所有的类都抽出来单独设置。本着简单+性能的目标,我采用了第一种方案,这种方案也是大佬张鑫旭提供了,文章是:《link rel=alternate网站换肤功能最佳实现》有兴趣弄的话可以先看看大佬的文章了解原理。封装主题的链接引入采用如下格式:<!-- theme --> <link href="<?php $this->options->th...
typecho主题开发:基于webpack5的多页面打包项目
前言一直想把基于webpack5的多页面打包整理一下,做成一个通用的typecho主题开发架子,之前在JJ主题上虽然以及由部分实现了,但是不是很理想,因为是第一次弄,所以还是有些粗糙。现在离职后得了空闲,于是把这个架子给搭起来了,基于这个架子做前端开发还是很方便的,起码各种框架都能通过按照包的方式使用,能用上先进的打包机还是很棒的!仓库地址github地址:webpack-multiple-entry觉得有用的话麻烦点个Star吧。如果有什么问题可以提交Issues或者在该文章下面留言

让typecho支持特殊字符
起因由于最近在了解前端js中length不准的问题,其中文章带有一些特殊字符,而typecho和mysql都只是支持UTF-8字符,但是这个utf-8并不是真正意义上的utf-8,它最多支持3个字节的内容,也就是24bit,而我文章中的特殊字符是需要4个字节来存储的,这就导致文章无法正常的展示和保存。这个特殊字符和现在移动端常用的emoji表情差不多,emoji也是一种特殊字符,所以该教程同样适用于如何让typecho支持emoji表情。教程打开宝塔的phpmyadmin -> 找到typecho的数据库 -> 操作 -> 滑动到最底部找到排序规则 -> 选择ut...

开源主题-高仿掘金《JJ》
前言写这个主题花了一些时间,我的想法是希望有一个优秀的阅读体验,毕竟本人喜欢记笔记,分享一些平遇到的问题和解决方法。于是乎看中了掘金的样式,挺适合阅读的,加上个人审美确实不太行,就想仿一下样式。随着现在前端的发展,一些新的特性增加,如果还是保持在旧的思维上,我觉得限制了开发者的自我提升,所以,本主题采用了大量es6的js语法,css上采用scss编译,如果你有兴趣,可以一起参与开发。主题预览github地址《Typecho_Theme_JJ》

typecho 真的很简单的自定义评论列表
以前写过一个关于自定义评论的文章,时至如今来看,还是有很多不足的,昨晚再新写主题的时候,也重新写了一次自定义评论,嗯,有了新的理解,因为其实真的很简单,仔细阅读本篇文章,相信你会有收获的。[hide]自定义评论模板到底要怎么做很简单,可以理解为两步:编写自定义评论的模板通过php渲染出自定义模板评论而为什么大多数人不会,其实就是因为官方的文档真的是,如果懂php的人,可能看了一两遍后明白了怎么回事,但是如果是小白入门,纯前端的童鞋,可能看的一脸蒙蔽。就算是原封不动的copy官方的示例代码也还是会报错,心累...因为,你不知道他要做什么,我编写了自定义模板函数threadedComment...

关于element 侧边栏导航高亮的思路
不久之前,我写了一篇《element ui 侧边栏导航刷新自动展开并高亮》的文章,里面主要讲了怎么对侧边栏导航进行高亮,刷新并依旧保持高亮展开的方法。但是后来我发现我之前的那种思路有些窄了。不太适合更大型的站点开发使用。之前的方法主要讲的是:每个网页对应一个导航栏菜单,此时导航栏菜单和网页是一一对应的,所以我可以使用当前路由的name值来进行高亮。但是,如果有更复杂的情况呢?比如:我的导航菜单只显示两级,剩下的级数不显示,点击三级及以上时怎么办?虽然两个页面在路由配置里是同级路由,但是a路由点击按钮跳转到b路由,b路由有前缀条件,所以不能直接出现在导航菜单里,那么应该已经保持a路由菜单高...
你不知道的微软-蓝泽光(win7主题)
蓝泽光(win7主题)2010年,微软台湾分公司推出了Microsoft SilverLight的萌化人物“蓝泽光”,这不是微软第一次让自家的软件拟人化,之前的也推出过win7娘-窓辺ななみ,并由知名声优水树奈々配音,此次推出的蓝泽光则由国内“姚敏敏”担任第一代,第二代声优是“林美秀”,推出后台湾和日本地区获得广泛的回应,以至于到如今,微软依旧保有推出“娘化”角色的传统,什么win8娘,win10娘,正所谓万物皆可娘!Microsoft SilverLight软件本身是一个类似Adobe公司的flash一样的跨浏览器的、跨平台的插件,,开发者可以使用它制作图像,视频,媒体播放等网页效果,...

Lay 响应式Typecho博客主题 V1.1.2
Lay 是一个精心制作的侧边栏主题,提高了响应速度,优化了诸多地方历经时间打磨,更贴合需求预览特性基于Layui框架制作,模块化结构,异步加载js,加快页面响应响应式布局html5+css3+es5+es6基于Layui框架模块化结构异步js加载优秀的灯箱比较全面的代码高亮,精选四种高亮主题,支持常用的语言,还支持:shell、sass、scss、styles、less、c++、go、php、nginx、等语言。缩略文章无刷新加载,增加用户体验支持主题可视化配置侧边栏导航三种主题,可设置支持微信、支付宝二维码赞助符合国内的分享功能支持评论表情,更新了一些表情支持前台登录支持前台注册点赞效...

typecho 超完美上一篇下一篇文章加文章缩略图
之前写过一篇typecho上一篇下一篇的文章,但是当时是对官方的代码进行小改,虽然文章标题,链接都能获取到,但是没法获取到更多,包括文章缩略图。为此我是绞尽脑汁啊,还参考了一些有这种效果的作品,发现,不行,没有我想要的效果。他们的效果都是获取文章的自定义字段,也就是和自定义文章缩略图的那种路子,你只有设置了,他这里才能显示,他不能自动去获取,有的好像连个随机不够做吧。终于,有一天晚上,我一时兴起,想解决下这个问题,于是有了这篇文章,首先我们需要两段代码,这两段代码我是通过网上的代码进行修改的,去掉了一些部分。[hide]获取文章上一篇,下一篇cid/** * 显示上一篇 * * 如果没有...
typecho 评论表单头像
关于评论表单的这个头像,其实挺麻烦的,动不动代码就会报错,超蛋疼的,于是我琢磨了下,想了个思路。用户未登录使用固定头像用户登录了使用登录头像用户是访客,已经留言了,使用留言的邮箱获取头像众所周知,typecho的头像是使用全球头像Gravatar的,Gravatar他本身也是通过邮箱来设置账户的,所以我们通过邮箱也能获取到头像地址。不多说,上代码[hide]<?php //已登录?> <?php if ($this->user->hasLogin()) : ?> <?php $this->author->g...
