person

本文是“本站技术备忘”系列的第六篇,系列地址:https://ziyoo.ren/tech-note.html

Typecho My Material 是散漫文集当前正在使用的主题,效果可以直接参考本站。主题采用 Material Design,无论是外观还是操作体验都接近 APP ,整体透露着现代感。因为这种设计语言是由 Google 提出的,所以同样的设计风格在 Google 自家的 APP 和网页上随处可见。

什么是 Material Design

质感设计(英语:Material Design,又译为材质设计、材料设计),研发代号:量子纸张(英语:Quantum Paper)[1],是由Google开发的设计语言 。扩展于Google即时的“卡片”设计,材质设计基于网格的布局、响应动画与过渡、填充、深度效果(如光线和阴影)。

——维基百科

Typecho My Material 项目地址:https://github.com/mnnyang/typecho_theme_mymaterial

主题特性

  1. 代码高亮
  2. 友情链接页面
  3. 目录生成
  4. 支持文章头图
  5. 自定义首页界面
  6. 背景音乐

安装方法

为了支持以上特性,安装主题前需要先安装对应插件,作者已经打包好了:插件.zip

备用下载:链接: https://pan.baidu.com/s/1JJjntYstzX75lmBTMaSwYA 提取码: g3fy

解压后上传到 usr/plugins 文件夹,在 Typecho 后台启用插件。

下载主题包,解压后将文件夹更名为 typecho_theme_mymaterial,上传到 usr/themes 文件夹并在 Typecho 后台启用即可。

注意事项

Typecho My Material 已经很完善,不过耕读君使用过程中也有遇到问题。

第一,地球访客挂件链接前面要加上 https://,否则 Typecho 会在前面自动加上你的域名,导致资源无法加载;

第二,不同功能需要创建对应的页面,需要开启伪静态(URL Rewrite),可以参考:《阿里云虚拟主机安装 Typecho 开启伪静态,去除链接中的 index.php》. 具体页面名称如下:

  1. 关于页面需要页面url为 about.html
  2. 友情链接需要页面url为 links.html
  3. 留言板页需要页面url为 board.html

第三,目前主题还存在一个bug——侧边栏不兼容 AppleWebKit ,在 IOS 上打开侧边栏之后,整个页面包括侧边栏都被遮盖,菜单是点击不了的。好消息是作者已经发现这个问题并表示有空会改,坏消息是不知道作者什么时间才会有空……耕读君研究后决定采取临时措施,把遮盖去掉,方法如下:

#编辑 footer.php 文件

#将以下代码注释掉:

<div id="screen-mask"></div>

注释过后菜单就不会被遮盖了,但是会产生一个新问题,弹出侧边栏之后点击其他空白区域无法再收回侧边栏,必须要点击某项菜单或侧边栏右上方的收回按钮。有舍才有得,接下来只能耐心等待作者有空的时候更新了。

相关文章

新评论