105 lines
3.6 KiB
Markdown
105 lines
3.6 KiB
Markdown
---
|
|
pid: 102
|
|
layout: post
|
|
cid: 1039
|
|
title: 又又又双叒叕换主题啦
|
|
slug: 20230118
|
|
date: 2023-01-18T14:54:00.000Z
|
|
updated: 2024-02-20T15:38:39.000Z
|
|
draft: false
|
|
author: 小赵同学
|
|
categories:
|
|
- 生活
|
|
tags: null
|
|
gemini_comment: >-
|
|
哇塞，你又换主题了！这个主题看起来很简约，也很有特色，尤其是昼夜切换的功能，特别棒！不过，听说评论功能还有点小问题，希望你能早点修复，这样我们就能在你的博客上畅所欲言啦！
|
|
ai_comment: >-
|
|
从技术实现看，昼夜切换的PHP时间判定虽然简单粗暴，但符合KISS原则。不过可以考虑用前端实现，通过localStorage缓存用户偏好，减少服务器压力。Typecho评论系统确实文档简陋，建议封装成插件复用。极简主义的轮回很有意思，像极了程序员从过度设计到追求本质的成长路径。
|
|
---
|
|
|
|
|
|
## 前言 ##
|
|
|
|
正如各位朋友所见，我又又又换主题了
|
|
|
|
经常来我博客的朋友可能见过这个主题
|
|
|
|
本主题原形是由[肖同学][1]设计的
|
|
|
|
![][2]
|
|
|
|
当时翻GitHub一眼爱上，还记得，当时做博客的第一年，可能是卯足了新鲜劲
|
|
|
|
买到博客主题就狂怼css和花哨的js特效，当时[叶开][3]打趣的跟我讲到
|
|
|
|
你信不信到时候，你的博客主题风格依然会简约回来
|
|
|
|
三年后，叶开预言的果然成为了事实，对于主题风格，我反而越来越喜欢简约风格
|
|
|
|
当然如果有朋友喜欢这个主题，并且现在正在使用typecho博客程序
|
|
|
|
也可以去肖同学的GitHub获取该主题
|
|
|
|
传送门：
|
|
|
|
https://github.com/Roseswithlove/Ying
|
|
|
|
## 折腾 ##
|
|
|
|
可能是因为肖同学的工作忙的原因，主题至今还没有评论，需要依赖第三方评论系统
|
|
|
|
当初匆匆忙忙换上，只是简单的套了个waline（第三方评论系统）就上线了，但是时间久了
|
|
|
|
我渐渐发现了，这样并不方便管理，我需要备份两端的数据，这样很麻烦，于是又把主题换回原主题了
|
|
|
|
小年，补习班放假一天，心里想，要不花点时间，把这个主题的评论写完，秉承着说干就干的原则，就开机了
|
|
|
|
不得不说，typecho的评论整起来真的麻烦，而且还是第一次弄，官方文档给的参考示例，很简陋
|
|
|
|
导致走了很多弯路，大部分都是Google解决的
|
|
|
|
因为之前买过很多主题，可以参考大佬的写法，摸爬滚打，最后终于搞完，也许还有bug，但是后面发现了再说吧
|
|
|
|
## 增加昼夜切换 ##
|
|
|
|
因为这个主题是简约，基本上就白色和黑色两种色系，缺点就是晚上看很刺眼
|
|
|
|
于是想给主题写一个夜间模式，当然，百度有很多大佬也给出了思路
|
|
|
|
但是因为主题是简约风格，导致根本不知道把昼夜切换按钮放在那里
|
|
|
|
索性直接写个自动，省去了很多麻烦，也顺便偷个懒，哈哈
|
|
|
|
因为主题色系很简单，基本上就白色和黑色，只需要替换一下色系即可
|
|
|
|
想了个折中的办法，是否可以通过php，通过判断时间echo输出不同的css
|
|
|
|
达到效果，虽然这个方法很笨，但是终究还是整出来了
|
|
|
|
<?php
|
|
date_default_timezone_set('PRC');
|
|
$hour = date('H');
|
|
$themeurl = $this->options->themeUrl;
|
|
if($hour > 6 && $hour <= 20){
|
|
echo "<link rel='stylesheet' href='$themeurl/css/dark.css'>\n";
|
|
}else{
|
|
echo "<link rel='stylesheet' href='$themeurl/css/dark.css'>\n";
|
|
}
|
|
?>
|
|
|
|
## 简单预览 ##
|
|
|
|
![][4]
|
|
|
|
![][5]
|
|
|
|
这样就大功告成了
|
|
|
|
|
|
[1]: https://blog.bug.dog
|
|
[2]: 70094325.png
|
|
[3]: http://qq.md
|
|
[4]: 2899920906.png
|
|
[5]: 1900538379.png
|
|
|