記事の書き方:frontmatter と本文の作法をマスターする

この CMS で記事を書くための frontmatter の項目と、Markdown 本文の書き方の実践ガイドです。
blog
Published

August 2, 2026

記事の書き方

この CMS では、Issue(または Discussion)を1件作る = 記事を1本書く、という対応です。書き方は「frontmatter(設定)+ Markdown 本文」の2層構造です。

1. frontmatter(原稿の先頭の --- ブロック)

---
slug: my-first-post
title: My First Post
publishedAt: 2026-08-02
tags: [quarto, cms]
excerpt: 一覧に表示する短い説明(任意)
category: blog
---
項目 必須 説明
slug 必須 URL の一部。my-first-post/posts/my-first-post/。英数字とハイフン推奨
title 必須 記事タイトル
publishedAt 必須 公開日。YYYY-MM-DD 形式
tags 任意 タグ(配列)
excerpt 任意 一覧用の要約。無ければ本文冒頭から自動生成
category 任意 カテゴリ(1つ)。一覧の絞り込みに使用

YAML の注意

値にコロン : を含む場合は、必ず二重引用符で囲んでください。

title: "チュートリアル: 公開手順"   # OK
title: チュートリアル: 公開手順      # NG(YAML 解析エラー)

2. 本文(Markdown)

--- の後ろに Markdown を書きます。

# 見出し

**強調** や *斜体*、[リンク](https://example.com) が使えます。

- 箇条書き
- 箇条書き

## コードブロック

```python
print("Hello")

## 3. コードを実行する(Quarto の強み)

`python` や `r` を波括弧で囲むと、**ビルド時に実行**されます。

````markdown

::: {#35317d34 .cell execution_count=1}
``` {.python .cell-code}
import matplotlib.pyplot as plt
plt.plot([1, 2, 3], [4, 5, 1])
plt.show()

:::

````

  • python(波括弧なし): 表示のみ(実行しない)
  • {python}: 実行して結果を埋め込む

4. 画像について

画像は本文に ドラッグ & ドロップ で貼ってください。GitHub が自動で URL に変換し、そのまま記事に表示されます。

![説明](https://user-images.githubusercontent.com/...)

5. 公開までの流れ

  1. 「New Issue」から Blog Post テンプレートを選択
  2. frontmatter と本文を編集して作成
  3. ラベルに status:published を追加
  4. GitHub Actions が自動ビルド → サイトに反映(数分)

まとめ

  • 原稿は「frontmatter + Markdown」
  • slug が重複しないように、publishedAt を正しく書くのが最低限のルール
  • あとは GitHub の Markdown をそのまま書けば OK