HTML→Markdown 変換
ページ、メール、CMS から書き出した HTML を、読みやすい Markdown にできます。
- ブラウザ内で動作
- アップロード不要
- アカウント不要
ブラウザツールを読み込んでいます…
HTML→Markdown 変換でできること
ヘルプセンターを docs-as-code のリポジトリに移すときや、古いブログ記事を Markdown エディターに取り込むときは、たいてい HTML から始まります。マークアップを貼り付けると、その構造をそのまま反映した Markdown が書き出されます。見出しは見出しのまま、太字と斜体は ** と * に、リンクはタイトルを保ち、コードブロックは言語指定を保ちます。
番号付きリストは独自の開始番号を保ち、リスト項目内のチェックボックスは [x] または [ ] の印になります。逆方向の変換には Markdown→HTML 変換を使ってください。言葉だけが必要なら、HTML→プレーンテキスト変換で書式をすべて取り除けます。
例
入力
<h2>チームメンバーを招待する</h2> <p><b>設定</b> > <a href="/members">メンバー</a> に移動します。</p> <ol start="3"><li>メールアドレスを入力する</li><li>ロールを選ぶ<ul><li>編集者</li></ul></li></ol> <script>track()</script>
結果
## チームメンバーを招待する **設定** > [メンバー](/members)に移動します。 3. メールアドレスを入力する 4. ロールを選ぶ - 編集者
スクリプトは消え、> は普通の > になり、3 から始まるリストは番号が続き、入れ子の箇条書きは項目 4 の下にインデントされます。
HTML→Markdown 変換の使い方
- 「HTML」のボックスに HTML を貼り付けるか、「ファイルを開く」で .html または .htm ファイルを読み込みます。
- 右側の Markdown を確認します。HTML を編集すると更新されます。
- 「コピー」をクリックするか、「.md をダウンロード」で保存します。
知っておきたいこと
- インラインスタイルとクラスは無視されるため、元のページの色、フォントサイズ、レイアウトは失われます。引き継がれるのは構造だけです。
- 結合されたセル(colspan や rowspan)は Markdown の表では表現できないため、その行のセルはずれます。幅の広い表は変換後に確認してください。
/membersのような相対リンクは書かれたとおりに残るので、Markdown が同じサイトに置かれる場合にだけ機能します。- ナビゲーションメニューやフッターも、リンクのリストとして変換されます。内容だけが必要な場合は、記事部分の HTML だけを貼り付けてください。
HTML→Markdown 変換についてよくある質問
Web ページを Markdown に変換するには?
ページを開き、ブラウザの開発者ツールで記事本体の要素の outer HTML をコピーして、ここに貼り付けます。内容だけをコピーすれば、メニューやフッターが入りません。その後、Markdown をコピーするか、.md ファイルとしてダウンロードしてください。
表は保たれますか?
はい。HTML の表は、ヘッダー行付きのパイプの表になります。1 行目のセルの左揃え、中央揃え、右揃えは、:---: のような対応する区切りになり、セル内のパイプはエスケープされ、改行は <br> になります。
一部の文字がバックスラッシュでエスケープされるのはなぜですか?
*、[、]、バッククォートなどの文字は、Markdown では特別な意味を持ちます。HTML の中で普通のテキストとして出てくる場合、強調やリンクにならずにそのまま表示されるよう、変換ツールがバックスラッシュを付けます。
画像はどうなりますか?
http、https、相対アドレスの画像は、代替テキストとタイトル付きの Markdown の画像構文になります。data: URL として保存された画像は埋め込まれず、代替テキストだけが残ります。