SEOツール

無料 Markdownフロントマタージェネレーター

Jekyll、Hugo、Astro、11tyなどの静的サイトジェネレーター向けのYAMLフロントマターブロックを生成します。

ツールを読み込み中...

Markdownフロントマタージェネレーターとは

フロントマターは、Markdownファイルの先頭にあるYAMLまたはTOMLのブロックで、静的サイトジェネレーターにメタデータを提供します。使用するレイアウト、ページタイトル、公開日、適用するタグやカテゴリをジェネレーターに伝えます。フロントマターは、生のMarkdownコンテンツと生成されたHTMLページをつなぐ橋渡し役です。

クイックアンサー

フロントマターはMarkdownファイルの先頭にあるYAMLまたはTOMLメタデータで、静的サイトジェネレーターにページタイトル、レイアウト、公開日、タグ、その他の設定を伝えます。トリプルダッシュでコンテンツと区切られます。

Last updated: 2026-06-11

制限事項

特定のフロントマターフィールドは静的サイトジェネレーターによって異なります。Jekyll、Hugo、Astro、11tyでは、それぞれ異なるフィールド名と規則を使用します。
このツールはYAML形式のみを生成します。TOMLやJSONフロントマターを好むジェネレーターには別の形式が必要です。
フロントマターの値はほとんどの静的サイトジェネレーターで大文字小文字を区別します。layout: postとLayout: postは異なるフィールドとして扱われます。

Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub

使い方

投稿またはページのページタイトル、公開日、メタ説明を入力します。
サイトがサポートしている場合は、タグと著者名を追加します。空白のままにすると省略されます。
テーマのテンプレート名に合わせてレイアウトを設定します（postやpageなど）。
生成されたフロントマターブロックをコピーし、Markdownファイルの最上部に貼り付けます。

主な用途

新しいブログ投稿のバッチに一貫したフロントマターを作成する。
WordPressからJekyllやHugoへの静的サイト移行用のフロントマターを生成する。
draft: trueを設定した下書きフロントマターを準備し、レビュー中はコンテンツが公開されないようにする。

用途

使用例

例

Jekyllブログ投稿

ライターがtitle、date、layout: post、タグリストを含むフロントマターを追加します。Jekyllはレイアウトを使用してコンテンツをラップし、日付を使用してブログアーカイブで並べ替えを行います。

例

Astroコンテンツコレクションエントリ

Astroサイトはtitle、description、slugフィールドを含むフロントマターを使用します。slugがファイル名をオーバーライドするため、ファイル名が変更されてもURLはクリーンなままです。

よくあるミス

YAML値でタブの代わりにスペースを使用し、静的サイトジェネレーターでパースエラーが発生する。
終了の---を忘れ、ジェネレーターがファイルの残りをすべてフロントマターとして扱う。
コロンや特殊文字を含む値（Title: My Page: Subtitleなど）を引用符で囲まず、YAMLパーサーが壊れる。

検証

静的サイトジェネレーターでサイトをビルドし、フロントマターから正しいレイアウト、タイトル、メタデータでページがレンダリングされることを確認する。
フロントマター値の特殊文字が引用符で囲まれ、ビルド中のYAMLパースエラーを回避していることを確認する。

FAQ

MarkdownフロントマタージェネレーターのFAQ

フロントマターは何に使用されますか？

フロントマターは静的サイトジェネレーターにページの処理方法を伝えます。どのレイアウトを適用するか、HTMLのheadで使用するタイトル、公開時期、コンテンツをコレクションやタグページで整理する方法などです。

すべてのMarkdownファイルにフロントマターが必要ですか？

いいえ。特別なメタデータのないaboutページなどの静的ファイルはフロントマターを省略できます。ほとんどのジェネレーターは、フロントマターのないファイルをプレーンなHTMLパススルーとして扱います。

YAMLとTOMLのフロントマターの違いは何ですか？

YAMLはインデントベースの構造で、キーと値をコロンで区切ります。TOMLはINIスタイルのセクションで、キーと値を等号で区切ります。ほとんどの静的サイトジェネレーターはデフォルトでYAMLを使用しますが、Hugoなど一部のジェネレーターはTOMLも代替としてサポートしています。

標準のtitle、date、layout以外のカスタムフィールドを使用できますか？

はい。ほとんどの静的サイトジェネレーターはフロントマターに任意のカスタムフィールドを許可しています。author、tags、series、featured_image、またはプロジェクト固有のキーなどのフィールドを追加できます。Liquid、Nunjucks、Goテンプレートなどのテンプレートエンジンは、これらのカスタムフィールドを読み取り、ページレイアウトにレンダリングできます。カスタムフィールドは、各ページがビルド時にテンプレートが消費するデータを保持するプログラムSEOページにも役立ちます。