木灵鱼儿
阅读:9582
开源主题-高仿掘金《JJ》
前言
写这个主题花了一些时间,我的想法是希望有一个优秀的阅读体验,毕竟本人喜欢记笔记,分享一些平遇到的问题和解决方法。
于是乎看中了掘金的样式,挺适合阅读的,加上个人审美确实不太行,就想仿一下样式。
随着现在前端的发展,一些新的特性增加,如果还是保持在旧的思维上,我觉得限制了开发者的自我提升,所以,本主题采用了大量es6的js语法,css上采用scss编译,如果你有兴趣,可以一起参与开发。
主题预览
github地址
版权申明
本文系作者 @木灵鱼儿 原创发布在木灵鱼儿 - 有梦就能远航站点。未经许可,禁止转载。
相关推荐
typecho 自定义分类和分类高亮处理
前言目前个人认为最合适的一个判定了,但是我的做法只支持二级分类,如果你有多级分类,就需要自行调整了。先上个实际html渲染图:可以看到,我进入的是HTML子分类,那么对应的子分类class上已经有active类名了,而它的父级分类前端,在类名上也存在了active。教程不多说,直接上源码[hide]<div class="nav-list"> <?php $this->widget('Widget_Metas_Category_List')->to($category);?> <?php while ($categor...

利用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...

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

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...

typecho 获取相关文章,指定数量
typecho获取相关文章页挺常用的,官方有这个代码,这里特意分享一下,讲一下用法。<?php $this->related(4,NULL); ?> <?php if ($relatedPosts->have()): ?> <?php while ($relatedPosts->next()): ?> <a href="<?php $relatedPosts->permalink(); ?>"> <h3><?php $relatedP...
typecho 获取最新文章,指定数量
发现这个方法还常用的,特意分享出来。<?php $this->widget('Widget_Contents_Post_Recent','pageSize=5')->to($news);?> <?php if($news->have()):?> <?php while($news->next()): ?> <a href="<?php $news->permalink();?>"> <h2 class="ca...
1
Google Chrome Windows 10typecho1.2无法使用
木灵鱼儿
FireFox Windows 101.1,没时间整啊,前端学习任务繁重
稀土蹦金
Google Chrome Windows 10[笑哭][笑哭][笑哭][笑哭] 我还以为是我瞎删代码误删了 没想到你这也是啊
”手机登录 忘记密码“那里[笑哭][笑哭]
木灵鱼儿
FireFox Windows 10做戏做全套嘛
海云网
QQ Browser Windows 10你的这个站,首页打开速度就快
海云网
QQ Browser Windows 10主题首页慢,typecho1.1,PHP7.0...PHP7.2,打开就白屏,使用PHP5.6才能打开
Hao
Google Chrome MacOS大佬,请问typecho版本用哪个?一直报错。
木灵鱼儿
FireFox Windows 101.1
i咳咳咳
Google Chrome Windows 10还会更新吗,希望首页侧边栏完善些
木灵鱼儿
FireFox Windows 10慢慢弄吧,在学设计模式,等差不多了再来搞
i咳咳咳
Google Chrome Windows 10期待
i咳咳咳
Google Chrome Windows 10php7.0,7.1,7.2,都没用,报错或者网站空白
木灵鱼儿
FireFox Windows 10别用1.2的typecho
i咳咳咳
Google Chrome Windows 10OK了
木灵鱼儿
FireFox Windows 10[doge]好
nginx
Google Chrome MacOS大佬请问一下主题设置备案号和跳转链接设置了但是在博客页面中并没有显示,是我哪里设置有问题吗
木灵鱼儿
FireFox Windows 10bug,一直没修,你自己手动加到php里吧[辣眼睛],上班太忙了
RawChen
Google Chrome Windows 10[嗑瓜子]点赞咋实现的嘞[嗑瓜子]
yingyue
Google Chrome MacOS[打call]太像了,恍惚好几次以为在浏览掘金[打call]