Chirpy主题的安装与使用指南

Chirpy主题的前置与安装指南

设置Github Pages和Jekyll

1. Github pages的官方文档: GitHub Pages 文档
2. 使用 Jekyll 设置 GitHub Pages 站点
3. 配置 GitHub Pages 站点的自定义域

部署Chirpy主题

1. Chirpy主题的官方文档: Jekyll Theme Chirpy Wiki
2. 官方指南 Chirpy 及其汉化版 pansong291
3. 官方部署指南 以及 示例
4. 【避坑篇】使用Github Pages搭建个人主页or博客网站【上】
5. 【快速部署+客制化】Github Pages+Jekyll Chirpy 速搭个人主页
6. Jekyll博客搭建教程（上篇）（下篇）
7. 搭建个人博客：Jekyll + Github Pages + VSCode
8. 使用Jekyll + Github Pages搭建静态网站
9. 如何从chirpy-starter升级为完整的jekyll-theme-chirpy: Upgrade Guide

Chirpy主题的使用与进阶

1. 撰写文章
2. 自定义图标
3. Chirpy主题的个性化自定义
4. Chirpy主题的安装、编写、图标、头像
5. Chirpy主题的进阶使用
6. 对Chirpy进行简单美化
7. 对于Chirpy各种奇怪bug的研究

Chirpy主题的开发

1. Chirpy官方语法说明书
2. Development & Test Environments

Chirpy主题中文章中可使用的命令

文章的头信息(Front Matter)

文章作为.md文件存在/_posts中, 每个.md文件需要有一段头信息(frontmatter), 可参照撰写新帖子, 其中更改作者author可见Author Information. 关于更深入的内容可参照Front Matter 和 Posts.

事实上, 在如下Front Matter中仅有title与date是必选项.

---
layout: # 在Chirpy模板中默认为post
permalink: # 最终导向的URL
title: TITLE
description: DESCRIPTION # 可选
author: # 默认是social.name
date: YYYY-MM-DD HH:MM:SS +0800 # 时间和时区可选
categories: [TOP_CATEGORIE, SUB_CATEGORIE] 
tags: [TAG]
excerpt_separator: # 摘录段落
published: # 是否公开
toc: true # 目录
comment: true # 评论区
pin: true # 置顶
math: true # 数学模式, 由MathJax支持
mermaid: true # Markdown的一种扩展, 用于画图
cdn: url # 只能作为img的根目录,所以对我作用不大
---

类型提示

markdown中引文以> 在行首出现, Chirpy提供了一些提示(但我不一定记得用):

> 显示 `tip` 类型提示的例子。
{: .prompt-tip }

> 显示 `info` 类型提示的例子。
{: .prompt-info }

> 显示 `warning` 类型提示的例子。
{: .prompt-warning }

> 显示 `danger` 类型提示的例子。
{: .prompt-danger }

显示 tip 类型提示的例子。

显示 info 类型提示的例子。

显示 warning 类型提示的例子。

显示 danger 类型提示的例子。

内嵌pdf和视频图片

我用<iframe>标签在网站中内嵌pdf文件,一般是如下形式：

<iframe 
    src="https://cdn.jsdelivr.net/gh/user/repo@version/file/"
    frameborder="0" width="100%" height="600px">
</iframe>

其中用了js Delivr的CDN，也可以放其他链接。

对于内嵌视频,详见Write a New Post. 对于平台视频可使用如下语法:

{% include embed/{Platform}.html id='{ID}' %}

其中{Platform}是平台名称(支持Youtube, Twitch和Bilibili), {ID}是视频ID.

对于一般的视频和音频可以直接用:

{% include embed/video.html src='{URL}' %}
{% include embed/audio.html src='{URL}' %}

内嵌图片可使用

![My helpful screenshot](/assets/img/postimg/screenshot.jpg)

脚注

在正文插入脚注使用命令

正文[^footnote],正文

且可以写反向脚注(一般在正文最后)

[^footnote]: 这是一个脚注