master
hewro 5 years ago
parent 22abda6d1b
commit fb85c5b175
  1. 2
      README.md
  2. 4
      _coverpage.md
  3. 2
      _sidebar.md
  4. 18
      customize.md
  5. 97
      functions.md
  6. 7
      index.html
  7. 1
      logo.svg
  8. 9
      rss.md
  9. 5
      start.md
  10. 80
      sw.js
  11. 25
      wechat.md

@ -2,4 +2,4 @@
handsome-typecho 主题文档。与 https://coding.net/u/ihewro/p/typecho-theme-handsome-docs 同步
自豪使用[docsify](https://github.com/QingWei-Li/docsify) 构建
## 自豪使用[docsify](https://github.com/QingWei-Li/docsify) 构建

@ -1,6 +1,6 @@
# Handsome Theme <small>5.0 Pro</small>
# Handsome Theme <small>5.1 Pro 即将更新</small>
是博客主题,更是时光记录的载体
界面一见倾心,功能满足幻想
[联系作者](https://www.ihewro.com/)

@ -9,7 +9,7 @@
- [RSS 配置](./rss)
- [独立页面](/page)
- [评论系统](/comment)
- <li><a style="color:red" href="#functions">增强功能</a></li>
- <li><a style="color:red" href="#/functions">增强功能</a></li>
- [评论表情](/emotion)
- [图标列表](/icons)
- [速度优化](/speed)

@ -34,9 +34,9 @@
{"name":"相册","class":"fontello fontello-picture","link":"xxx.com","target":"_self"}
```
<p class="tip">**每两项之间,用英文逗号(,)隔开,最后一项请勿加上逗号。** </p>
!> **每两项之间,用英文逗号(,)隔开,最后一项请勿加上逗号。**
!> 配置使用的json语法,在配置内容外面套上一个中括号即:`[你的配置内容]`,然后去[json校验](https://www.bejson.com/) 可以检查你的填写配置是否正确。
!> 检查配置语法是否正确的方法:将配置内容复制到[json校验](https://www.json.cn/) 网站中,可以检查你的填写配置语法是否正确。
!> 不显示图标,原因可能是**语法错误**或者**图标根本就不在[图标列表](/icons)中**,只能使用[图标列表](/icons)中的图标。
@ -61,6 +61,18 @@
{"name":"相册","class":"fontello fontello-picture","link":"xxx.com","target":"_self"}
```
!> **每两项之间,用英文逗号(,)隔开,最后一项请勿加上逗号。**
!> 检查配置语法是否正确的方法:将配置内容复制到[json校验](https://www.json.cn/) 网站中,可以检查你的填写配置语法是否正确。
!> 不显示图标,原因可能是**语法错误**或者**图标根本就不在[图标列表](/icons)中**,只能使用[图标列表](/icons)中的图标。
!> 如果想要链接ajax(无刷新)的点击效果,确保你的链接是绝对地址(浏览器地址栏什么样的就是怎么填)而且是本站地址,并且`target`属性为`_self`。
**隐藏默认栏目:**
顶部导航按钮默认加载**闲言碎语**按钮。隐藏方法:
@ -110,7 +122,7 @@
{"name":"网易云音乐","img":"https://ww4.sinaimg.cn/large/a15b4afegy1fg2pouholzj201s01s0ja","value":"@许多年以后我依然是我","link":"http://music.163.com/#/user/home?id=83271175"}
```
!> 简单配置,只需要修改"value"和"link"的值(修改# 那个位置的值,不要修改错位置!!)。高级配置,模仿上面的写法,增加或者删除相应的项目即可。
!> 简单配置,只需要修改"value"和"link"的值(**修改`#` 那个位置的值,不要修改错位置!!**)。高级配置,模仿上面的写法,增加或者删除相应的项目即可。
!> 每两项之间,用英文逗号(,)隔开,最后一项请勿加上逗号!!

@ -1,4 +1,4 @@
### 博文头图
#### 博文头图
![headerpic](https://ihewrocdn.b0.upaiyun.com/img/headerpic.png)
@ -45,7 +45,7 @@
每篇文章的编辑页面底部的自定义字段中,字段名为`thumb`,当值为`no`的时候,会不显示当前文章的头图(首页头图和文章头图)(仅对当前文章有效),这里的设置同样会无视上面的设置。
### 灯箱插件
#### 灯箱插件
文章中如果某个图片不想显示灯箱效果,可以给图片标签中加入`nogallery`属性:
@ -53,19 +53,24 @@
<img nogallery src="">
```
如果某张图片高度很大,想折叠展示,可以给图片标签加入`max`属性:
**如果某张图片高度很大,想折叠展示,可以给图片标签加入`max`属性:**
```html
<img max src="">
```
### DNS预解析
![](https://ws4.sinaimg.cn/large/006tNc79ly1g01rzaa2cmj310k0jygoz.jpg)
#### DNS预解析
!> 这个功能即将被删除
DNS prefetching通过指定具体的URL来告知客户端未来会用到相关的资源,告诉客户端可以尽早的解析DNS。
更多详细信息,[请戳这个](https://www.linpx.com/p/small-practice-of-prefetching-dns.html)
### 文章目录树
#### 文章目录树
文章中的目录树已经内置代码,**仅当文章有h2 h3 h4标题** 才会生成目录树,并且手机端不显示目录树。
@ -74,13 +79,13 @@ DNS prefetching通过指定具体的URL来告知客户端未来会用到相关
### 侧边栏的标签云
#### 侧边栏的标签云
需要在新建文章的页面右侧填写标签,才会在首页侧边栏输出的。(回车添加当前标签)
![tagcloud](https://ihewrocdn.b0.upaiyun.com/img/tag.png)
### 自定义摘要字数
#### 自定义摘要字数
大版式头图默认摘要字数200字,小版式头图默认摘要字数80字。你可以在`后台外观设置->自定义大版式头图摘要/自定义小版式头图摘要`来改变这两个默认值。
@ -92,13 +97,13 @@ DNS prefetching通过指定具体的URL来告知客户端未来会用到相关
<!--more-->
```
### 添加自定义图标
#### 添加自定义图标
主题已经内置的图标列表,详见[图标列表](https://handsome.ihewro.com/#/icons)
如果不能满足你的图标需求,可以使用以下方法扩充主题图标:
#### 方法一:傻瓜式扩充fontawesome图标
##### 方法一:傻瓜式扩充fontawesome图标
直接引入全套的fontawesome图标:
@ -110,7 +115,7 @@ DNS prefetching通过指定具体的URL来告知客户端未来会用到相关
上面的fontawesome 的css文件来自bootcdn.css 公共cdn提供,你可以替换成自己的文件。
#### 方法二:自定义添加iconfont图标列表
##### 方法二:自定义添加iconfont图标列表
主题内置fontello图标来自网站`http://fontello.com/`
你可以在该网站中导入主题目录下的`assets/fonts/fontello`的`config.json`,然后重新生成字体文件。
@ -120,7 +125,7 @@ DNS prefetching通过指定具体的URL来告知客户端未来会用到相关
(难度较大,不推荐……)
### 文章中插入按钮
#### 文章中插入按钮
handsome支持以下类型的按钮:
* 矩形文字按钮
@ -159,7 +164,7 @@ handsome支持以下类型的按钮:
[button color="success" icon="glyphicon glyphicon-send" url="mailto:ihewro@163.com"]ihewro#163.com[/button]
```
### 文章内插入音乐
#### 文章内插入音乐
**点击编辑器的插入音乐图标**可以在文章内可以插入音乐歌曲地址,支持云解析和本地MP3地址两种方式:
@ -184,8 +189,7 @@ handsome支持以下类型的按钮:
?> 文章页面插入播放器`size`默认为`large`时光机插入播放器`size`默认为`small`</br>你也可以手动改动这个标签的内容以选择不同的播放器样式:)
### 文章内插入视频
#### 文章内插入视频
**点击编辑器的插入音乐图标**可以插入视频,只支持本地的视频地址的播放
@ -204,10 +208,11 @@ handsome支持以下类型的按钮:
### 文章内调用其他文章
#### 文章内调用其他文章
**点击编辑器的调用文章的按钮**可以调用其他文章并显示。
![](https://ws2.sinaimg.cn/large/006tNc79ly1g01rxlwb8aj30ze0l8q3z.jpg)
```markdown
[post cid="1" /]
@ -219,8 +224,58 @@ handsome支持以下类型的按钮:
* `cover`:可选项,调用文章显示的封面,如果不填则默认显示随机缩略图。
#### 文章内调用外链网站
!> v5.0及其以上版本支持调用外链
![](https://ws2.sinaimg.cn/large/006tNc79ly1g01ry4640lj30vi0a2jrq.jpg)
```
[post url="https:\/\/www.ihewro.com" title="友人C" intro="一个个人博客" cover="http://www.ihewro.com/img/xxx.jpg" /]
```
* `title`:必填,外链的名称/标题
* `url`:必填,外链的地址(请填写绝对地址,就是浏览器地址栏什么样的就填什么样的)
* `intro`:(可选)外链网站的简介/介绍
* `cover`:(选填)外链网站的介绍图片地址
#### 文章内插入相册
### 文章中使用mathJax公式
!> v5.1 版本及其以上支持
![](https://ws2.sinaimg.cn/large/006tNc79ly1g01rx4vn36j30pe0dmdgm.jpg)
**使用方法:**
```
[album](插入图片,支持图片的HTML格式或者是markdown语法都可以,支持外链或者附件上传均可)[/album]
```
**举例:**
```
//方式1(markdown语法)
[album]
![图片描述1][1]
![图片描述2][2]
[/album]
[1]: http://xxx.com/xxx1.jpg
[2]: http://xxx.com/xxx2.jpg
//方式2(markdown语法)
[album]
![图片描述1](http://xxx.com/xxx1.jpg)
![图片描述2](http://xxx.com/xxx2.jpg)
[/album]
//方式3(HTML语法)
[album]
<img src="http://xxx.com/xxx1.jpg" alt="图片描述1" />
<img src="http://xxx.com/xxx2.jpg" alt="图片描述2" />
[/album]
```
**相关问题:[typecho1.1版本编辑器无法解析HTML代码](./common-problem?id=typecho11版本编辑器无法解析html代码)**
#### 文章中使用mathJax公式
* 需要在`后台外观设置——主题增强功能`中启用`公式(MathJax)`选项。
@ -240,7 +295,7 @@ $\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N$
\\( x = \dfrac{-b \pm \sqrt{b^2 - 4ac}}{2a} \\)
```
### 文章内部分隐藏回复可见
#### 文章内部分隐藏回复可见
在文章使用使用
```html
@ -257,7 +312,7 @@ $\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N$
[login]需要加密的内容[/login]
```
### 文章中插入短代码高亮文本
#### 文章中插入短代码高亮文本
```markdown
[scode type="share"]这是灰色的短代码框,常用来引用资料什么的[/scode]
@ -270,7 +325,7 @@ $\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N$
![](https://ws2.sinaimg.cn/large/006tNc79ly1foutefje7wj30os0g0dgc.jpg)
### 文章中插入收缩框
#### 文章中插入收缩框
示例代码:
```
@ -283,7 +338,7 @@ $\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N$
不写`status` 属性,默认是展开内容的。
### 博客时间友好格式化
#### 博客时间友好格式化
> **使用效果**
@ -303,3 +358,5 @@ $\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N$
如标准时间格式:`Y-n-j H:i:s`

@ -16,7 +16,10 @@
homepage: 'home.md',
coverpage: true,
subMaxLevel: 9999,
name: 'handsome',
name: '<img src="/logo.svg" no-zoom height="32px">',
nameLink: {
'/': '/#/'
},
loadSidebar: true,
autoHeader: true,
auto2top: true,
@ -32,7 +35,6 @@
</script>
<script src="https://cdn.bootcss.com/docsify/4.5.9/docsify.min.js"></script>
<script src="https://cdn.bootcss.com/docsify/4.5.9/plugins/zoom-image.js"></script>
<script src="https://cdn.bootcss.com/docsify/4.5.9/plugins/search.min.js"></script>
<script>
var _hmt = _hmt || [];
@ -50,4 +52,5 @@
window.location.protocol = "https";
</script>
</html>

@ -0,0 +1 @@
<svg viewBox="0 0 83.96388123616809 50" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" class="jsx-2263963463 artboard-inner" style="width: 44px; height: 26.2017px; max-height: 100%;"><g transform="translate(-5.166528992033193 -22.14846061726102) scale(0.942969320259495)" id="lockup4-icon"><g fill="#000000"><path d="M88.79 48.368l-2.389-3.379v-.671l2.182-3.124 5.938-5.922-10.589 3.185-1.851 3.664H13.937L8.778 43.49l-3.299 6.598 1.154 8.522 4.838 7.698 7.643 3.031 25.209-.342 3.354 4.404 7.508 3.111-.071-10.279 26.973-19.35 1.704 3.805 9.511 3.346-4.512-5.666zM44.167 35.135l-1.063-.201.518-2.74 1.063.201-.518 2.74zm-16.951-1.84l-.063-2.789 1.081-.024.063 2.788-1.081.025zm15.847-3.592l-.17-.726-1.101-1.443.861-.655 1.238 1.626.225.949-1.053.249zm-14.069-.695l-.997-.418.564-1.349 1.133-1.067.741.788-.965.91-.476 1.136zm10.941-3.151l-1.837-1.005-.464-.039.089-1.078.693.058 2.038 1.116-.519.948zm-7.496-.419l-.357-1.021 2.653-.929.208.018-.062.747.103.294-2.545.891z"></path><path d="M11.27 35.155l-.519-2.74 1.063-.201.518 2.741-1.062.2zm17.027-1.884l-1.105.019.011-2.788 1.032-.019-.013 2.79.075-.002zm-15.925-3.549l-1.053-.248.225-.95 1.238-1.626.86.655-1.099 1.443-.171.726zm14.069-.694l-.476-1.137-.965-.91.741-.787 1.133 1.067.564 1.35-.997.417zm-10.939-3.151l-.519-.949 2.037-1.116.692-.057.089 1.078-.463.038-1.836 1.006zm7.495-.419l-2.545-.891.104-.294-.063-.748.208-.017 2.653.929-.357 1.021zM30.352 31.926l-1.345 1.178.713.814 1.172-1.026.957-.297-.321-1.033zM34.472 31.332l-.127 1.074.806.096 1.501.894.553-.93-1.697-1.011zM39.183 34.382l-.194-.227-.722.62-.087.026.011.039-.023.02.045.052.625 2.095-.01.074.032.004.01.032.073-.021.957.124.039-.302zM17.149 34.807l-.086-.027-.719-.624-.196.225-.771 2.532.037.301.958-.117.073.021.01-.032.032-.004-.008-.074.637-2.092.045-.051-.023-.02zM19.815 31.455l-1.697 1.011.553.93 1.501-.894.807-.096-.127-1.074zM26.998 35.357l-.004.342.031 2.301.637-.008.637.008.03-2.301v-.342zM26.998 39.381l-.004.343.031 1.681.637-.008.637.008.03-1.681v-.343zM23.796 31.562l-.32 1.033.957.297 1.171 1.026.712-.814-1.344-1.178z"></path></g></g></svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

@ -34,7 +34,16 @@
* `title` 仅显示文章标题
* `mix` 显示标题+摘要 (暂不支持)
### RSS 源禁止跨域怎么办?
最简单的解决办法是:在原有的RSS源地址前面加上`https://cors-anywhere.herokuapp.com/`
**举例**:
`https://api.fanfou.com/statuses/user_timeline/~k40sgjV_6kg.rss` 该源是禁止跨域的,所有无法请求到(浏览器可以正常访问,但是无法通过代码获取数据),修改后的源地址为:
`https://cors-anywhere.herokuapp.com/https://api.fanfou.com/statuses/user_timeline/~k40sgjV_6kg.rss`
填`url`属性就填后者即可。(可能速度会有些影响)

@ -22,6 +22,11 @@
* 然后新主题中的文件复制到/usr/themes/handsome/目录。
!> 更新后,如果有页面样式问题请自己检查以下事项:
* 清除浏览器缓存
* 刷新CDN缓存
* (如果使用了`将本地静态资源上传到你的cdn上`功能)请同步更新你的CDN服务器上面的静态资源文件
!> 主题目录下的`/usr`目录存放的为用户自定义数据文件,一般情况无需更新(除非更新提示中有提到需要更新这部分)</p>

80
sw.js

@ -1,80 +0,0 @@
/* ===========================================================
* docsify sw.js
* ===========================================================
* Copyright 2016 @huxpro
* Licensed under Apache 2.0
* Register service worker.
* ========================================================== */
const RUNTIME = 'docsify'
const HOSTNAME_WHITELIST = [
self.location.hostname
]
// The Util Function to hack URLs of intercepted requests
const getFixedUrl = (req) => {
var now = Date.now()
var url = new URL(req.url)
// 1. fixed http URL
// Just keep syncing with location.protocol
// fetch(httpURL) belongs to active mixed content.
// And fetch(httpRequest) is not supported yet.
url.protocol = self.location.protocol
// 2. add query for caching-busting.
// Github Pages served with Cache-Control: max-age=600
// max-age on mutable content is error-prone, with SW life of bugs can even extend.
// Until cache mode of Fetch API landed, we have to workaround cache-busting with query string.
// Cache-Control-Bug: https://bugs.chromium.org/p/chromium/issues/detail?id=453190
if (url.hostname === self.location.hostname) {
url.search += (url.search ? '&' : '?') + 'cache-bust=' + now
}
return url.href
}
/**
* @Lifecycle Activate
* New one activated when old isnt being used.
*
* waitUntil(): activating ====> activated
*/
self.addEventListener('activate', event => {
event.waitUntil(self.clients.claim())
})
/**
* @Functional Fetch
* All network requests are being intercepted here.
*
* void respondWith(Promise<Response> r)
*/
self.addEventListener('fetch', event => {
// Skip some of cross-origin requests, like those for Google Analytics.
if (HOSTNAME_WHITELIST.indexOf(new URL(event.request.url).hostname) > -1) {
// Stale-while-revalidate
// similar to HTTP's stale-while-revalidate: https://www.mnot.net/blog/2007/12/12/stale
// Upgrade from Jake's to Surma's: https://gist.github.com/surma/eb441223daaedf880801ad80006389f1
const cached = caches.match(event.request)
const fixedUrl = getFixedUrl(event.request)
const fetched = fetch(fixedUrl, { cache: 'no-store' })
const fetchedCopy = fetched.then(resp => resp.clone())
// Call respondWith() with whatever we get first.
// If the fetch fails (e.g disconnected), wait for the cache.
// If there’s nothing in cache, wait for the fetch.
// If neither yields a response, return offline pages.
event.respondWith(
Promise.race([fetched.catch(_ => cached), cached])
.then(resp => resp || fetched)
.catch(_ => { /* eat any errors */ })
)
// Update the cache with the version we fetched (only for ok status)
event.waitUntil(
Promise.all([fetchedCopy, caches.open(RUNTIME)])
.then(([response, cache]) => response.ok && cache.put(event.request, response))
.catch(_ => { /* eat any errors */ })
)
}
})

@ -42,24 +42,28 @@
!> **uniquecode 是你的时光机编码,请替换成你的时光机编码!!!**时光机编码不是随便填的!!要和第二步一致的编码才可以
## 向时光机发送消息
支持**文字**和**图片**两种消息类型。
支持**文字**、**图片**、**地理位置**、**链接**四种消息类型。
其他消息类型等后续开发,暂不支持(如果发送了,会提示不支持该类型的,如语音消息)。
!> 其他消息类型等后续开发,暂不支持(如果发送了,会提示不支持该类型的,如语音消息)。
如果发送的是图片会自动将图片存放到typecho 的 `usr/uploads/time` 目录下。
## 其他操作
## 连续发送多条信息
* 输入 `解除绑定``解绑``解绑handsome`即可删除掉你的绑定信息
* 输入 `帮助` 查看帮助信息
* 输入 `赞助``赏``赞赏` 可以进行小额暂时服务器开发
!> (v5.1.0支持(现在还不支持,等下个版本更新))多条信息支持各种已支持的消息类型组合
* 发送`开始`,开始一轮连续发送
* 发送`结束`,结束当前轮的发送
!> 可能的疑问:使用你开发的这个功能,作者可以任意进入用户后台,发送时光机或者其他消息吗?
## 其他操作
答:不可能。
* 发送 `解除绑定``解绑``解绑handsome`即可删除掉你的绑定信息
* 发送 `帮助` 查看帮助信息
* 发送 `赞助``赏``赞赏` 可以进行小额暂时服务器开发
!> 可能的疑问:使用你开发的这个功能,作者可以任意进入用户后台,发送时光机或者其他消息吗?
答:不可能。
1. 这个**时光机编码只能进行验证身份发送时光机这一个功能**,不能进入后台,无法得知用户的后台用户名和密码
2. 用户通过公众号绑定后,**时光机编码会通过md5加密存储到云数据库中**,即使开发者(我)拿到了加密后的数据也无法还原真实的数据操作用户的博客。
@ -70,14 +74,15 @@
## 常见问题
Q: 无法向博客时光机发送内容?
!> 无法向博客时光机发送内容?
A:
1. 时光机编码不正确
2. 某些服务器做了ua判断,所以无法通过请求
3. 某些服务器有cc防护,禁止请求
4. 域名填错了...(填写绝对地址,浏览器地址栏什么样的就填什么!https/http 要分清楚,不要看心情选择)
Q:不显示图片?
!> 不显示图片?
A:请参阅[常见问题](./common-problem?id=评论区不能斗图不能显示图片-说说不能显示图片音乐播放器视频播放器) 的关于“时光机不显示图片问题”

Loading…
Cancel
Save