公開用のフラグメントか、共有用ファイルかを選択
Markdownで書きたい場合でも、WebサイトやCMSではHTMLが必要になることがあります。.mdファイルを開くか内容を貼り付け、変換結果を確認してから、コンテンツ部分だけのHTMLか完全なHTML文書を選んでください。
「HTMLをコピー」ではコンテンツ部分だけが出力されます。「HTMLをダウンロード」では内容をスタイルや数式フォントとともに文書にまとめます。出力形式が異なります。フラグメントには公開先のCSSが必要ですが、ダウンロードしたファイルには文書のスタイルが含まれます。
生成されるHTMLの内容
読みやすい文書構造
見出し、リスト、引用、表、リンクがHTML要素に変換されます。「プレビュー」から「HTML」に切り替えて、生成されたフラグメントを確認してください。
用途に応じた2種類の出力
CMS用にフラグメントをコピーするか、確認・共有用にスタイル付きのHTML文書をダウンロードできます。公開先が本文だけを求める場合、ページ全体のタグを削除する必要はありません。
技術的な例にも対応
主なプログラミング言語をハイライト表示できます。対応する数式やMermaid図は出力前にレンダリングされます。エラーは警告として表示され、内容が黙って置き換わることはありません。
単独文書のスタイルを設定
HTMLをダウンロードする前に、文字の見た目や色を設定できます。図はSVGとして埋め込まれ、数式フォントもダウンロードファイルに含まれます。
実際に必要な文書から始めましょう
ドキュメントの一節
既存のドキュメントのレイアウトに合わせて、記事の一部を変換します。
## インストール パッケージをインストールし、**結果を確認**します。 ```bash npm ci ``` > 元のMarkdownのコピーを保管してください。
- 見出しレベルが公開先のページに合う。
- コマンドが読みやすい。
- 引用の前後に適切な文脈がある。
ブログ用の比較表
表の内容を画像ではなくHTMLのセルとして保持します。
## 出力形式 | 形式 | 次の作業 | | --- | --- | | Markdown | 編集を続ける | | HTML | Webで公開 | | PDF | 閲覧用に共有 |
- 見出しセルがある。
- 狭い画面でもテキストが収まる。
- リンクを確認する。
基本的な使い方
Markdownを貼り付けるか、ファイルを開く
記事やREADMEのソースを使ってください。対応する一部の書式タグ以外の生HTMLは、テキストとして表示されます。
2つの表示を確認
まず文書を確認し、次にHTMLへ切り替えて見出し、リンク、表の構造を確認します。必要な要素が公開先で利用できることも確かめてください。
フラグメントか文書を選ぶ
マークアップを受け付ける編集画面にはHTMLをコピーします。スタイル付きファイルが必要ならHTMLをダウンロードします。公開前に、実際の公開先でテストしてください。
共有する前に結果を確認
| 内容 | 操作 | 確認できること |
|---|---|---|
| HTMLフラグメント | 公開先で許可されているマークアップとCSSを確認します。 | このプレビューで表示されても、CMSでスタイル、SVG、数式が削除される場合があります。 |
| 単独のHTMLファイル | ダウンロードしたファイルを別に開きます。 | 文書のスタイルと数式フォントが含まれます。有効にした外部画像は配信元の状態によります。 |
| リンクとスクリプト | リンク先を確認し、変換結果をスクリプトの配布に使用しないでください。 | このコンバーターは動作するコンテンツを削除し、未対応の生HTMLをテキストとして扱います。 |
この手順について
Webサイト向けにMarkdownをHTMLへ変換するには？
.mdファイルを開くかソースを貼り付け、プレビューを確認してから、コンテンツのマークアップには「HTMLをコピー」を使います。スタイルを含む完全な文書が必要な場合は「HTMLをダウンロード」を選びます。公開前に、Webサイトで貼り付けたHTMLがどう扱われるか確認してください。
「HTMLをコピー」と「HTMLをダウンロード」の違いは？
「HTMLをコピー」ではコンテンツ部分だけが得られます。「HTMLをダウンロード」では、タイトル、文書のスタイル、レンダリング済みの内容を含む完全な文書が作成されます。
Markdownの表をHTMLの表に変換できますか？
はい。パイプ記号を使った表はHTMLの表要素になります。結合セルを含む複雑な表は基本のMarkdown表記では対応できないため、手動での編集が必要な場合があります。
数式とMermaidはHTMLに含まれますか？
対応する数式はKaTeXでレンダリングされ、Mermaid図はSVGとして埋め込まれます。ダウンロード文書には数式フォントが含まれます。コピーしたフラグメントでは公開先のスタイルが必要な場合があります。
どのCMSにも出力を貼り付けられますか？
まずCMSのルールを確認してください。HTMLソースを受け付ける編集画面もあれば、タグをテキストとして表示したり、SVGや数式を削除したりする画面もあります。実際の公開手順で小さな例を試してください。
ダウンロードしたHTMLは完全にオフラインで使えますか？
文書のスタイル、レンダリング済みの図、数式フォントは含まれます。画像を埋め込まない場合、外部画像やリンクは元の場所を参照します。
変換のためにMarkdownがアップロードされますか？
MarkdownからHTMLへの変換とHTMLのダウンロードはブラウザー内で行われます。別の「PDFをダウンロード」操作では、レンダリング済みの文書がこのサイトに送信されます。
文書の取り扱いについて
- Markdownの解析とHTMLの生成は端末内で行われます。
- コピーされるHTMLはフラグメント、ダウンロードされるHTMLはスタイル付き文書です。
- 動作するコンテンツは削除されますが、リンクとCMSのルールは確認してください。
形式に関する参考資料HTML要素リファレンスCommonMark仕様
再現できる問題を報告ブラウザー、選択した設定、機密情報を含まない小さなサンプルをお知らせください。個人情報を含むファイルはメールで送信しないでください。
