<aside> 📢 文档基于主题最新版本，不考虑之前的版本差异，请您使用最新版。
</aside>
感谢您支持 Miracles 主题，这里是主题的使用手册，这能帮助你解决大部分的问题。
<aside> ⚠️ Miracles 主题是为 typecho 设计的，首先你需要安装 typecho。
</aside>
先安装上才是正道。
<aside> 📌 你的博客最好是安装在站点的根目录下，不然某些功能无法正常使用（如：owo 和 lazyload）
</aside>
<aside> 💡 发行版即为 GitHub 仓库里 release 里打包好的版本，比较稳定，推荐使用；但内容一般都经过了压缩打包，删除了大部分注释，不方便魔改或者二次开发，仅对正常使用比较友好。 开发版则为 GitHub 仓库展示的文件内容，是最新的，但不保证稳定性，尽管在 Commit 之前都有经过测试，但可能会有未被发现的 bug。开发版是完整的主题源码，没有压缩，对二次开发比较友好。
</aside>
以下是 Miracles 最新发行版（1.5.3）的下载链接，推荐使用。
你也可以查看 Miracles 主题所有的历史版本：
主题基于 SATA 开源协议进行授权，所以使用前请 Star 本主题，这是最基本的。同时，SATA 协议本身基于 MIT 协议，所以在使用时你需要保留主题原本的版权信息，这些版权信息在页脚和 Console，以及各个静态文件都有，你都需要保留。如果主题引入了别的开源项目没有署名原作者，请告知我及时修正。
如果你需要二次开发并发布新版本的主题，你需要署名原作者并提供原仓库链接，最好尝试联系我，至少让我知道。
<aside> 📌 主题的设置面板在 typecho 控制台 - 外观 - 设置外观中。
</aside>
安装后打开主题的设置面板，开始对主题进行一些个性的更改。
这里主要填写你站点的基础信息，与 typecho 的设置不同，这里的设置仅用于展示，而不会影响 SEO。
站点名称和站点介绍都比较好理解，这里对站点头像这一项设置做一些说明：站点头像内所指定的图片只会输出在左侧抽屉栏和关于页面，评论区和说说页面的头像都是调用您的 gravatar；若这个设置项为空，则会直接调用 gravatar。
<aside> 🖼 Gravatar - 全球公认的头像，您可以在这个网站上用您安装 typecho 时填写的邮箱注册账号并上传头像。
</aside>
Miracles 内置了两种类型的导航栏供您选择，分别是左侧抽屉栏和顶部导航栏。
<aside> 💡 左侧抽屉栏平时是隐藏的，只有在访问者点击左上角的按钮时才会从左侧抽出，能让访问者更加专注于文章内容；而顶部导航栏总是保持在页面顶部，会跟随访问者鼠标滚轮移动，但在访问者向下滑动时会收缩，向上滑动时会再次展开。
</aside>
您可以根据自己的喜好来选择这两种导航栏，但他们无法同时使用。
顶部透明这一项设置只适用于顶部导航栏，在使用左侧抽屉栏时启用不会有任何效果。启用后，当访问者的视口置于页面最顶端时，导航栏的背景会变为透明，滚轮向下滑会获得背景色。
1.4.3 版本新增了自定义导航栏功能，可以根据需要自定义导航栏的内容，需要按照 json 格式书写，如下：
[
{
"title": "关于",
"link": "<https://yoursite.com/about.html>"
},
{
"title": "友人",
"link": "<https://yoursite.com/link.html>"
},
{
"title": "归档",
"link": "<https://yoursite.com/archive>"
}
]
<aside> ⚠️ 注意，请不要使用相对路径（即使用完整的, 带协议头和域名的网址），不然 Pjax 可能会失效。
</aside>
<aside> 📌 外部链接会自动在新窗口打开；如果设置项留空则读取所有未被隐藏的独立页面。
</aside>
首页大图位于所有页面的顶部，它通常是一张较大的图片，仅展示。首页大图上方会显示你在之前设置的站点名称和站点介绍，靠左展示。
填入一个图片 url 来指定首页大图展示的图片，可以是绝对路径也可以是相对路径。
<aside> ❓ 如果您不了解绝对路径和相对路径，填写图片外链就好了。
</aside>
字体颜色只有黑色和白色可供选择。通常情况下，在有图片的时候使用白色就好；而不填写图片 url 时，背景色会是淡灰色（#f1f1f1），这个时候使用黑色。顺带一提，如果你设置了导航栏的顶部透明，这个设置项会影响导航栏透明时的颜色。
高度的单位是 vh，如果你不理解，可以把这个高度当作百分数，只是没有 % 而已，例如：填写 50 的话，首页大图则会占据一个视口（即浏览器窗口中显示网页的部分）的一半。
<aside> 💡 Pjax 预加载可以加快页面的访问速度，并让访问更加流畅，提升用户体验
</aside>
你只需要在 Pjax 预加载 - 是否开启中开启，就可以启用 Pjax。
完成后执行事件内写的一般是 Pjax 重载函数，主题的 js 都内置了重载函数所以你不用太操心。如果你安装了一些插件，可能会需要进行重载，不过插件的作者应该都会有说明。
<aside> 💡 一些 js 在切换页面后会出现错误，这时候需要一段 js 在 pjax 完成切换之后将它们重新加载一遍。
</aside>
<aside> 📢 如果你使用了 Meting 插件，记得在完成后执行事件中写入 loadMeting();
</aside>
开启 CDN 加速加载静态资源之后，大部分的 js 和 css 静态资源都会通过你选择 CDN 进行加载，主题内置的有 jsDelivr（国内速度快）和 GitHack（国内速度慢）。如果你使用的是开发版，请不要使用 jsDelivr，以免出现问题，但是 GitHack 一般不会有问题，除非你用的不是最新开发版，就是速度慢；如果你使用的是发行版，推荐使用 jsDelivr。
如果你选择自定义，则会调用下一条设置内的链接，例如 [<https://cdn.xxxxxx.com/assets/>](<https://cdn.xxxxxx.com/assets/，这会调用所指向的这个目录下的静态资源，不过需要保证目录结构和主题的/assets/>)，这会调用所指向的这个目录下的静态资源，不过需要保证目录结构和主题的 ./assets/ 下的结构相同。
阅读时长提示会根据文章的字数估计阅读需要的大致时间，并显示在每一篇文章之前。
自动分割中英文默认是开启的，基于 pangu.js，会分割网页中的半角字符和全角字符，会把中文之间的 . 替换为 。 等等操作，如果不喜欢可以在这里关掉。
个性化设置能让你的博客变得更符合你的品味。
哀悼模式是在京阿尼失火的事故后被加入的，这会让整个网站变成黑白配色。
网站字体是通过 Google Font 调用的，无衬线字体即为思源黑体，衬线字体即为思源宋体。
随机文章缩略图通常是使用的主题 images/postbg 目录下的 1-20.jpg 图片，如果你不喜欢或是觉得加载较慢，你可以通过图片外链自定义，通常需要这样写：
<https://image.com/1.png>,
<https://image.com/2.png>,
<https://image.com/3.png>,
<https://image.com/4.png>,
<https://image.com/5.png>
图片懒加载动画是在图片加载完成之前显示的图片，目前有 4 种可供选择的懒加载动画，这里不提供预览，如果不喜欢列出的图片，可以选择“自定义”，但需要在 ./images/loading/ 目录下放入一个名为 custom.gif 的 GIF 图片。
剩下的两个不做过多的解释，设置项下面的文字写得很明白。
这里的设置不是必须的，你可以根据需要写入 js 和 css，或是在 head 和 footer 自定义你想要的内容。例如 Google 统计代码、在网页中嵌入在线客服等等。
在编辑文章的时候你可能会用到自定义字段，下面介绍主题自带的字段，你只需要根据提示进行设置就可以了。用于关于页面和追番页面的自定义字段不会在这里提及，请查看页面模板。
文章头图会显示在文章列表和文章内页里，作为文章的缩略图和封面。你需要填写一个图片外链，可以是上传自其他图床生成的外链，也可以是本地服务器上的文件。
<aside> 🖼 为了保障头图的最佳显示效果，最好使用 1000x600 的图片；更加详细的话，最好是 47:28 大小的图片
</aside>
用于自定义文章摘要，摘要只显示在首页的文章列表里，显示在文章卡片内的文章标题下，让用户提前阅读文章的前一段。如果这个设置项为空，则会自动读取文章前 130 字；如果填写内容，则会用你自定义的内容来代替这 130 字。
<aside> 💡 为了保证显示效果，自定义的摘要不要太长也不要太短，可以（<br>）来保证文本的均衡显示
</aside>
**元信息（Meta）**是显示在文章头图上以及首页文章卡片内的文章概要信息，它通常有文章分类 / 发布日期 / 评论数 / 被浏览数等信息，会被展示在不太起眼的地方，但是也是比较有用的东西。
如果你不太喜欢他们，可以用这个设置项替换显示在文章头图上的元信息。
<aside> 👌 不用担心，替换元信息后，主题仍会统计页面的被浏览数，切换为默认元信息后这些数据会被显示
</aside>
<aside> 📢 你只需要在文章/页面编辑器内按照相应的语法书写就好了。
</aside>
这些短代码能在你编辑页面或是攥写文章的时候帮助你。
首先，所有的友情链接都需要放到 Link Box 里，通过下面的语法构造一个 Link Box。
[links]
······
[/links]
所有的友链项目都需要按照以下的语法书写。
<!-- 常规写法 -->
[名字]{链接}(头像链接)+(简介)
<!-- 如果是 1.3.2 以前的版本，则 -->
[名字]{链接}(头像链接)
然后放进一个 Link Box 里。
[links]
[名字]{链接}(头像链接)+(简介)
[名字]{链接}(头像链接)+(简介)
[名字]{链接}(头像链接)+(简介)
[/links]
注意，短代码里所有的链接都需要转义！
<!-- 在特殊字符 / 之前加上 \\ 进行转义 -->
https:\\/\\/guhub.cn\\/links.html
<!-- Example -->
[名字]{https:\\/\\/guhub.cn\\/}(https:\\/\\/guhub.cn\\/avatar.jpg)+(我是简介。)