HTML Markdown 変換

Q: HTML を Markdown に変換するには？

上の欄に HTML を貼り付け、右側の Markdown をコピーするか .md ファイルとして保存します。変換はブラウザ内で行われます。

Q: リンクや画像が開けないのはなぜ？

HTML が /docs/sync のような相対アドレスを使っているためで、元のサイトでしか使えません。「ページのアドレス」に元のページのアドレスを入れると完全な URL になります。

Q: Markdown で表せない HTML はどうなりますか？

、 、色付きの文字など Markdown に記法のない要素は取り除き、中の文字だけを残します。結果をきれいな下書きとして使い、必要なところに書式を足してください。

Q: HTML の表だけを変換できますか？

できます。 をそのまま貼り付けるか、表計算ソフトからコピーした表にも対応した HTML 表 Markdown 変換を使ってください。

Webページやメール、CMS の HTML を貼り付けると、見出し・リスト・表・コード・リンクを保ったきれいな Markdown になります。内容はアップロードされません。

ページのアドレス

画像

HTML

706 文字20 行

# フィールドノートの使い方

フィールドノートは観察結果を**オフライン**で保存し、オンラインに戻ったときに同期します。詳しくは[同期ガイド](/docs/sync)をご覧ください。

![メモの画面](/img/notes.png)

## インストール

```bash
npm install field-notes
```

## オプション

| オプション | 既定値 |
| ---------- | -----: |
| `sync`     |   true |
| `quality`  |    0.8 |

- *通信がなくても*使えます
- ~~手動での書き出し~~は不要になりました

> ヒント：長い出張の前に同期しておきましょう。

333 文字23 行

対応している内容

GitHub Flavored Markdown: 表、タスクリスト、取り消し線、フェンスコードブロックを GitHub と同じ書き方で出力します。
コードの言語を保持: <pre><code class="language-js"> は js 付きのコードブロックになり、色分け用の span は取り除きます。
表を見つけて保持: HTML の表は Markdown の表になり、1 行目が太字のセルばかりなら見出し行として扱います。
リンクと画像: リンクと画像は文字とタイトルを保ち、相対アドレスはページのアドレスから補います。
レイアウトの要素を整理: スクリプト、スタイル、コメント、<div> や <span> などの囲みを取り除き、中の文字は残します。
数式と脚注: MathML や KaTeX の数式は $…$ の TeX に戻し、脚注の部分は Markdown の脚注にします。

プログラムで HTML を Markdown に変換する

JavaScript

Turndown はブラウザでも Node でも使えます。表と取り消し線には turndown-plugin-gfm プラグインを追加します。

import TurndownService from "turndown";

const turndown = new TurndownService({ headingStyle: "atx", codeBlockStyle: "fenced" });
const markdown = turndown.turndown("<h1>Hello</h1><p>World</p>");

Python

from markdownify import markdownify

markdown = markdownify(html, heading_style="ATX")

Pandoc

pandoc page.html -f html -t gfm -o page.md

よくある質問

HTML を Markdown に変換するには？

上の欄に HTML を貼り付け、右側の Markdown をコピーするか .md ファイルとして保存します。変換はブラウザ内で行われます。

Web ページを Markdown にするには？

ページの必要な部分を選んでコピーし、リッチテキスト Markdown 変換に貼り付けます。ソースから変換する場合は、ブラウザの開発者ツールで HTML をコピーし、ページのアドレスと一緒にここへ貼り付けます。

リンクや画像が開けないのはなぜ？

HTML が /docs/sync のような相対アドレスを使っているためで、元のサイトでしか使えません。「ページのアドレス」に元のページのアドレスを入れると完全な URL になります。

Markdown で表せない HTML はどうなりますか？

<div>、<span>、色付きの文字など Markdown に記法のない要素は取り除き、中の文字だけを残します。結果をきれいな下書きとして使い、必要なところに書式を足してください。

HTML の表だけを変換できますか？

できます。<table> をそのまま貼り付けるか、表計算ソフトからコピーした表にも対応した HTML 表 Markdown 変換を使ってください。

HTML はアップロードされますか？

されません。変換はブラウザ内で行われ、HTML が端末の外に出ることはありません。