Typecho Theme Moricolor - 森之色
Moricolor
一片森林,一座木屋,如世外桃源般,静谧、安逸。森林的气息,如梦境般,让人神往。
如同她的名字一样,给人以一种自然、恬静的文字阅读体验。
Moricolor Chapter I 现已发布
欢迎体验使用
Download: GitHub
Moricolor Chapter I
预览图
细节
- 点击 主页的日期 ,可 快速预览文章
- 在文章页面下,可通过文章结尾处的 HOME按钮 返回主页,或是浏览器返回
- 在其他任何页面下,都是通过 点击博客标题 返回主页,或是浏览器返回
一些食用方法
'config.php' 为主题全局配置文件
// 'on' 为开启 // 'off'或留空 为关闭 //Pages -换页导航中间的三条杠! $GLOBALS['tools_Pages_if'] = 'off'; //是否开启自定义链接 $GLOBALS['tools_Pages'] = array( '{your_title}' => '{your_url}', 'Moricolor' => 'https://github.com/txperl/Moricolor-for-Typecho' ); //底部小工具 $GLOBALS['bottomTools'] = 'on'; //总 $GLOBALS['bottomTools_hitokoto'] = 'on'; //一言 $GLOBALS['bottomTools_category'] = 'on'; //分类 $GLOBALS['bottomTools_tag'] = 'off'; //标签 $GLOBALS['bottomTools_page'] = 'off'; //页面 $GLOBALS['bottomTools_search'] = 'on'; //搜索 //主页 $GLOBALS['index_QuickPreview'] = '1'; //每页默认显示 X 个快速预览 $GLOBALS['index_QuickPreview_Img'] = 'off'; //文章预览是否显示图片 //样式 $GLOBALS['style_TextBar'] = '1'; //文章页头部信息 | 1:功能按钮及分享按钮(文章目录导航仅支持 h3,h4 层级) | 0:纯文本 $GLOBALS['style_TextIndent'] = 'off'; //首行缩进 $GLOBALS['style_CommentShow'] = 'off'; //默认显示评论 $GLOBALS['style_BGPic'] = ''; //博客背景图设置(填入图片链接),留空为不开启 $GLOBALS['style_FontWeight'] = 'normal'; //字体粗细 | normal:默认 | lighter:细 | bolder:粗 //因有些背景图与原主题风格不同,你可以将'style_FontWeight'设置为 lighter 再更换一下配色,这样整体性会高一些 //配色 全局配色设定(请自行复制粘贴以下相应数组) | 初版,只包含小部分颜色调整(文章配色请自行在mori.css中更改) //Mori(森) - array('Mori') //H(类似黑) - array('','#546e7a','#90a4ae','#90a4ae') //Q(应该青) - array('','#00838f','#00acc1','#00acc1') //L(有点蓝) - array('#0277bd','#0288d1','#03a9f4','#90caf9') //F(微微粉) - array('#f48fb1','#f48fb1','#f8bbd0','') $GLOBALS['style_Color'] = array('Mori'); //前方有怪兽! $GLOBALS['beta_MoriGarden'] = 'off'; //开启后请自行修改 ./MoriGarden/config.php 配置,否则会出事情的!
MoriGarden[Beta]
MoriGarden是基于Thatsi的一个简单例子
这个工具可将你的社交平台动态与博客同步,开启后位于主页底部
目前包含如下内容:
twitter: 以时间轴顺序,获取对应id(是@后面的名称)的公开推文(墙内也可使用)
bangumi: 以时间轴顺序,获取对应id(是@后面的名称)的在看番剧 (这个应该只有二次元迷会用得到吧,我反正是用了...)
P.s. 因为测试阶段默认使用我个人注册的API TOKEN,所以请勿随意或恶意提交
本主题包含一套 Material Design 图标
位于 './fonts/md'
详细情况请参考 Material Design Iconic Font
配色参考
Zoom.js使用 [图片缩放]
<img src="{img_url}" data-action="zoom" class="img-rounded img-responsive">
Prism.js使用 [代码高亮]
只有部分语言适用,若想支持更多请去官网自行下载<pre><code class="language-xxx">{your_code}</code></pre>
&
```{language} {your_code} ```
封面图设置
在文章中加入下方代码,为了整体样式的美观性,建议 图片宽度 >= 980px
<!-- img_quick:img_url; -->
自定义快速预览内容
在文章中加入下方代码即可,将 your_words 改成你需要的内容即可。
<!-- des_quick:your_words; -->
配色与背景图与字体粗细相关
目前配色只是一个初版,所以很不完善
关于背景图,设置一下淡灰风格的图片会显得不那么奇怪
字体粗细如果没有更改,但你添加了背景图,可以试着改成 lighter 或 bolder ,这样样式整体性会高一些
注意事项
1.本主题引用了多个本地资源,若是访问速度明显下降,请自行将本地资源上传到CDN或使用其他解决方案
2.文章目录导航仅支持 h3,h4 层级,并且手机端不会显示
3.更多问题可以询问作者
Moricolor的诞生离不开以下开源项目
更新日志
Chapter I
- [v1.2!]
- 新增 自定义快速预览内容
- [v1.2]
- 新增 博客背景图
- 新增 字体粗细选择(配合博客背景图一起使用效果更佳)
- 新增 评论分页样式(之前忘记写惹)
- 新增 非常少的配色选择
- 微调
<h1>,<h2>,<h3>,<h4>,<h5>,<h6>,<a>,<li>,<blockquote>
标签样式 - 优化 文章排版
- [v1.1]
- 新增 是否允许评论判断
- 更改 将字体源由 本地&七牛CDN 转至 Cloudflare
- 删除 多余本地文件
- [v1.0]
- 新增 归档页面折叠显示
- 新增 figure,figcaption标签样式
- 新增 文章页头部图片(封面图片) | 使用方式:
<!-- img_quick:img_url; -->
- 微调 移动端布局
- 取消 MoriGarden Weibo 解析
- 取消 首页分页反转
- [beta5]
- 新增 文章页头部样式设置
- 新增 webkit自定义滚动条
- 微调 部分样式(归档页面tag,主页小工具排版,文章排版与字体大小)
- 微调 其他细节
- [beta4]
- 全新 文章页面头部样式
- 新增 TextBar
- 新增 文章目录导航(仅支持 h3,h4 层级)
- 优化 评论层级样式
- [beta3]
- 测试 Moricolor后花园_基于Thatsi
- 新增 默认显示评论设置
- 新增 自定义Pages导航设置(换页导航中间的三条杠杠)
- 修复 插件无法显示BUG
- [beta2]
- 全新 归档页面设计
- 新增 段落缩进设置
- 新增 标签云(归档页面中)
- 新增 小工具_Tag,Page
- 更改 主页月份显示方式(3个字母简写)
- 修复 评论作者信息编辑BUG
写在最后
本程序源代码可任意修改并任意使用,但禁止商业化用途。一旦使用,任何不可知事件都与原作者无关,原作者不承担任何后果。
如果您喜欢,希望可以在页面某处保留原作者(Trii Hsia)版权信息。
感谢。
这个评论一开始我都没找到233
很漂亮的主题,和博主应该是同龄,我也是江苏的高二学生,感觉博主比我厉害多了( ̄_ ̄ )
蟹蟹。这个评论确实不怎么好发现...应该是同龄,好巧啊,竟然都是江苏学子。没有没有,你也很厉害的感觉。
很棒的主题,就是感觉眼熟
蟹蟹。v2ex有人说像vue...
主题好看,好喜欢。
然后就是膜拜一下了,同是高二的我,只是一条咸鱼。
希望主题能多出几个配色~
感谢。
没有没有。
好棒的建议!会出的。
```
```
*这个不能丢啊……*
$this->header(); 还有,底部的链接加上 _blank 会让更多人愿意留着版权吧……
确实...当初写的时候太懒没有加...
什么意思...
感觉博主的主题具备了我所要的所有功能,膜拜。
这主题基本是按自已使用博客的需求来添加功能的,感觉博客就应该这样...感谢你能喜欢。
666
999
大爱,真好看的主题
蟹蟹!
希望后续版本能在后台加入各种全局颜色设置..以及优化排版
感谢反馈!
博主,代码背景色安装默认是白色的,怎么改成和你一样的黑色呢。。。。
要按照Prism.js格式,请参考本页面的『 Prism.js使用 [代码高亮] 』
为何某些地方繁体字,某些英文呢?每次都要自己手动修改。
配色加些吧
能具体说明一下吗?什么繁体和英文?
1.回复邮件通知功能加个吧
2.底部加个快速回到顶页
3.开放下底部小工具,自己好想加点东西
1.回复邮件通知并不是必要,而且你可以通过现有插件实现
2.返回顶部感觉没什么意义...
3.你说的是通过Thatsi实现的那个?就是可以显示Twitter和我的追番的?
配色加点吧
收到很多反馈都是关于添加新配色的...可是增加一个配色又要与风格相符,我试了很多个,感觉都不行所以就一直拖着没有动。请问可以具体说一下哪些颜色需要呢...?
我为什么换上了这款主题,我不知道,我感觉她像一个小萝莉,需要我去调教她,让她变得更加适合我。
每一样不是出自已手的东西,我们都不会完全满意的。我也是按照自已心目中博客的样子写了这主题,之后的理想化就需要每个使用者个性化拓展了!非常喜欢你说的,望调教有成!(滑稽
搜索框的摆放位置,我认为不太合理,或许可以再考究一下,放在头部也是可以呀。
个人是这么想的:个人博客基本不需要搜索,因为并不像Wiki或者其他的。放在头部我感觉太占空间和影响第一观感,所以就把它放最后了。你可以自已调整位置呀,就一个复制粘贴就行了!
评论的嵌套回复,应该要错开一些
嗯,确实。评论样式还要改进一下...
beta4如何只保留文章头部weibo,其他的国内水土不服完全没必要上,不如加个扣扣空间之类的国内能用的社交。
自行编辑代码,于 'post.php'10-19 行处。这个也可以自已添加的,ICON的话用『 Flat UI 』自带的或者用『 Material Design Iconic Font 』。
感谢博主和各种一键包,让我这样的零基础人员也能搭起来一个可以自己写东西的地方。
不谢哦~
博主好,主题下面的那个我的追番该怎么弄啊???
好啦,解决了~
使用愉快~
为何我的文章分层不能用呢?
https://roo.ooo/v2.html
确实唉,可以把你那篇文本原文发到我的邮箱(在关于页面)吗?我要调试一下。
应该是你写文章时没有按照正常格式,所以识别不出来,我这里测试一切正常。
文章原文已经发送,你看看我哪里不符合了
请问您发到哪一个邮箱了,我没收到唉...
[email protected]
发到 txperl#gmail.com (#替换为@)...
在移动端访问的时候 (ฅ´ω`ฅ) 下面的内容有办法 居左么 ,看起来有点不对称。
嗯确实,在最新的beta5版本已经修改了,可以去更新看看哦~
哇,更新了,感谢感谢!
感谢持续关注~
说好的新配色呢?
微博不可用,配置了微博名称还是你显示
其实我早就想说了,你这种做法会让人不快。私自使用本主题的介绍语不说,现如今还把所有关于本主题的版权信息全部去掉了,你想追求简洁我不反对,但任何页面也没有版本说明。对于这个我也是无奈的,只能在这说一下。不过感谢反馈。
我感觉下面放个时间统计信息好看些,博主作者怎么认为?
我觉得统计信息并不是博客必要的...
你好,请问一下列表缩进有没有办法调整一下,前端盲一枚:)
请问你指的列表缩进是指什么...? li 标签吗?还是...?
文章分有序列表和无序,这个
是我理解有误还是什么...能再具体点吗...?
这个主题代码真够少的,加载速度肯定直线上升。
主题加载速度快慢和代码多少没有必然关系哦...主要还是看加载项和优化。
博主,归档日期,能不能换成数字的?怎么换在哪?
归档日期现在本来就是数字啊...就月份是英文缩写。要改的话可以在 page-archive.php 66行将 "M" 换成 "m" 即可。
本来不想搞博客了,博主的主题正是我想要的,非常感谢!只是不懂程序一些小问题也要麻烦博主了,问一下,首页显示文章的数量在哪修改?多谢~~~
感谢博主回复。按你说的方法改了,可是月份还是原样的。另外,标签前的#在哪可去掉。不懂程序,可能很简单的问题,麻烦了。
已经找到了,谢谢~~
抱歉,之前我上学所以不能回复...总之找到了就没事了。
博主您好,有两个小问题想请教您:1.请问“#预览图”那个 粉红色的#是怎么弄出来的呢? 2.请问应该如何修改模板的背景颜色呢? 谢谢~非常喜欢你的主题。
1.在 mori.css '.post-content h4::before' 属性中改
2.这个就要看你要改多少了...
感谢你能喜欢。
你好,1已经解决~谢谢你~2.模板颜色:想把首页和帖子里纯白的背景颜色调一下啦~但是不知道实在哪个文件里调
这个在这里也讲不清...建议快速入门一下HTML+CSS就行了。
博主,那个新建的独立页面怎么可以显示有评论功能呢,我想做个留言板的独立页面,但是默认的独立页面是不允许评论的,emmm,前端盲一枚~,另外,可以加友链吗博主~
参考 post.php 代码就行了...呃...我个人是不怎么喜欢一上来就换友链的,如果你执意要的话也不是不行。
你好,你的主题的设计非常过瘾,特别是config,很像hexo。你提及到里面的其中一个细节“在其他任何页面下,都是通过 点击博客标题 返回主页,或是浏览器返回”, 但是为用了这个theme之后点击标题并不会返回。 具体网址:http://bingwong.org/2017/11/13/90.html
感谢!唔...在其他任何页面是指 除文章以外 的页面...因为文章页前面提过了。在文章页的话,点击 页尾HOME 或 页头HOME 可返回。
对了,忘记问你。那个twitter爬虫是不是每次加载都要爬?感觉有点慢。
是的,每次都是调用 twitter api 的,懒得写缓存了...而且有缓存肯定有延迟,万一发推量很大就没什么用了。
我做了一个首页“吐槽”,实现方式:修改comment的function模块,然后只提取制定“id(例如作者)”。 判断是否首页,如果已跳转到page2,则不再显示“吐槽”。 这个功能的目的是类似twitter,但鉴于每次调用twitter api太慢了,所以就利用了comment的模版来实现。不知道你有没有更好的方法? 这是首页效果:http://bingwong.org/
美中不足的是,因为是根据作者id来提取评论的,如果为在其他页面回复了别人的评论,一样会出现在首页。。。。
为什么要根据作者ID提取?
```
class Widget_Comments_RecentPlus extends Widget_Abstract_Comments
{
/**
* 构造函数,初始化组件
*
* @access public
* @param mixed $request request对象
* @param mixed $response response对象
* @param mixed $params 参数列表
* @return void
*/
public function __construct($request, $response, $params = NULL)
{
parent::__construct($request, $response, $params);
$this->parameter->setDefault(array('pageSize' => $this->options->commentsListSize, 'parentId' => 0, 'ignoreAuthor' => false));
}
/**
* 执行函数
*
* @access public
* @return void
*/
public function execute()
{
$slug = "cross"; //页面缩略名
$db = $this->db;
$page = $db->fetchRow($db->select()->from('table.contents')
->where('table.contents.slug = ?', $slug));
$select = $this->select()->limit($this->parameter->pageSize)
->where('table.comments.status = ?', 'approved')
->order('table.comments.coid', Typecho_Db::SORT_DESC);
if ($this->parameter->parentId) {
$select->where('cid = ?', $this->parameter->parentId);
}
if ($this->options->commentsShowCommentOnly) {
$select->where('type = ?', 'comment');
}
/** 忽略作者评论 */
if ($this->parameter->ignoreAuthor) {
$select->where('ownerId authorId');
}
if ($this->parameter->mail) {
$select->where('mail = ?', $this->parameter->mail);
}
$this->db->fetchAll($select, array($this, 'push'));
}
}
```
请问如何加入指定页面?为参考下面的link,但是改不成功。
https://mrasong.com/a/typecho-comment-list
这个还请个人解决吧,不属于 Moricolor 主题问题哦
写本地缓存吧,每隔一段时间刷新一次就行了
对了,为啥markdown中的checkbox显示不了?我已经加入了“MarkdownParse”的插件,正常来说可以显示最新的markdown语法。
请先判定确实是 Moricolor 主题引起的,要不然我也不知道是不是主题的BUG。如果不是,那就凭你这句话我是不可能知道为什么的...
你试试“ - [x]” 看看能不能显示checkbox
未显示,但我用原生 typecho 主题也是不显示的。
嗯,估计是原生typecho对markdown支持不足,与版本or主题无关
最近发现导航栏总是显示框框,要刷新好几次才会正确显示。
你的也是,我的也是。
你修改了啥了?
非常感谢你,最喜欢的一个模板
很高兴你能喜欢
能改造成pjax吗?
感觉 PJAX 用于博客没多大意义...页面刷新也没什么不好的。主要是加入 PJAX 的话,JS 要好好改一下,要不然问题一堆,之后也不能随随便便写 JS 了,没多大意思我觉得...当然如果需求大的话,还是会考虑加入的。不过你可以参考一下 「猫与向日葵」Blog 的 PJAX 实现方式。
测试了N款主题,最终还是这款最喜欢了
总会遇到更好的哦!很高兴你能喜欢。
看到你的主题,瞬间喜欢上了,越来越喜欢简单的主题。
很高兴你能喜欢~hh 简约主义至上!
请问博主,版权信息放console可以吗?
emm 可以吧...
还是留在底部了 本来是打算不要底部的 谢谢这么好的主题
hhh 很高兴你能喜欢
我问一下上一页 下一页的颜色 我再css没看到 这个怎么改呢 大佬
emm 这个你要找到相应的 class 或 id 名改,或者自己加一个。
你好,你的主题非常喜欢,但是 我的追番 页面图片显示不出,http://t.cn/A6wVdHcM
想请教一下原因,谢谢。
Bilibili 的追番记录就是不显示图片的。