MarkdownをHTMLプレビューに変換する方法

このツールでできること

Markdown風の文章を、読みやすいHTMLプレビューとして確認したいときに使えるツールです。入力欄に文章を渡すと、見出し、リスト、引用、リンク、コードなど、定義されたパターンに沿って表示形式へ変換できます。空欄のままでも処理は成功しますが、プレビューは空の状態になります。

使い方の手順

プレビューしたいMarkdown風の文章を用意します。入力は任意なので、文章を省略して空欄のまま進めることもできます。
文章を入力欄に貼り付けるか、直接入力します。見出しは#から######まで、コード、表のような行、水平線、引用、画像、リンク、強調、取り消し線、リストなど、対応する記法を含められます。
変換を実行します。空でない文章では、元の文章の文字数も成功結果に含まれます。
表示されたHTMLプレビューを確認し、意図した部分が見出しやリンクなどとして表示されているかを見ます。対応対象外の書き方を含む文章では、入力した記法どおりにならない可能性があるため、必要に応じて対応するパターンへ書き換えて再確認します。

結果の見方

プレビューは、入力した文章を定義されたパターン置換で整形したHTML表示です。したがって、文章の見た目を確認する用途では、見出しの段階、箇条書き、引用、コード部分、リンクなどが意図した構造として表れているかを読み取ります。空欄で成功した場合は、処理に失敗したのではなく、空のプレビューが返った状態です。文章を入力した場合に示される文字数は、変換後の表示文字数ではなく、元の入力文章の文字数です。

使用例

見出しと箇条書きの見た目を確認したい人が、短い買い物リストを入力してプレビューを確認します。

「# 買い物リスト」と箇条書きの2行を入力し、変換を実行して見出しとリストの表示を確認します。

成功結果として、整形されたHTMLプレビューが表示され、元の入力文章の文字数も含まれます。

制限事項

プレビューは定義されたパターン置換に基づくため、Markdownの全仕様に対応するとは限りません。

よくある間違い

入力した記法がそのまま表示される場合は、対応するパターンの外側に記号を置いている可能性があります。見出し、リンク、コードなどの記法を対応する形に整えてから、もう一度変換してください。

よくある質問

文章を入力しなくても使えますか？

空欄でも処理は成功します。ただし、表示されるプレビューは空になります。

どのようなMarkdown記法をプレビューできますか？

対応するパターンには、見出し、コード、表のような行、水平線、引用、画像、リンク、強調、取り消し線、リストなどがあります。ただし、Markdown全体への対応を示すものではありません。

結果に表示される文字数は何を数えていますか？

空でない文章では、成功結果に元の入力文章の文字数が含まれます。変換後のHTMLの文字数を示すものではありません。