ブログの機能一覧リンクをコピーしました

このページは、現在の KirehaPage 実装で有効な記事記法をまとめたリファレンスです。
「過去に試したことがある記法」ではなく、今のビルドと runtime で動いているものだけを書いています。

frontmatterリンクをコピーしました

最小構成は次です。

.yaml
---
title: "記事タイトル"
date: "2026-03-14"
updated: "2026-03-14"
draft: false
aliases: []
cover: ""
tags: []
description: ""
---
  • title, date, updated は必須です。
  • draft: true の記事は公開されません。
  • aliases は Obsidian 互換の名前解決に使われます。
  • cover はカバー画像と OGP 画像に使われます。
  • description はメタ説明文に使われます。

基本 Markdownリンクをコピーしました

通常の Markdown はそのまま使えます。

.md
**太字** / *斜体* / ~~打ち消し~~

> 引用

- 箇条書きA
- 箇条書きB

1. 番号付きA
2. 番号付きB

| 項目 | 状態 |
| --- | --- |
| table | OK |
| list | OK |

- [x] 完了タスク
- [ ] 未完了タスク

実際の表示例:

太字 / 斜体 / 打ち消し

引用

  • 箇条書きA
  • 箇条書きB
  1. 番号付きA
  2. 番号付きB
項目 状態
table OK
list OK
  • 完了タスク
  • 未完了タスク

単一改行は <br> として扱われます。

.md
1行目
2行目

1行目
2行目

HTML の埋め込みも使えます。

.md
<mark>highlight</mark> と <kbd>Ctrl</kbd> + <kbd>K</kbd>

highlight と Ctrl + K

コードリンクをコピーしました

インラインコードリンクをコピーしました

.md
`const answer = 42`

const answer = 42

コードフェンスリンクをコピーしました

.md
```ts
const value = 42
```

```
plain text
```
.ts
const value = 42
.css
plain text

コードラベルリンクをコピーしました

file= と lang:file の両方を使えます。

.md
```ts file=src/main.ts
console.log('hello')
```

```md:docs/README.md
# title
```
src/main.ts
console.log('hello')
docs/README.md
# title

コードブロックには次が自動で付きます。

  • コピーボタン
  • ポップアップ表示ボタン

ポップアップウィンドウはドラッグ、最小化、四隅と四辺でのリサイズに対応しています。

数式リンクをコピーしました

KaTeX でインライン数式とブロック数式が使えます。

.md
インライン: $E = mc^2$

$
\int_0^1 x^2 dx = \frac{1}{3}
$

インライン: E=mc2E = mc^2

∫01x2dx=13\int_0^1 x^2 dx = \frac{1}{3}

脚注リンクをコピーしました

.md
基本脚注です。[^basic]

複数行脚注です。[^multi]

基本脚注です。1

複数行脚注です。2

記事リンクリンクをコピーしました

内部記事へのリンクは Obsidian 記法と Markdown .md リンクの両方を使えます。

Obsidian 記法リンクをコピーしました

.md
[[hello-world]]
[[hello-world|表示名を指定]]
[[hello-world#ブログ、始めました|見出しへ飛ぶ]]

hello-world
表示名を指定
見出しへ飛ぶ

Markdown .md リンクリンクをコピーしました

.md
[hello-world へ](hello-world.md)
[hello-world 見出しへ](hello-world.md#ブログ始めました)

hello-world へ
hello-world 見出しへ

これらはビルド時に /blog/<slug>.html へ変換されます。
内部記事リンクには既定でプレビューボタンが付きます。

プレビューを無効化したいときリンクをコピーしました

.md
[[hello-world|通常リンク]]
[[hello-world|no preview リンク]]{:no-preview}

通常リンク
no preview リンク

記事プレビューウィンドウも、コードポップアップと同様にドラッグ、最小化、四隅と四辺でのリサイズに対応しています。

インラインウィンドウリンクをコピーしました

通常の外部リンクと、インラインウィンドウで開くリンクは記法を分けています。
現在の対応 provider は youtube, spotify, x です。

通常リンクリンクをコピーしました

.md
[動画リンク](https://youtu.be/dQw4w9WgXcQ)

動画リンク

インラインウィンドウリンクをコピーしました

.md
[動画を見る](https://www.youtube.com/watch?v=dQw4w9WgXcQ){:inline-window provider=youtube}
[途中から見る](https://www.youtube.com/watch?v=dQw4w9WgXcQ){:inline-window provider=youtube start=43}
[Shorts を開く](https://www.youtube.com/shorts/dQw4w9WgXcQ){:inline-window provider=youtube}

動画を見る
途中から見る
Shorts を開く

Spotifyリンクをコピーしました

.md
[Spotify を開く](https://open.spotify.com/intl-ja/track/2bRx0Wk5tIatZPmlBSVfDA?si=629830dd0ba146ac){:inline-window provider=spotify}

Spotify を開く

Xリンクをコピーしました

.md
[X の投稿を埋め込む](https://x.com/kirehash/status/2021113307277688866){:inline-window provider=x}

ポストを読み込み中...X の投稿を埋め込む

youtube が受け付ける URL 形式は主に次です。

  • https://youtu.be/<videoId>
  • https://www.youtube.com/watch?v=<videoId>
  • https://www.youtube.com/shorts/<videoId>
  • https://www.youtube.com/live/<videoId>

YouTube インラインウィンドウは動画の縦横比を保ったままリサイズされます。
通常動画は 16:9、Shorts は 9:16 です。
Spotify は dark theme のカードを自然な比率で表示します。
X はインラインウィンドウではなく、記事本文内の埋め込み要素として表示されます。

画像と添付ファイルリンクをコピーしました

Obsidian 埋め込みリンクをコピーしました

.md
![[assets/hello_world.png]]
![[assets/hello_world.png|220]]
![[assets/hello_world.png|220x110]]
![[assets/hello_world.png|代替テキスト]]




代替テキスト

Markdown 画像 / 通常リンクリンクをコピーしました

.md
![カバー画像](assets/default-cover.png)
[画像を開く](assets/default-cover.png)

カバー画像
画像を開く

HTML 属性内の参照リンクをコピーしました

.md
<img src="assets/hello_world.png" width="240" alt="html image sample">
<a href="assets/default-cover.png">html link sample</a>
html image sample html link sample

これらのローカル参照はビルド時に blog/assets/... へ再配置されます。
クエリ文字列やハッシュ付きでも解決されます。

.md
[クエリ付き](assets/default-cover.png?v=1)
[ハッシュ付き](assets/default-cover.png#top)

クエリ付き
ハッシュ付き

見出しリンクと目次リンクをコピーしました

見出しは通常どおり書けます。

.md
## セクション見出し
### サブ見出し

現在の実装では次の挙動があります。

  • 見出しにはリンクコピーボタンが自動で付きます。
  • 目次は h1 から h3 までを元に自動生成されます。
  • 記事ページでは PC とモバイルで目次 UI が切り替わります。

注意点リンクをコピーしました

  • 変換はコードフェンス内やインラインコード内には入りません。
  • draft: true の記事はビルド対象外です。
  • 解決できない内部リンクや曖昧なアセット参照は意図どおりにならないことがあります。
  • aliases はリンク解決に使われますが、別 URL ページを自動生成するためのものではありません。
  • {:inline-window ...} の provider は現在 youtube, spotify, x のみ対応です。

脚注

  1. 1行の脚注 ←

  2. 1行目
    2行目
    3行目 ←