基于 AmazeUI & 小专栏 的 Typecho 主题

@spiritree  October 23, 2017

这是一个简洁风格的主题,参考了AmazeUI和Typecho-Theme-Meizi还有Jekyll的主题Project-pages和小专栏,可以说是AmazeUI、Project-pages、小专栏混搭风格。

概述

  • 作者:spiritree

  • 版本:2.0.0

主题预览

typecho-theme-amaze.png

typecho-theme-amaze.png

预览地址:spiritree.me

主题亮点

  • 基于AmazeUI v3.0.0 alpha.beta框架

  • 支持设置顶栏背景图片自定义

  • 支持个人社交按钮自定义

  • 响应式设计

  • 简洁

主题框架

  • JQuery

  • AmazeUI

  • Highlight.js

安装

Github本页面下载,点击"Download ZIP"下载,将主题文件夹改名为amaze,放到Typecho的usr/themes/目录下,并后台开启主题。

主题自定义

登陆到管理后台,控制台=>外观=>设置外观

TODO

  • [x] 美化navbar在移动端的表现效果

  • [ ] 修改文章详情界面样式

  • [ ] 美化评论组件

  • [x] 首页侧边栏重构

  • [x] 首页文章详情重构

下载地址

https://github.com/spiritree/typecho-theme-amaze


添加新评论

  1. 漂亮 提个小建议 评论框这里上面3个栏貌似可以放一排啊

    Reply
    1. @菊部

      good idea~

      Reply
    2. @菊部

      请问如何换图片呢?

      Reply
      1. @yvette

        登陆到管理后台,控制台=>外观=>设置外观=>背景图片地址

        Reply
  2. 漂亮,庄重

    Reply
  3. 太喜欢这个主题了,作者辛苦啦,github star已献上

    Reply
  4. 请问一下,怎么调首页显示的文章数,多显示几篇文章

    Reply
  5. 会有搜索框以及tag吗?

    另外希望独立页面加一个归档和友链的模板。

    Reply
    1. @Jojo

      感谢建议 会有

      Reply
  6. 期待顶部加个搜索栏

    Reply
  7. aogooc

    问题:

    搜索栏是建议放在sidebar还是顶部导航上?我希望放在sidebar上,唯一的问题可能是移动端无法检索,但是我想应该不会有人用手机阅读博客吧,本身的阅读体验就不是很好。

    建议:

    文章摘要显示限制下字数吧,还有归档明细页archive.php,用户应该是需要快速检索到自己想到的内容。

    文章内容页的目录树

    评论支持markdown

    Reply
  8. 好吧,我又来提建议了。

    1.翻页按钮希望Next局右。
    2.希望顶部可以自定义链接。
    3.添加favicon.ico地址
    4.head自定义代码
    5.好像没有了。

    以上1-4虽然可以自己改代码、、但还是太麻烦了。

    Reply
  9. 搜索栏到底是放navbar还是sidebar呢?

    Reply
    1. @spiritree

      手机并没有sidebar,不如就放在顶部?

      Reply
    2. @spiritree

      希望顶部,移动端也是顶部
      手机经常浏览,搜索方便些

      Reply
  10. 你好,我正在使用这款amaze主题,有3个问题不太明白,还请解惑。A.我装上此主题后,顶部右侧【HOME】按钮在首页不会出现,只有点击到具体文章页里面,才会出现【HOME】链接按钮 B.关于【ARCHIVES】文章归档的问题,你这个是启用的插件实现归档吗?还是说新建独立页面怎么设置? C.右侧【分类列表】下面那条线,本该是前段深色,后段浅色,但是我的却都是浅色,其他的都没问题,所以看来其感觉很奇怪。 (由于不懂得代码,还望博主解惑)

    Reply
    1. @mrxiao

      1.这个逻辑是我设计的,在主页当然就不需要HOME按钮了
      2.ARCHIVES新建独立页面选择模板archives就行,这个我会加上使用教程
      3.这个线都是一个颜色的啊

      Reply
      1. @spiritree

        嗯,在主页不需要HOME也可以的;归档页面弄好了;关于横线颜色的问题,我截图在这里【https://ooo.0o0.ooo/2017/10/01/59d0ebe7df5ce.jpg】;我一般使用360极速浏览器和IE浏览器,不知道是否跟这个有关。

        Reply
        1. @mrxiao

          我chrome看你博客是正常的

          Reply
  11. yiwozai

    博主你好,我有一个小问题:
    首页最大的字体“Spiritree Blog” 怎么和左上角网站标题“精神之树的博客 | Spiritree Blog”分别设置?

    Reply
    1. @yiwozai

      应该是通过修改 Header文件中 【命一样珍惜 | <?php $this->options->title(); ?>】实现的

      Reply
    2. @yiwozai

      Header文件第43行吧

      Reply
      1. yiwozai
        @mrxiao

        谢谢,我修改成功了

        Reply
  12. 泡泡

    为什么我下载安装上去后,,版本好是显示1.1呢,,而不是2.0?????希望博主以后模板越搞越漂亮。。大气。。还有建议首页主题会有图片展示出来。
    更加霸气

    Reply
    1. 泡泡
      @泡泡

      还有就是内容页,,标题跟分类都跑到图片里面去了。。

      Reply
  13. 旧时光

    老哥主题很赞。
    已经使用
    唯一的问题就是头像地址不知道该怎么填写

    Reply
    1. 旧时光
      @旧时光

      已经会了,建议能够调用

      Reply
  14. 很好看,良心制作

    Reply
  15. 很好看,我有一个小小的提议就是添加一个回到顶部按钮(可能是我个人习惯了哈),嘻嘻

    Reply
  16. 靓坤

    非常棒的主题。但是我有一点想请教下: 请问如何修改手机端的UI?post 和home page的图片那里我看图片尺寸不怎么爽就自己在home.php和post.php那里加了点style,电脑上是没问题不过手机端一塌糊涂。。我也不会php,难道要用js写个判断header来调整图片尺寸吗?:(

    Reply
  17. 大佬下载地址发下谢谢

    Reply
    1. @零

      https://github.com/spiritree/typecho-theme-amaze 点击clone or download按钮下载

      Reply
  18. 你好,遇到一个小问题:我下载了2.0的文件,添加之后新增了一个seach独立页面,但是在顶部菜单里,却也显示出来 SEACH菜单项,而不是只有搜索图标

    https://i.loli.net/2017/10/29/59f53a4e26130.jpg 如图,这是对比

    Reply
    1. @mrxiao

      进后台=>管理=>独立页面=>search=>高级选项=>公开度隐藏

      Reply
  19. xw

    我的next无法选中

    Reply
  20. Whitolf

    有qq群吗

    Reply
    1. @Whitolf

      没有,欢迎到Github交流。

      Reply
  21. worthy

    博主,除了主页其他页面的ICO图标都不显示,希望修复一下,主题很棒,加油!

    Reply
    1. @worthy

      感谢反馈,准备修复,欢迎在Github中提issue。

      Reply
  22. 博主你好,选了很久还是觉得还是这个主题好看,主题很棒!但下载主题的时候出现了一点小问题:
    typecho的1.1(17.10.30)版本使用2.0的主题评论排版出现了问题,是我配置不当吗?

    Reply
    1. @ajcxsu

      应该是我的问题,我更新了,你再试下。

      Reply
  23. yongshu

    请问博主,链接中的index.php怎么配置,可以去掉index.php?

    Reply
    1. yongshu
      @yongshu

      另外怎么设置链接中包含类似vuesocketiochat.html这样的静态形式?

      Reply
    2. yongshu
      @yongshu

      ps:我用的nginx

      Reply
      1. @yongshu

        进入typecho后台=>设置=>永久链接

        Reply
  24. typecho的主题,貌似都很简单简洁

    Reply
  25. yongshu

    请问博主,search.html怎么生成?我用的贵模板,search页面提示页面没找到?如何处理,谢谢指导。

    Reply
    1. @yongshu

      后台=>管理=>新增独立页面=>自定义模板search=>公开度隐藏

      Reply
  26. 博主,你好,请问你这个页面的目录怎么实现的。#怎么弄的

    Reply
    1. @Wiley

      TOC:https://gist.github.com/spiritree/b7fea1a047f13e1bebf4d4deb1f88bf7
      #:用CSS实现
      .article-trigger h2::before {
      left: -5px;
      content: '#';
      position: absolute
      }

      Reply
      1. @spiritree

        谢谢博主

        Reply
  27. 老铁你的模板我移植到tale博客系统了,底部版权留了(●—●),还望同意
    https://github.com/zoujiayu/tale-theme-amaze

    Reply
    1. @Moon River

      Good job 注明出处就行

      Reply
  28. c

    博主你好,我在使用你这个主题的时候,发现会加载 /usr/themes/amaze/fonts/fontawesome-webfont.woff2?v=4.6.3,这个文件是不存在的。使用默认主题的时候不会出现这种情况。

    Reply
  29. 发现,在文章页加个阅读进度条,不错,挺好看

    Reply
  30. StarHeart

    请问一下关于原版页面是在哪个文件夹下面?个人想修改里面的一些文字描述。

    Reply