文章

jekyll博客样板

样板示例文档,其中包含了基本的元素,比如图片、视频、表格等。新建文档时,就可以直接拷贝这个文档修改一下即可。

jekyll博客样板

Obsidian 语法

结合 obsidian.nvim 插件和自定义jekyll rb 插件 _plugins/obsidian_parser.rb 来实现

Obsidian提示块,jekyll构建内存转换为 Chirpy prompt‑info

tip提示

Obsidian Wiki链接 [[ ]] 速查表

核心总规则

  1. ! 开头 = 嵌入内容;无 ! = 跳转链接
  2. # 锚点符号:#标题 跳标题;#^block‑id 跳自定义块ID;固定顺序:#在前,^在后,不可颠倒。
  3. | 管道符:设置链接显示别名,不改变实际跳转目标。
  4. obsidian.nvim 限制:只有 [[ ]] wiki链接支持标题、自定义块ID;标准markdown [text](file.md) 不支持块ID解析

正确语法总表

语法功能同文件简写
[[笔记A]]跳转到整篇笔记A
[[笔记A | 显示文字]]跳转笔记A,自定义链接显示文本
[[笔记A#标题名]]跳转到笔记A内部指定标题[[#标题名]]
[[笔记A#^my‑block]]跳转到笔记A内自定义块ID[[#^my‑block]]
[[笔记A#^my‑block | 显示文字]]跳自定义块 + 自定义别名[[#^my‑block | 显示文字]]
![[笔记A]]嵌入整篇笔记A的内容
![[笔记A#标题名]]嵌入该标题及下属全部内容![[#标题名]]
![[笔记A#^my‑block]]嵌入单个自定义块内容![[#^my‑block]]
![[image.png]]嵌入图片、PDF、附件

常见错误写法(会新建文件 / 解析失败)

错误语法问题现象
[[my‑block]]缺少 #^,将块ID识别为笔记名称弹出新建笔记
[[笔记A^my‑block]]缺少锚点符号 #弹出新建笔记
[[笔记A^#my‑block]]^#顺序颠倒,必须是#^弹出新建笔记
[[#my‑block]]缺少^,被识别为标题锚点而非块ID找不到目标,跳转失败

自定义 Block‑ID 使用闭环

定义块ID

⚠️ ^ 前面必须有半角空格

1
这是一段需要被引用的文本。 ^demo‑01

ID 约束:仅允许小写字母、数字、横杠 -;不支持下划线、中文。 列表、表格场景,块 ID 需要单独一行,前后保留空行。

1
2
3
4
- 列表项1
- 列表项2

^list‑01

引用块 ID 示例

1
2
3
4
5
6
7
8
9
# 同文件跳转
[[#^demo‑01]]

# 跨文件跳转
[[目标笔记#^demo‑01]]

# 嵌入块内容
![[目标笔记#^demo‑01]]

分割线

跳转块引用

Desktop View

二维码 这是图片标题-二维码

文字样式

效果语法示例说明
粗体**文字****这是粗体**双星号包裹
斜体*文字**这是斜体*单星号包裹
粗斜体***文字******粗斜体文字***三星号包裹
删除线~~文字~~~~已删除内容~~双波浪线包裹
高亮==文字====重点高亮==双等号包裹
下划线 或者 _下划线_<u>文字</u><u>下划线文字</u>HTML u 标签
行内代码`文字``const a = 1`反引号包裹
上标X^2^ 使用 ^ 包裹上标内容
下标H~2~O 使用 ~ 包裹下标内容

分割线

语法效果
---水平分割线(三个减号)
***水平分割线(三个星号)
___水平分割线(三个下划线)

列表

1
2
3
+ 无序列表
 - 无序列表
+ 无序列表
1
2
1. 有序列表
2. 有序列表

TODO list

1
2
- [x] 完成了
- [ ] 待完成

Description list

1
2
3
4
5
Sun
: the star around which the earth orbits

Moon
: the natural satellite of the earth, visible by reflected light from the sun

Block Quote

1
> This line shows the _block quote_.

Prompts

1
2
3
4
5
6
7
8
9
10
11
> An example showing the `tip` type prompt.
{: .prompt-tip }

> An example showing the `info` type prompt.
{: .prompt-info }

> An example showing the `warning` type prompt.
{: .prompt-warning }

> An example showing the `danger` type prompt.
{: .prompt-danger }

Tables

CompanyContactCountry
Alfreds FutterkisteMaria AndersGermany
Island TradingHelen BennettUK
Magazzini Alimentari RiunitiGiovanni RovelliItaly

Links

http://127.0.0.1:4000

Inline code

This is an example of Inline Code

Footnote

Clicking the hook will locate the footnote1, and here is another footnote2.

Filepath

Here is the /path/to/the/file.extend.

Code blocks

Common

1
This is a common code snippet, without syntax highlight and line number.

Specific Language

1
2
3
4
if [ $? -ne 0 ]; then
  echo "The command was not successful.";
  #do the needful / exit
fi;

Specific filename

1
2
3
@import
  "colors/light-typography",
  "colors/dark-typography";

Mathematics

The mathematics powered by MathJax:

\[\begin{equation} \sum_{n=1}^\infty 1/n^2 = \frac{\pi^2}{6} \label{eq:series} \end{equation}\]

We can reference the equation as \eqref{eq:series}.

When $a \ne 0$, there are two solutions to $ax^2 + bx + c = 0$ and they are

\[x = {-b \pm \sqrt{b^2-4ac} \over 2a}\]

Mermaid SVG

 gantt
  title  Adding GANTT diagram functionality to mermaid
  apple :a, 2017-07-20, 1w
  banana :crit, b, 2017-07-23, 1d
  cherry :active, c, after b a, 1d

网页链接

链接标题或说明

Images

Default (with caption)

Desktop View Full screen width and center alignment

Left aligned

Desktop View

Float to left

Desktop View Praesent maximus aliquam sapien. Sed vel neque in dolor pulvinar auctor. Maecenas pharetra, sem sit amet interdum posuere, tellus lacus eleifend magna, ac lobortis felis ipsum id sapien. Proin ornare rutrum metus, ac convallis diam volutpat sit amet. Phasellus volutpat, elit sit amet tincidunt mollis, felis mi scelerisque mauris, ut facilisis leo magna accumsan sapien. In rutrum vehicula nisl eget tempor. Nullam maximus ullamcorper libero non maximus. Integer ultricies velit id convallis varius. Praesent eu nisl eu urna finibus ultrices id nec ex. Mauris ac mattis quam. Fusce aliquam est nec sapien bibendum, vitae malesuada ligula condimentum.

Float to right

Desktop View Praesent maximus aliquam sapien. Sed vel neque in dolor pulvinar auctor. Maecenas pharetra, sem sit amet interdum posuere, tellus lacus eleifend magna, ac lobortis felis ipsum id sapien. Proin ornare rutrum metus, ac convallis diam volutpat sit amet. Phasellus volutpat, elit sit amet tincidunt mollis, felis mi scelerisque mauris, ut facilisis leo magna accumsan sapien. In rutrum vehicula nisl eget tempor. Nullam maximus ullamcorper libero non maximus. Integer ultricies velit id convallis varius. Praesent eu nisl eu urna finibus ultrices id nec ex. Mauris ac mattis quam. Fusce aliquam est nec sapien bibendum, vitae malesuada ligula condimentum.

Dark/Light mode & Shadow

The image below will toggle dark/light mode based on theme preference, notice it has shadows.

light mode only dark mode only

Video

Reverse Footnote

  1. The footnote source ↩︎

  2. The 2nd footnote source ↩︎

本文由作者按照 CC BY 4.0 进行授权

热门标签