断断续续用过不少typecho主题,也自己写过几款,最后还是觉得越简约越耐看,于是又写了这款主题: blank。 正如它的名字,空白(其实我就是取名废瞎扯的),这款主题在设计上力求极简,留白多,杂色少,越干净越好。当然,虽然看着简单,但同样内置了丰富的功能。购买可前往:商店

一、首页介绍

此款主题内置两种博客列表样式,分别为单栏式和三栏式,用户可根据自己喜好选择适合自己博客的样式。

1.1 三栏式

blank - 一款极简风格的typecho主题

如图,三栏式采用了瀑布流布局,每篇文章显示图片的逻辑如下:每篇文章可配置是否显示缩略图,默认是显示的,如果关闭则不显示,如果开启,首先取配置的题图,如没有配置,则取文章中的第一张图片,如文章中没有图片,则不显示缩略图。

此外,为了首页显得干净,用户不必费心在选图上,三栏式的缩略图默认是加了灰白滤镜,当鼠标移到文章上时滤镜会取消。该滤镜也可在外观设置中关闭。

1.2 单栏式

blank - 一款极简风格的typecho主题

对于单栏式布局,除了题目外,会默认输出一段摘要,输出逻辑为:首先取摘要分隔线之前内容,如果没有摘要分隔线,则取文章的第一段。

二、模板介绍

此主题内置了三个独立页面模板,分别为template page of talks、template page of image、template page of search and archive。用户可在添加独立页面时选择使用。

2.1 template page of talks

template page of talks是一个功能类似于微博的模板,您可以在这里分享一些简短的思考或生活片段等。如果您需要插入图片,需要在后台【设置】-【评论】-【允许使用的HTML标签和属性】添加上<img src="">标签。然后以html图片标签插入图片。

游客视角:

blank - 一款极简风格的typecho主题

管理员视角

blank - 一款极简风格的typecho主题

2.2 template page of image

template page of image是一个相册模板。图片配置如下方法如下:

# 示例
![成都冬天的日出](https://lanterntown.oss-cn-beijing.aliyuncs.com/photo/6632.jpg)
![赎罪剧照](https://lanterntown.oss-cn-beijing.aliyuncs.com/photo/2222.pic.jpg)
![方括号中的内容可填可不填,填了会展示在页面上](https://lanterntown.oss-cn-beijing.aliyuncs.com/photo/sunrise.jpg)

blank - 一款极简风格的typecho主题

2.3 template page of search and archive

template page of search and archive是一个归档模板,此页面包含了搜索框、标签云和博客归档

blank - 一款极简风格的typecho主题

三、其他配置

3.1 作者简介配置

在后台开启作者介绍后,将在文章页显示文章作者的简介。作者可以配置自己的社交账号信息显示在简介处,支持url和而二维码两种形式的链接。配置格式如下:

格式:{媒体类型}:{链接形式}:{需要跳转的url或者需要显示的二维码}

例子:
weixin:qr:https://baidu.com/image-20210411214207163.png
bilibili:url:https://www.bilibili.com
zhihu:url:https://www.zhihu.com

当前可添加的图标包括:zhihu、weixin、bilibili、github、weibo、qq、facebook、twitter、ins、reward等。如果有其他需求,请联系作者添加。

blank - 一款极简风格的typecho主题

3.2 友链配置

typecho最新版本支持文章中水用html代码(需要将代码用!!!符号包裹住),如果你想获得和本博客一样的友链样式(友链),可以使用在页面中填写以下代码。当然,你也可以自定义友链样式。

!!!
<div class="flinks-container">
   <a href='此处填写链接地址' target="_blank">
     <div class="flink-img iconfont">
        <img src="此处填写图片地址"/>
     </div>
     <div class="flink-name">此处填写友链名称</div>
   </a>
   <a href='此处填写链接地址' target="_blank">
     <div class="flink-img">
        <img src="此处填写图片地址"/>
     </div>
     <div class="flink-name">此处填写友链名称</div>
   </a>
</div>
!!!

3.3 其他功能一览

  • 文章目录树配置:默认关闭,编辑文章时可开启
  • 置顶功能
  • 博客logo配置
  • 自定义链接
  • favicon配置
  • 备案号配置
  • 版权声明配置
  • 自定义 HTML 元素。可在后台外观设置处自定义html元素,放在head 头部 (meta 元素后)、head 尾部 (head 标签结束前)或者在 body 标签结束前