GitLab フレーバー Markdown(GLFM)

略称はGitLab 14.10でGFM からGLFM変更されました。

GitLab UIでテキストを入力すると、GitLabはそのテキストがMarkdown言語であるとみなします。テキストは一連のスタイルでレンダリングされます。これらのスタイルはGitLab Flavored Markdownと呼ばれます。

例えば、Markdownでは順序なしリストはこのようになります:

- Cat
- Dog
- Turtle

このリストがレンダリングされると、次のようになります:

これらのスタイルはGitLabでのみ有効です。GitLabドキュメンテーションウェブサイトと GitLabメインウェブサイトでは、代わりにKramdownを使用しています。

ドキュメントのこのページは見ないで、GitLabで表示されるこれらのスタイルを見るようにしてください。

GitLab Flavored MarkdownはCommonMark仕様を拡張したものです。GitHub Flavored Markdownにインスパイアされています。

GitLab Flavored Markdownが使える場所

GitLab Flavored Markdownは以下の場所で使うことができます:

  • コメント
  • イシュー
  • マージリクエスト
  • マイルストーン
  • スニペット (スニペットには.md という拡張子が必要です)
  • Wikiページ
  • リポジトリ内のMarkdownドキュメント
  • エピック

他のリッチテキストファイルをGitLabで使うこともできます。そのためには依存関係をインストールする必要があるかもしれません。詳しくはgitlab-markup gem プロジェクトを参照ください。

GitLab Flavored Markdownと標準のMarkdownの違い

GitLabは標準のCommonMarkフォーマットを使います。しかし、GitLab Flavored Markdownは標準のMarkdownをGitLabのために作られた機能で拡張しています。

標準のMarkdownにはない機能

標準的なMarkdownから拡張された機能

標準マークダウンGitLabにおける拡張Markdown
ブロッククオーツ複数行ブロック引用符
コードブロックカラーコードとシンタックスハイライト
強調アンダースコア
ヘッダーリンク可能なヘッダーID
イメージ 埋め込まれたビデオオーディオ
改行より多くの改行制御
リンクス自動リンクURL

標準的なMarkdownにはない機能

以下の機能は標準のMarkdownにはありません。

カラーズ

Markdownはテキストの色の変更をサポートしていません。

カラーコードは以下のフォーマットで書くことができます:HEX,RGB, またはHSL.

  • HEX `#RGB[A]` または`#RRGGBB[AA]`
  • RGB:`RGB[A](R, G, B[, A])`
  • HSL:`HSL[A](H, S, L[, A])`

名前付きカラーはサポートされていません。

GitLabアプリケーションでは(GitLabドキュメントではありませんが)、バックティック内のカラーコードはカラーコードの隣にカラーチップを表示します。例えば

- `#F00`
- `#F00A`
- `#FF0000`
- `#FF0000AA`
- `RGB(0,255,0)`
- `RGB(0%,100%,0%)`
- `RGBA(0,255,0,0.3)`
- `HSL(540,70%,50%)`
- `HSLA(540,70%,50%,0.3)`

GitLabでこのトピックを表示すると、カラーコードの隣にカラーチップが表示されます:

  • #F00
  • #F00A
  • #FF0000
  • #FF0000AA
  • RGB(0,255,0)
  • RGB(0%,100%,0%)
  • RGBA(0,255,0,0.3)
  • HSL(540,70%,50%)
  • HSLA(540,70%,50%,0.3)

ダイアグラムとフローチャート

テキストからダイアグラムを生成するには

Wikiでは、diagram.netエディターで作成したダイアグラムを追加・編集することもできます。

Mermaid

詳細は公式ページをご覧ください。Mermaid Live Editorは、Mermaidを学び、Mermaidコードのイシューをデバッグするのに役立ちます。あなたのダイアグラムの問題を特定し、解決するために使用してください。

ダイアグラムやフローチャートを生成するには、mermaid ブロックの内部にテキストを記述します:

```mermaid
graph TD;
  A-->B;
  A-->C;
  B-->D;
  C-->D;
```
graph TD; A-->B; A-->C; B-->D; C-->D;

サブグラフを含めることもできます:

```mermaid
graph TB

  SubGraph1 --> SubGraph1Flow
  subgraph "SubGraph 1 Flow"
  SubGraph1Flow(SubNode 1)
  SubGraph1Flow -- Choice1 --> DoChoice1
  SubGraph1Flow -- Choice2 --> DoChoice2
  end

  subgraph "Main Graph"
  Node1[Node 1] --> Node2[Node 2]
  Node2 --> SubGraph1[Jump to SubGraph1]
  SubGraph1 --> FinalThing[Final Thing]
end
```
graph TB SubGraph1 --> SubGraph1Flow subgraph "SubGraph 1 Flow" SubGraph1Flow(SubNode 1) SubGraph1Flow -- Choice1 --> DoChoice1 SubGraph1Flow -- Choice2 --> DoChoice2 end subgraph "Main Graph" Node1[Node 1] --> Node2[Node 2] Node2 --> SubGraph1[Jump to SubGraph1] SubGraph1 --> FinalThing[Final Thing] end

PlantUML

PlantUMLインテグレーションはGitLab.comで有効になっています。GitLabのセルフマネージドインストールでPlantUMLを利用できるようにするには、GitLab管理者が有効にする必要があります

クロキ

KrokiをGitLabで使えるようにするには、GitLab管理者が有効にする必要があります。詳しくはKrokiインテグレーションページをご覧ください。

絵文字

GitLab でこのトピックを見る.

Rendered Markdown

をしたいと思うことがあります。 :monkey: を少しづつ追加していきます。 :star2: をあなたの :speech_balloon:さて、あなたにプレゼントがあります。

:zap:GitLab Flavored Markdownがサポートされているところならどこでも絵文字を使うことができます。:v:

を指摘するのに使うことができます。 :bug: 気遣う :speak_no_evil: をパッチします。もし誰かがあなたの:snail: コードを送信してください。 :birthday:.人々:heart: :heart: そのために

初めての方、ドンマイです。 :fearful:絵文字に参加することができます :family:.サポートされているコードの1つを調べるだけです。

対応する絵文字コードの一覧は、「絵文字チートシート」をご覧ください。 :thumbsup:

Code
Sometimes you want to :monkey: around a bit and add some :star2: to your
:speech_balloon:. Well we have a gift for you:

:zap: You can use emoji anywhere GitLab Flavored Markdown is supported. :v:

You can use it to point out a :bug: or warn about :speak_no_evil: patches.
And if someone improves your really :snail: code, send them some :birthday:.
People :heart: you for that.

If you're new to this, don't be :fearful:. You can join the emoji :family:.
Just look up one of the supported codes.

Consult the [Emoji Cheat Sheet](https://www.webfx.com/tools/emoji-cheat-sheet/)
for a list of all supported emoji codes. :thumbsup:

絵文字とお使いのオペレーションシステム

先ほどの絵文字の例では、ハードコードされた画像を使っています。GitLabでレンダリングされる絵文字は、OSやブラウザによって異なる場合があります。

ほとんどの絵文字はmacOS, Windows, iOS, Androidでネイティブにサポートされており、サポートされていない場合は画像ベースの絵文字にフォールバックします。

Linuxでは、Noto Color Emojiをダウンロードすることで、絵文字をフルネイティブでサポートすることができます。Ubuntu 18.04(多くの最新ディストリビューションと同様)には、このフォントがデフォルトでインストールされています。

カスタム絵文字の追加について詳しくは、カスタム絵文字をご覧ください。

フロントマター

フロントマターは、コンテンツの前に、Markdownドキュメントの先頭に含まれるメタデータです。このデータは、JekyllHugo、および他の多くのアプリケーションのような静的サイトジェネレータで使用することができます。

GitLabによってレンダリングされたMarkdownファイルを表示すると、フロントマターはそのままドキュメントの一番上のボックスに表示されます。HTMLコンテンツはフロントマターの後に表示されます。例を見るには、GitLabドキュメントファイルのソースとレンダリングバージョンを切り替えることができます。

GitLabでは、フロントマターはMarkdownファイルとWiki Pagesでのみ使われ、Markdownフォーマットがサポートされている他の場所では使われません。ドキュメントの一番上にあり、区切り文字の間になければなりません。

以下のデリミタがサポートされている。

  • YAML (---):

     ---
     title: About Front Matter
     example:
       language: yaml
     ---
    
  • TOML (+++):

     +++
     title = "About Front Matter"
     [example]
     language = "toml"
     +++
    
  • JSON (;;;):

     ;;;
     {
       "title": "About Front Matter"
       "example": {
         "language": "json"
       }
     }
     ;;;
    

他の言語は、既存の区切り記号のいずれかに指定子を追加することで対応可能です。 例えば

---php
$title = "About Front Matter";
$example = array(
  'language' => "php",
);
---

インライン差分

GitLab でこのトピックを見る.

インライン差分タグを使うと、{+ additions +} または[- deletions -] を表示することができます。

折り返しタグは、中括弧または角括弧のいずれかを使用することができます。

- {+ addition 1 +}
- [+ addition 2 +]
- {- deletion 3 -}
- [- deletion 4 -]

Inline diff as rendered by the GitLab interface


ただし、中括弧と角括弧を混在させることはできません:

- {+ addition +]
- [+ addition +}
- {- deletion -]
- [- deletion -}

diff に`code` フォントの単語が含まれている場合、バックスラッシュ` をバックスラッシュ\でエスケープしてください。そうしないと、diffのハイライトが正しく表示されません:

- {+ Just regular text +}
- {+ Text with `backticks` inside +}
- {+ Text with escaped \`backticks\` inside +}

Inline diff with mixed formatting, as rendered by the GitLab interface

Math

  • GitLab15.4で導入されたLaTeX互換のフラグ markdown_dollar_math。デフォルトでは無効。GitLab.comでは有効。
  • LaTeX互換フェンシングはGitLab 15.8で一般的に利用可能。機能フラグmarkdown_dollar_math を削除しました。

GitLab でこのトピックを見る.

LaTeX構文で書かれた数学はKaTeXでレンダリングされます。_KaTeX は LaTeX のサブセットしかサポートしていません。_この構文は Asciidoctor:stem: latexmathでも使えます。詳細は Asciidoctor のユーザーマニュアルを参照してください。

悪意のあるアクティビティを防ぐため、GitLabは最初の50個のインライン数式インスタンスのみをレンダリングします。レンダリング時間に基づいて、数学ブロックの数も制限されます。制限を超えた場合、GitLabは余分な数式インスタンスをテキストとしてレンダリングします。

ドル記号とバックティック ($`...`$) または単一ドル記号 ($...$) の間に書かれた数式は、テキストとインラインでレンダリングされます。

二重のドル記号 ($$...$$) の間、または言語がmath として宣言されたコードブロック内に書かれた数学は、別の行にレンダリングされます:

This math is inline: $`a^2+b^2=c^2`$.

This math is on a separate line using a ```` ```math ```` block:

```math
a^2+b^2=c^2
```

This math is on a separate line using inline `$$`: $$a^2+b^2=c^2$$

This math is on a separate line using a `$$...$$` block:

$$
a^2+b^2=c^2
$$

この数式はインラインです: $a^2+b^2=c^2$.

この数式は、```math ブロックを使用して別の行にあります:

a^2+b^2=c^2

この数式はインライン$$ を使って別の行にあります : \(a^2+b^2=c^2\).

この数式は、$$...$$ ブロックを使用して別の行にあります:

a^2+b^2=c^2 $$ です。

タスクリスト

GitLab 15.3で導入された適用不可のチェックボックス。

GitLab でこのトピックを見る.

Markdownがサポートされている場所ならどこでもタスクリストを追加できます。

  • イシュー、マージリクエスト、コメントでは、ボックスを選択することができます。
  • それ以外の場所ではボックスを選択することはできません。括弧内のx を追加または削除して、手動でMarkdownを編集する必要があります。

完了と未完了の他に、タスクは適用できないこともあります。イシュー、マージリクエスト、コメントで適用不可のチェックボックスを選択しても効果はありません。

タスクリストを作成するには、順序付きリストまたは順序なしリストのフォーマットに従ってください:

- [x] Completed task
- [~] Inapplicable task
- [ ] Incomplete task
  - [x] Sub-task 1
  - [~] Sub-task 2
  - [ ] Sub-task 3

1. [x] Completed task
1. [~] Inapplicable task
1. [ ] Incomplete task
   1. [x] Sub-task 1
   1. [~] Sub-task 2
   1. [ ] Sub-task 3

Task list as rendered by GitLab

目次

目次は、ドキュメントの小見出しにリンクする順序なしのリストです。イシューやマージリクエストには目次を追加できますが、ノートやコメントには追加できません。[[_TOC_]][TOC] のいずれかのタグを、サポートされているコンテンツタイプの説明フィールドに追加します:

  • Markdownファイル。
  • Wiki ページ。
  • イシュー
  • マージリクエスト
This sentence introduces my wiki page.

[[_TOC_]]

## My first heading

First section content.

## My second heading

Second section content.

Preview of an auto-generated table of contents in a Wiki

Wiki特有のMarkdown

以下のトピックはWiki内のリンクがどのように動作するかを示しています。

直接ページリンクはWikiの基本レベルで、そのページを指すページのスラッグを含みます。

この例はWikiのルートにあるdocumentation

[Link to Documentation](documentation)

ファイルへの直接リンクは、現在のページからの相対的なファイルの拡張子を指します。

次の例が<your_wiki>/documentation/related のページにある場合、<your_wiki>/documentation/file.md にリンクします:

[Link to File](file.md)

階層リンクは、./<page>,../<page>, などを使用することで、現在の Wiki ページからの相対的なリンクを構築することができます。

この例が<your_wiki>/documentation/main のページにある場合、<your_wiki>/documentation/related にリンクします:

[Link to Related Page](related)

この例が<your_wiki>/documentation/related/content のページにある場合、<your_wiki>/documentation/main にリンクします:

[Link to Related Page](../main)

この例が<your_wiki>/documentation/mainのページにある場合、<your_wiki>/documentation/related.md にリンクします:

[Link to Related Page](related.md)

この例が<your_wiki>/documentation/related/content のページにある場合、<your_wiki>/documentation/main.md にリンクします:

[Link to Related Page](../main.md)

ルートリンクは/ で始まり、Wikiルートからの相対リンクです。

この例は<wiki_root>/documentation にリンクしています:

[Link to Related Page](/documentation)

この例は<wiki_root>/miscellaneous.md にリンクしています:

[Link to Related Page](/miscellaneous.md)

.NETエディター

GitLab 15.10 で導入されました

Wikiでは、diagram.netエディターを使ってダイアグラムを作成することができます。また、diagram.netエディターで作成したダイアグラムを編集することもできます。ダイアグラム・エディターは、プレーン・テキスト・エディターとリッチ・テキスト・エディターの両方で利用できます。

詳細については、Diagrams.net を参照してください。

プレーンテキストエディタ

プレーン・テキスト・エディターでダイアグラムを作成するには

  1. エディターのツールバーで、ダイアグラムの挿入または編集({diagram}) を選択します。
  2. ダイアグラムを作成するには、diagram.net エディターを使用します。
  3. 保存して終了 を選択します。

図のMarkdown画像参照がWikiコンテンツに挿入されます。

プレーンテキストエディタでダイアグラムを編集するには

  1. このダイアグラムは、Mindjet Catalyst のドキュメント・テンプレートに含まれています。
  2. プレーン・テキスト・エディターでダイアグラムの挿入または編集({diagram}) を選択します。
  3. ダイアグラムを編集するには、diagram.net エディターを使用します。
  4. 保存して終了 を選択します。

ダイアグラムへのMarkdown画像参照がWikiコンテンツに挿入され、以前のダイアグラムが置き換えられます。

リッチテキストエディタ

リッチ・テキスト・エディターでダイアグラムを作成するには

  1. エディターのツールバーで、「その他のオプション({plus})を選択します。
  2. ドロップダウン・リストから、ダイアグラムの作成 または 編集 を選択します。
  3. ダイアグラムを作成するには、diagram.net エディターを使用します。
  4. 保存して終了 を選択します。

diagrams.netエディターで視覚化されたダイアグラムがWikiコンテンツに挿入されます。

リッチテキストエディタでダイアグラムを編集するには

  1. リッチ・テキスト・エディターでダイアグラムを編集するには
  2. フローティングツールバーで、ダイアグラムの編集({diagram}) を選択します。
  3. ダイアグラムを編集するには、diagram.net エディターを使用します。
  4. 保存して終了 を選択します。

選択したダイアグラムは、更新されたバージョンに置き換えられます。

GitLab固有のリファレンス

GitLab Flavored MarkdownはGitLab固有の参照をレンダリングします。例えば、イシュー、コミット、チームメンバー、あるいはプロジェクトチーム全体を参照することができます。GitLab Flavored Markdownはその参照をリンクに変え、それらの間を移動できるようにします。プロジェクトへのすべての参照は、プロジェクト名ではなくプロジェクトスラッグを使うべきです。

さらに、GitLab Flavored Markdownは特定のクロスプロジェクト参照を認識し、同じ名前空間の他のプロジェクトを参照するための省略記法も持っています。

GitLab Flavored Markdownは以下を認識します:

参考文献入力クロスプロジェクトリファレンス同じ名前空間内のショートカット
specific user@user_name  
specific group@group_name  
チーム全体@all  
プロジェクトnamespace/project>  
イシュー#123namespace/project#123project#123
マージリクエスト!123namespace/project!123project!123
スニペット$123namespace/project$123project$123
エピック&123group1/subgroup&123 
反復*iteration:"iteration title"  
脆弱性 1 [vulnerability:123][vulnerability:namespace/project/123][vulnerability:project/123]
機能フラグ[feature_flag:123][feature_flag:namespace/project/123][feature_flag:project/123]
IDでラベル~123namespace/project~123project~123
名前による一言ラベル~bugnamespace/project~bugproject~bug
名前による多言語ラベル~"feature request"namespace/project~"feature request"project~"feature request"
名前によるスコープ付きラベル~"priority::high"namespace/project~"priority::high"project~"priority::high"
ID別プロジェクトマイルストーン%123namespace/project%123project%123
なまえいちごう%v1.23namespace/project%v1.23project%v1.23
名前による複数ワードマイルストーン%"release candidate"namespace/project%"release candidate"project%"release candidate"
特定コミット9ba12248namespace/project@9ba12248project@9ba12248
コミット範囲比較9ba12248...b19a04f5namespace/project@9ba12248...b19a04f5project@9ba12248...b19a04f5
リポジトリファイルリファレンス[README](doc/README.md)  
リポジトリファイル行参照[README](doc/README.md#L13)  
アラート^alert#123namespace/project^alert#123project^alert#123
コンタクト[contact:test@example.com]  
  1. GitLab 13.7 で導入されました

例えば、issueをusingで参照すると、#123 issue番号123へのリンクとして出力され、text . #123同様に、イシュー番号 123 へのリンクが認識され、テキスト#123. #123イシューにリンク#123したくない #123場合は、先頭にバックスラッシュ\#123を付けてください。

これに加えて、いくつかのオブジェクトへのリンクも認識され、フォーマット化されています。 その例として、以下のようなものが挙げられます。

  • イシューに関するコメント:"https://gitlab.com/gitlab-org/gitlab/-/issues/1234#note_101075757"としてレンダリングされます。#1234 (comment 101075757)
  • イシューのデザインタブ:"https://gitlab.com/gitlab-org/gitlab/-/issues/1234/designs" #1234 (designs) としてレンダリングされます。
  • 個々のデザインへのリンク:"https://gitlab.com/gitlab-org/gitlab/-/issues/1234/designs/layout.png" #1234[layout.png] としてレンダリングされます。

リファレンスにイシュー、マージリクエスト、エピックタイトルを表示します。

  • GitLab 14.6 で導入されたイシュー、マージリクエスト、エピックに対応しました。
  • GitLab 16.0 で導入されたワークアイテムをサポートしました。

イシュー、ワークアイテム、マージリクエスト、エピックのレンダリングリンクにタイトルを含めるには、参照の最後にプラス (+) を追加します。例えば、#123+ のような参照は、The issue title (#123)としてレンダリングされます。

https://gitlab.com/gitlab-org/gitlab/-/issues/1234+ のような URL 参照も展開されます。

リファレンスにイシュー、ワークアイテム、マージリクエストのサマリーを表示します。

  • GitLab 15.10 で導入されたイシューとマージリクエストをサポートしました。
  • GitLab 16.0 で導入されたワークアイテムをサポートしました。

イシュー、ワークアイテム、マージリクエストのレンダリングリンクに拡張サマリーを含めるには、参照の最後に+s を追加してください。サマリーには、担当者マイルストーン、参照アイテムのヘルスステータスの情報が含まれます。

たとえば、#123+s のような参照は、The issue title (#123) • First Assignee, Second Assignee+ • v15.10 • Needs attention としてレンダリングされます。

https://gitlab.com/gitlab-org/gitlab/-/issues/1234+s のような URL 参照も展開されます。

担当者、マイルストーン、ヘルスステータスが変更された場合にレンダリングされた参照を更新するには、コメントまたは説明を編集して保存します。詳細については、イシュー420807 を参照してください。

メトリクスの埋め込み

メトリクスチャートはGitLab Flavored Markdownに埋め込むことができます。詳しくはEmbedding Metrics in GitLab flavored Markdownをお読みください。

Observabilityダッシュボードの埋め込み

GitLab Observability UIダッシュボードの説明やコメントを、エピックやイシュー、MRなどに埋め込むことができます。

Observability ダッシュボードの URL を埋め込むには:

  1. GitLab Observability UIで、アドレスバーにあるURLをコピーしてください。

  2. ダッシュボードを埋め込みたい場所にリンクを貼り付けます。GitLab Flavored MarkdownがURLを認識し、ソースを表示します。

標準のMarkdownから拡張された機能

すべての標準的なMarkdownフォーマットはGitLabで期待通りに動作するはずです。いくつかの標準的な機能は、標準的な使い方に影響を与えることなく、追加機能で拡張されています。機能が拡張された場合、新しいオプションはサブセクションとしてリストされます。

ブロッククォーツ

傍注などの情報を強調したい場合は、ブロッククオートを使用します。これは、ブロッククオートの行を> で始めることで生成されます:

> Blockquotes help you emulate reply text.
> This line is part of the same quote.

Quote break.

> This very long line is still quoted properly when it wraps. Keep writing to make sure this line is long enough to actually wrap for everyone. You can also *add* **Markdown** into a blockquote.

ブロッククオートは返信文のエミュレーションに役立ちます。この行は同じ引用の一部です。

引用ブレーク。

この非常に長い行は、折り返されても正しく引用されます。この行が実際に折り返すのに十分な長さであることを確認するために書き続けてください。Markdownをblockquoteに追加することもできます。

マルチライン・ブロッククオート

このセクションが正しく表示されない場合は、GitLabでご覧ください。

GitLab Flavored Markdownは標準のMarkdownを拡張し、>>> 、ブロックの前後に空白行で囲まれた複数行のブロッククォートもサポートします:


>>>
If you paste a message from somewhere else

that spans multiple lines,

you can quote that without having to manually prepend `>` to every line!
>>>

他の場所からのメッセージを貼り付ける場合

複数の行にまたがるような

を使えば、手動で> をすべての行に付加することなく、引用することができます!

コードスパン、ブロック

標準のテキストではなく、コードとして表示されるべきものをハイライトすることができます。

インラインコードは` でハイライトされます:

Inline `code` has `back-ticks around` it.

インラインcodeback-ticks around で表示されます。


より大きなコード例で同様の効果を得るには、次のようにします:

  • コードのブロック全体をトリプルバックティック (```) で囲みます。
  • コードのブロック全体をトリプル・チルダで囲みます (~~~)。
  • 4つ以上のスペースをインデントしてください。
```python
def function():
    #indenting works just fine in the fenced code block
    s = "Python code"
    print s
```

    Using 4 spaces
    is like using
    3-backtick fences.
~~~
Tildes are OK too.
~~~

上の3つの例は、次のようにレンダリングされます。

def function():
    #indenting works just fine in the fenced code block
    s = "Python code"
    print s
Using 4 spaces
is like using
3-backtick fences.
Tildes are OK too.

カラーコードとシンタックスハイライト

このセクションが正しく表示されない場合は、GitLabで表示してください。

GitLabはRouge Rubyライブラリを使ってコードブロックのシンタックスハイライトをよりカラフルにします。サポートされている言語の一覧はRougeプロジェクトのWikiをご覧ください。シンタックスハイライトはコードブロックでのみサポートされているため、インラインコードをハイライトすることはできません。

コードブロックをフェンスしてシンタックスハイライトを適用するには、冒頭のコード宣言にコード言語を追加し、3 つのバックティック (```) または 3 つのチルダ (~~~) を付けます:

```javascript
var s = "JavaScript syntax highlighting";
alert(s);
```

```python
def function():
    #indenting works just fine in the fenced code block
    s = "Python syntax highlighting"
    print s
```

```ruby
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
```

```
No language indicated, so no syntax highlighting.
s = "No highlighting is shown for this line."
But let's throw in a <b>tag</b>.
```

上の4つの例は、次のようにレンダリングされます。

var s = "JavaScript syntax highlighting";
alert(s);
def function():
    #indenting works just fine in the fenced code block
    s = "Python syntax highlighting"
    print s
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
No language indicated, so no syntax highlighting.
s = "No highlighting is shown for this line."
But let's throw in a <b>tag</b>.

強調

Markdownでは複数の方法でテキストを強調することができます。イタリック体、太字、取り消し線、そしてこれらの強調スタイルを組み合わせることができます。取り消し線はMarkdownの標準にはありませんが、GitLab Flavored Markdownの一部です。

例:

Emphasis, aka italics, with *asterisks* or _underscores_.

Strong emphasis, aka bold, with double **asterisks** or __underscores__.

Combined emphasis with **asterisks and _underscores_**.

Strikethrough uses two tildes. ~~Scratch this.~~

アスタリスクまたは_アンダースコアで_強調する、別名イタリック。

強い強調、別名ボールド、ダブルアスタリスクまたは__アンダースコア__付き。

アスタリスクと_アンダースコアで_複合的に強調する。

Strikethrough はチルダを 2 つ使用します。Scratch this.

単語内の複数のアンダースコアと単語途中の強調表示

このセクションが正しく表示されない場合は、GitLabで表示してください。

特に、複数のアンダースコアで表示されることが多いコードや名前を扱うときは、単語の一部を斜体にするのは避けましょう。GitLab Flavored MarkdownはMarkdownの標準を拡張し、単語内の複数のアンダーラインを無視することで、コードを議論するMarkdown文書のレンダリングを改善します:

perform_complicated_task

do_this_and_do_that_and_another_thing

but_emphasis is_desired _here_

perform_complicated_task

これとこれとこれとこれとこれとこれとこれとこれとこれとこれとこれとこれとこれとこれとこれとこれとこれとこれとこれとを行う

しかし、_ここでは_強調が必要です。


単語の一部だけを強調したい場合も、アスタリスクを使えば可能です。

perform*complicated*task

do*this*and*do*that*and*another thing

じゅうぶんのたびをつとめる

呉々も呉々も

脚注

脚注はMarkdownファイルの最後にレンダリングされるノートへのリンクを追加します。

脚注を作成するには、参照タグと、脚注の内容を記述した別の行(ファイル内の任意の場所)の両方が必要です。

タグの名前に関係なく、参照タグの相対的な順序によってレンダリング番号が決定される。

脚注の参照タグは次のようになります:[この参照タグは文字と数字が混在しています。[footnote-42] [^1]:このテキストは脚注の中にあります。  [footnote-42]:このテキストは別の脚注です。 

脚注の参照タグは次のようなものです:1

この参照用タグは、文字と数字が混在しています。[^footnote-42]

[^footnote-42]:このテキストも脚注です。

ヘッダー

# H1
## H2
### H3
#### H4
##### H5
###### H6

Alternatively, for H1 and H2, an underline-ish style:

Alt-H1
======

Alt-H2
------

GitLab Flavored MarkdownはMarkdownの標準を拡張し、コメント以外ではMarkdownでレンダリングされたすべてのヘッダが自動的にIDを取得し、リンクできるようにしました。

カーソルを合わせると、それらのIDへのリンクが表示されるので、ヘッダーにリンクをコピーして別の場所で使用することが容易になります。

IDは、以下のルールに従ってヘッダーの内容から生成される。

  1. すべてのテキストが小文字に変換されます。
  2. 単語以外のテキスト(句読点やHTMLなど)はすべて削除されます。
  3. すべてのスペースはハイフンに変換されます。
  4. 2つ以上並んだハイフンは1つに変換されます。
  5. 同じIDのヘッダーが既に生成されている場合は、1から始まる一意のインクリメント番号が付加される。

使用例:

# This header has spaces in it
## This header has a :thumbsup: in it
# This header has Unicode in it: 한글
## This header has spaces in it
### This header has spaces in it
## This header has 3.5 in it (and parentheses)

は、以下のリンクIDを生成します。

  1. this-header-has-spaces-in-it
  2. this-header-has-a-in-it
  3. this-header-has-unicode-in-it-한글
  4. this-header-has-spaces-in-it-1
  5. this-header-has-spaces-in-it-2
  6. this-header-has-3-5-in-it-and-parentheses

絵文字処理はヘッダーIDが生成される前に行われます。絵文字は画像に変換され、IDから取り除かれます。

ホリゾンタルルール

3つ以上のハイフン、アスタリスク、またはアンダースコアを使用して水平ルールを作成します:

Three or more hyphens,

---

asterisks,

***

or underscores

___

画像

例:

インラインスタイル(カーソルを合わせるとタイトルテキストを表示): ![alt text](img/markdown_logo.png "Title Text") リファレンススタイル(カーソルを合わせるとタイトルテキストを表示): ![alt text1][logo] [logo]: img/markdown_logo.png "Title Text"

インラインスタイル(カーソルを合わせるとタイトルテキストが表示されます)。

alt text

リファレンス風(カーソルを合わせるとタイトル文字が表示されます)。

alt text

画像またはビデオのサイズを変更します。

  • GitLab 15.7で導入された画像をサポートしました。
  • GitLab 15.9で導入された動画をサポートしました。

画像や動画の幅と高さを制御するには、画像に続けて属性リストを指定します。値は整数で、単位はpx (デフォルト) または% です。

例えば

![alt text](img/markdown_logo.png "Title Text"){width=100 height=100px}

![alt text](img/markdown_logo.png "Title Text"){width=75%}

alt text{width=100 height=100px}

Markdownの代わりにimg HTMLタグを使用し、そのheightwidth パラメータを設定することもできます。

動画

このセクションが正しく表示されない場合は、GitLabでご覧ください。

動画拡張子を持つファイルへのリンクを持つ画像タグは、自動的に動画プレイヤーに変換されます。有効な動画拡張子は.mp4,.m4v,.mov,.webm,.ogvです:

Here's a sample video:

![Sample Video](img/markdown_video.mp4)

サンプル動画はこちらです。

Sample Video

オーディオ

このセクションが正しく表示されない場合は、GitLabでご覧ください。

動画と同様に、オーディオ拡張子を持つファイルのリンクタグは自動的にオーディオプレーヤーに変換されます。有効な音声拡張子は.mp3,.oga,.ogg,.spx,.wavです:

Here's a sample audio clip:

![Sample Audio](img/markdown_audio.mp3)

ここでは、そのサンプル音声をご紹介します。

Sample Audio

インラインHTML

GitLab 14.6で導入された rel="license"

HTMLでレンダリングされたMarkdownの二番目の例を見るには、GitLabで見てください。

Markdownで生のHTMLを使うこともできます。

許可されるHTMLタグと属性のリストについては、HTML::パイプラインのSanitizationFilterクラスのドキュメントを参照してください。デフォルトのSanitizationFilter allowlist に加えて、GitLab ではspan,abbr,details,summary 要素を許可しています。rel="license"Rel-License マイクロフォーマットとライセンス属性をサポートするためにリンクで許可されています。

<dl>
  <dt>Definition list</dt>
  <dd>Is something people use sometimes.</dd>

  <dt>Markdown in HTML</dt>
  <dd>Does *not* work **very** well. HTML <em>tags</em> do <b>work</b>, in most cases.</dd>
</dl>
定義リスト
人が時々使うものです。
HTMLでマークダウン
とても**うまくは**動きません**。ほとんどの場合、HTMLタグは 機能します。

HTMLタグの内部でMarkdownを使用することは可能ですが、Markdownを含む行が独自の行に分離されている場合に限ります。

<dl>
  <dt>Markdown in HTML</dt>
  <dd>Does *not* work **very** well. HTML tags work, in most cases.</dd>

  <dt>Markdown in HTML</dt>
  <dd>

  Does *not* work **very** well. HTML tags work, in most cases.

  </dd>
</dl>
HTMLでマークダウン
とても**うまくは**動きません**。ほとんどの場合、HTMLタグは機能します。
HTMLでマークダウン
非常に うまく動作しません。ほとんどの場合、HTMLタグは動作します。

折りたたみセクション

2つ目のMarkdownの例をHTMLで表示するには、GitLabで表示します。

HTML の<details><summary> タグを使うと、コンテンツを折りたたむことができます。例えば、長いログファイルを折りたたんで、画面のスペースを取らないようにします。

<p>
<details>
<summary>Click this to collapse/fold.</summary>

These details <em>remain</em> <strong>hidden</strong> until expanded.

<pre><code>PASTE LOGS HERE</code></pre>

</details>
</p>

これをクリックすると折りたたみ/折りたたみができます。 これらの詳細のままです。 に隠されています。
ここにログを貼り付けます

これらのタグ内のマークダウンもサポートされています。

例のように、Markdownセクションの前後に空白行を残すことを忘れないでください:

<details>
<summary>

Click this to _collapse/fold._

</summary>

These details _remain_ **hidden** until expanded.

```
PASTE LOGS HERE
```

</details>
これをクリックすると折りたたみます これらの詳細のままです。 に隠されています。
ここにログを貼り付けます

改行

Enter を2回連続で押したときのように、前のテキストが2つの改行で終わっている場合、改行が挿入されます(新しい段落が開始されます)。改行が1つだけの場合(Enter を1回選択)、次の文も同じ段落の一部となります。長い行を折り返さず、編集可能な状態に保ちたい場合は、この方法を使用してください:

Here's a line for us to start with.

This longer line is separated from the one above by two newlines, so it is a *separate paragraph*.

This line is also a separate paragraph, but...
These lines are only separated by single newlines,
so they *do not break* and just follow the previous lines
in the *same paragraph*.

ここで、まずは1行だけご紹介します。

この長い行は上の行と2つの改行で区切られているので、別の段落です。

この行も独立した段落ですが… これらの行は単一の改行で区切られているだけなので、改行されず、同じ段落の前の行に続くだけです。

改行

GitLab Flavored Markdownは段落と改行の扱いについてMarkdownの仕様に準拠しています。

段落とは、上で説明したように、1行以上の空白行(最初の段落の終わりには2つの改行)で区切られた、1行以上の連続したテキストを指します。

改行やソフトリターンをもっとコントロールしたい?バックスラッシュや2つ以上のスペースで行を終えることで、1つの改行を追加します。改行を2つ並べると、空行を挟んで新しい段落になります:

First paragraph.
Another line in the same paragraph.
A third line in the same paragraph, but this time ending with two spaces.{space}{space}
A new line directly under the first paragraph.

Second paragraph.
Another line, this time ending with a backslash.\
A new line due to the previous backslash.

リンクはインラインスタイルと参照スタイルの2つの方法で作成できます。例えば

- この行は[インラインスタイルのリンク](https://www.google.com) - この行は[同じディレクトリのリポジトリファイルへのリンク](permissions.md) - この行は[1つ上のディレクトリのファイルへの相対リンク](../index.md) - この行は[タイトルテキストもあるリンク](https://www.google.com "This link takes you to Google!") ヘッダーIDアンカーを使用します:  - この行は[「#」とヘッダーIDを使った、別のMarkdownページのセクション](permissions.md#project-features-permissions) - この行は[「#」とヘッダーIDを使った、同じページの別のセクション](#header-ids-and-links)にリンクしています参照を使います:  - この行は[参照スタイルのリンク、下記参照][大文字小文字を区別しない任意の参照テキスト] - [参照スタイルのリンク定義に数字を使うことができます、下記参照][1] - あるいは空のままにしておき、[リンクテキストそのもの][]を使うこともできます、下記参照。  参照リンクが後からたどれることを示すテキスト。  [任意の大文字小文字を区別しない参照テキスト]: https://www.mozilla.org/en-US/ [1]: https://slashdot.org [リンクテキストそのもの]: https://www.reddit.com 

ヘッダーIDアンカーを使用する。

リファレンスを使用する。

参照リンクが後からついてくることを示すためのテキストをいくつか。

note
相対リンクでは、Wikiページ内のプロジェクトファイルやプロジェクトファイル内のWikiページを参照することはできません。理由は、Wikiは常にGitLabの別のGitリポジトリにあるからです。例えば、[I'm a reference-style link](style) は、リンクが Wiki Markdown ファイルの内部にあるときだけ、リンクをwikis/style に向けます。

URL自動リンク

GitLab Flavored Markdownはあなたがテキストに入れたほとんどのURLを自動リンクします:

- https://www.google.com
- https://www.google.com
- ftp://ftp.us.debian.org/debian/
- smb://foo/bar/baz
- irc://irc.freenode.net/
- http://localhost:3000

リスト

順序付きリストと順序なしリストを作成できます。

順序付きリストの場合、1.それぞれの行の先頭に、 , 1.のように、リストを始めたい番号を1.空白とともに 1.追加します。1.最初の番号の後は、どの番号を使ってもかまいません。 1.順序1.付きリストには、自動的に縦の順番で番号が振られるので 1.、同じリスト内のすべての項目で1.繰り返す 1.のが一般的です。1. 以外の番号で始めると、それが最初の番号として使われ、そこからカウントアップされます。

例:

1. First ordered list item
2. Another item
   - Unordered sub-list.
1. Actual numbers don't matter, just that it's a number
   1. Ordered sub-list
   1. Next ordered sub-list item
4. And another item.
  1. 先頭の順序付きリスト項目
  2. もう一つの項目
    • 順不同のサブリスト。
  3. 実際の数字は重要ではない、ただ数字であること。
    1. 順序付きサブリスト
    2. 次の順序のサブリスト項目
  4. そして、もうひとつの項目。

順序なしリストの場合は、各行の先頭に-*+ の後にスペースを入れますが、これらを混在させてはいけません。

Unordered lists can:

- use
- minuses

They can also:

* use
* asterisks

They can even:

+ use
+ pluses

順序なしリストができる。

  • 使い道
  • にがお

もできるそうです。

  • 使い道
  • アスタリスク

もできるそうです。

  • 使い道
  • プラス

リストアイテムが複数の段落を含む場合、後続の各段落はリストアイテムのテキストの開始位置と同じ高さにインデントされる必要があります。

使用例:

1. First ordered list item

   Second paragraph of first item.

1. Another item
  1. 先頭の順序付きリスト項目

    第1項目の2段落目

  2. もう一つの項目


最初のアイテムの段落が適切な数のスペースでインデントされていない場合、段落はリストアイテムの下で適切にインデントされるのではなく、リストの外に表示されます。例えば

1. First ordered list item

  Paragraph of first item.

1. Another item
  1. 先頭の順序付きリスト項目

第 1 項の段落

  1. もう一つの項目

順序なしリスト項目の最初のサブ項目である順序付きリストは、1. で始まらない場合、その前に空白行が必要です。

良い

- Unordered list item

  5. First ordered list item

悪い

- Unordered list item
  5. First ordered list item

CommonMark は、 順序付き リ ス ト 項目 と 順序なし リ ス ト 項目 と の間の空行を無視 し 、 それ ら を 1 個の リ ス ト の一部 と 見な し ます。これらは _リストとしてレンダリングされます。_リストとしてレンダリングされます。各リスト項目は段落タグで囲まれているため、段落間隔と余白があります。このため、各項目の間に余分な空白があるように見えます。

使用例:

- First list item
- Second list item

- A different list

CommonMarkは空白行を無視し、段落間隔を空けて1つのリストとしてレンダリングします。

上付き添い字/下付き添い字

CommonMarkとGitLab Flavored MarkdownはRedcarpetの上付き文字構文(x^2 )をサポートしていません。上付き文字と下付き文字には標準のHTML構文を使用してください:

The formula for water is H<sub>2</sub>O
while the equation for the theory of relativity is E = mc<sup>2</sup>.

水の式は H2O であり、相対性理論の式は E = mc2である。

キーボードのHTMLタグ

この<kbd> 要素は、ユーザーのキーボード入力を表すテキストを識別するために使わ <kbd>れます。タグで<kbd> 囲まれたテキストは <kbd>通常、ブラウザのデフォルトの等幅フォントで表示されます。

Press <kbd>Enter</kbd> to go to the next page.

Enter を押すと次のページに進みます。

テーブル

テーブルはMarkdownのコア仕様には含まれていませんが、GitLab Flavored Markdownの一部です。

Markdown

  1. 最初の行にはヘッダーが「パイプ」(|)で区切られて書かれています。
  2. 2行目はヘッダーとセルを分離します。
    • セルには空白、ハイフン、(オプションで)水平方向の整列のためのコロンのみを含めることができます。
    • 各セルには少なくとも1つのハイフンが含まれていなければなりませんが、セルにハイフンを追加してもセルのレンダリングは変わりません。
    • ハイフン、空白、コロン以外の内容は使用できません。
  3. 3行目とそれに続く行には、セルの値が格納される。
    • Markdownではセルを何行にもわたって区切ることはできません。必要であれば、改行を強制するためにHTMLの<br> タグを含めることもできます。
    • セルのサイズは互いに一致させる必要はありません。自由ですが、パイプ (|) で区切る必要があります。
    • 空白のセルを持つことができます
  4. 列幅はセルの内容に基づいて動的に計算されます。
  5. パイプ文字 (|) を表の区切り文字としてではなく、テキスト内で使用するには、バックスラッシュ (\|) でエスケープする必要があります。

使用例:

| header 1 | header 2 | header 3 |
| ---      | ---      | ---      |
| cell 1   | cell 2   | cell 3   |
| cell 4 | cell 5 is longer | cell 6 is much longer than the others, but that's ok. It eventually wraps the text when the cell is too large for the display size. |
| cell 7   |          | cell 9   |
ヘッダー1ヘッダー2ヘッダー3
セル1セル2セル3
セル4セル5が長いセル6は他のセルよりずっと長いですが、大丈夫です。表示サイズに対してセルが大きすぎる場合、最終的にテキストを折り返します。
セルセブン セル9

さらに、2行目の「ダッシュ」線の両端にコロン(:)を追加することで、列内のテキストの配置を選択することができます。これは列のすべてのセルに影響します:

| Left Aligned | Centered | Right Aligned |
| :---         | :---:    | ---:          |
| Cell 1       | Cell 2   | Cell 3        |
| Cell 4       | Cell 5   | Cell 6        |
左寄せセンタリング右寄せ
セル1セル2セル3
セル4セル5セル6

GitLab自身では、ヘッダーはChromeとFirefoxでは常に左揃え、Safariでは中央揃えになっています。

HTMLフォーマットを使ってテーブルのレンダリングを調整することができます。例えば、<br> タグを使ってセルを複数行にすることができます:

| Name | Details |
| ---  | ---     |
| Item1 | This text is on one line |
| Item2 | This item has:<br>- Multiple items<br>- That we want listed separately |
名前詳細
商品1このテキストは1行です
項目2このアイテムには以下が含まれます:
- 複数のアイテム
- 個別に掲載したいアイテム

GitLab 自体の HTML フォーマットを使ってチェックボックス付きのタスクリストを追加することができますが、docs.gitlab.com では正しくレンダリングされません。これらのタスクは、通常の GitLab タスクリストのように、選択されたときの状態を保存しません。

| header 1 | header 2 |
| ---      | ---      |
| cell 1   | cell 2   |
| cell 3   | <ul><li> - [ ] Task one </li><li> - [ ] Task two </li></ul> |

タスクリストをテーブルで完全に機能させるには、セルに Markdown を使った HTML テーブルを作成します:

<table>
<thead>
<tr><th>header 1</th><th>header 2</th></tr>
</thead>
<tbody>
<tr>
<td>cell 1</td>
<td>cell 2</td>
</tr>
<tr>
<td>cell 3</td>
<td>

- [ ] Task one
- [ ] Task two

</td>
</tr>
</tbody>
</table>
スプレッドシートからのコピー&ペースト

GitLab 12.7から導入されました

表計算ソフト(Microsoft Excel、Google Sheets、Apple Numbersなど)で作業している場合、GitLabはスプレッドシートからコピー&ペーストするとMarkdownテーブルを作成します。例えば、次のようなスプレッドシートがあるとします:

Copy from spreadsheet

セルを選択してクリップボードにコピーします。 GitLab Markdownエントリーを開き、スプレッドシートを貼り付けます。

Paste to Markdown table

JSON

GitLab 15.3 で導入されました

JSONコードブロックでテーブルをレンダリングするには、以下の構文を使います:

```json:table
{}
```

この機能のウォークスルーを次の動画でご覧ください:

items 属性は、データポイントを表すオブジェクトのリストです。

```json:table
{
    "items" : [
      {"a": "11", "b": "22", "c": "33"}
    ]
}
```

表のラベルを指定するには、fields 属性を使います。

```json:table
{
    "fields" : ["a", "b", "c"],
    "items" : [
      {"a": "11", "b": "22", "c": "33"}
    ]
}
```

items のすべての要素がfields に対応する値を持っている必要はありません。

```json:table
{
    "fields" : ["a", "b", "c"],
    "items" : [
      {"a": "11", "b": "22", "c": "33"},
      {"a": "211", "c": "233"}
    ]
}
```

fields が明示的に指定されていない場合、ラベルはitemsの最初の要素から選ばれます。

```json:table
{
    "items" : [
      {"a": "11", "b": "22", "c": "33"},
      {"a": "211", "c": "233"}
    ]
}
```

fields にはカスタムラベルを指定できます。

```json:table
{
    "fields" : [
        {"key": "a", "label": "AA"},
        {"key": "b", "label": "BB"},
        {"key": "c", "label": "CC"}
    ],
    "items" : [
      {"a": "11", "b": "22", "c": "33"},
      {"a": "211", "b": "222", "c": "233"}
    ]
}
```

fields の内部要素の並べ替えを有効にできます。

```json:table
{
    "fields" : [
        {"key": "a", "label": "AA", "sortable": true},
        {"key": "b", "label": "BB"},
        {"key": "c", "label": "CC"}
    ],
    "items" : [
      {"a": "11", "b": "22", "c": "33"},
      {"a": "211", "b": "222", "c": "233"}
    ]
}
```

filter 属性を使うと、ユーザー入力によって動的にフィルタリングされた内容を持つ表を表示することができます。

```json:table
{
    "fields" : [
        {"key": "a", "label": "AA"},
        {"key": "b", "label": "BB"},
        {"key": "c", "label": "CC"}
    ],
    "items" : [
      {"a": "11", "b": "22", "c": "33"},
      {"a": "211", "b": "222", "c": "233"}
    ],
    "filter" : true
}
```

デフォルトでは、すべての JSON テーブルのキャプションはGenerated with JSON data です。caption 属性を指定することで、このキャプションをオーバーライドできます。

```json:table
{
    "items" : [
      {"a": "11", "b": "22", "c": "33"}
    ],
    "caption" : "Custom caption"
}
```

JSONが無効な場合、エラーが発生します。

```json:table
{
    "items" : [
      {"a": "11", "b": "22", "c": "33"}
    ],
}
```

リファレンス

  1. このテキストは脚注の内部です。