Markdown 表作成ツールを使う理由
Markdown の表はプレーンテキストです。1行が1つの行で、セルはパイプで区切られ、見出しの下にはハイフンの区切り行が入ります。読むのは簡単ですが、入力には手間がかかり、列を手でそろえるのは面倒です。1つ長い値が入るだけで、ほかのすべての行の余白を調整し直すことになります。
このツールは、小さなスプレッドシートのように入力できるマス目を用意し、Markdown を自動で書き出します。手元にあるデータも読み込めます。Excel や Google スプレッドシートからコピーしたセル、CSV のテキスト、既存の Markdown の表です。
マス目の使い方
- どのセルにも 入力 できます。1行目は見出しで、太字で表示されます。
- 行を追加 と 列を追加 で表を大きくできます。各行の横と各列の上にある小さな × ボタンで削除できます。
- Enter キー で1つ下の行に移動します。最後の行で Enter を押すと、新しい行が追加されます。
- 揃え方：各列の上にある選択メニューで、標準、左揃え、中央揃え、右揃え を設定します。
- 複数のセルを まとめて貼り付ける と、貼り付けたセルを起点にマス目が埋まります。
- データを貼り付け を押すと、スプレッドシートのセル、CSV、Markdown の表を貼り付けるボックスが開きます。表に読み込む を押すと、その内容でマス目が置き換わります。
- 行と列を入れ替え で、表の縦と横を入れ替えます。
- サンプル で例を読み込み、クリア で空の3×3のマス目からやり直せます。
Markdown はマス目の下に表示されます。列をそろえる をオンにすると、すべてのセルに余白を加えて、プレーンテキストでも読みやすい表にします。いちばん短い出力にしたい場合はオフにします。コピー でクリップボードにコピーし、ダウンロード で .md ファイルとして保存します。
作成例
1列目を左揃え、価格を右揃え、ユーザー数を中央揃えにした、小さな料金表です。
| Plan | Price | Users |
| :------- | ----: | :-------: |
| Free | $0 | 1 |
| Team | $12 | 10 |
| Business | $30 | Unlimited |区切り行のコロンが揃え方を決めます。左にコロンがあれば左揃え、右なら右揃え、両側なら中央揃えです。列をそろえる をオフにすると、同じ表が余白なしで書き出されます。
| Plan | Price | Users |
| :-- | --: | :-: |
| Free | $0 | 1 |
| Team | $12 | 10 |
| Business | $30 | Unlimited |どちらも表示結果は同じです。余白のある方はテキストファイルで読んだり編集したりしやすく、詰めた方は短く、値を1つ変えたときの差分も小さくなります。
セル内の特殊文字
セルにパイプがあるとそこでセルが終わってしまうので、このツールはパイプをエスケープします。スプレッドシートから貼り付けたときなどにセル内に入る改行は <br> になります。
| Command | Meaning |
| -------------- | ----------- |
| a \| b | pipe output |
| line1<br>line2 | two lines |**bold**、リンク、インラインコードなど、セル内のほかの Markdown はそのまま残り、通常どおり表示されます。
余白の計算では、中国語、日本語、韓国語の文字を2列分の幅として数えます。ほとんどの等幅フォントでそのように表示されるためです。そのおかげで、日本語を含む表でも、こうしたフォントを使うエディタではパイプの位置がそろいます。
Markdown の表が使える場所
GitHub、GitLab、Bitbucket、Obsidian、Reddit、そしてほとんどの静的サイトジェネレーターがこの表の書き方に対応しています。これは GitHub Flavored Markdown に由来する書き方です。もともとの Markdown には表がなかったので、とても古いレンダラーではパイプがそのまま表示されることがあります。
ヒント
- 表の幅は狭く保ちましょう。長い文章は段落に書くべきです。短い列が3〜6列の表が、スマートフォンでもいちばん読みやすくなります。
- データがすでにスプレッドシートにあるなら、そこから始めましょう。範囲をコピーして最初のセルに貼り付け、揃え方を調整します。
- 長い文書の中にある表を整えるには、文書全体を Markdown整形ツール に貼り付けてください。同じように表の余白がそろえられます。
- 表ではなく JSON にしたいデータには、CSV JSON 変換ツール を使ってください。
- Web ページの HTML の表を Markdown にしたいときは、HTML Markdown 変換ツール を使ってください。
Markdown の表を作るほかの方法
- VS Code：Markdown All in One などの拡張機能を使うと、ドキュメントを整形したときに表もその場で整えられます。
- Pandoc を使えば、コマンドラインで CSV やスプレッドシートから書き出したデータを Markdown の表にできます。
- Google スプレッドシート：Markdown で書き出す機能は組み込まれていませんが、セルをコピーしてここに貼り付ければ数秒で済みます。
処理はすべてブラウザ内で行われます。貼り付けたデータがどこかに送信されることはありません。