Konversi Markdown ke HTML online

Ke mana HTML-nya akan dipakai

Markdown nyaman untuk ditulis, tetapi banyak tujuan hanya menerima HTML: tampilan source di editor CMS, template email, kolom deskripsi produk di toko online, portal dokumentasi tanpa dukungan Markdown, atau halaman statis yang Anda susun sendiri. Mengonversi di sini memberi Anda markup untuk ditempel ke tempat-tempat itu, dan pratinjau memungkinkan Anda memeriksa hasilnya sebelum tayang.

Konversi memakai dialek GitHub Flavored Markdown, jadi teks yang ditulis untuk README, deskripsi pull request, atau aplikasi catatan seperti Obsidian berperilaku sama di sini seperti di sana.

Seperti apa hasilnya

Konverter menghasilkan fragmen body: elemen-elemennya saja, tanpa <html>, <head>, atau gaya. Beberapa detail perlu diketahui sebelum Anda menempelnya di suatu tempat:

• Heading tidak punya atribut id. ## Harga menjadi <h2>Harga</h2>. Jika Anda butuh tautan jangkar untuk daftar isi, tambahkan id-nya sendiri.
• Blok kode membawa class bahasa. Pagar yang dibuka dengan `python menghasilkan <pre><code class="language-python">, yang otomatis dikenali highlighter seperti Prism dan highlight.js. Karakter seperti < dan & di dalam kode di-escape.
• Daftar tugas menjadi item daftar dengan checkbox nonaktif, sama seperti cara GitHub merendernya.
• Tabel menjadi markup <table> biasa dengan <thead> dan <tbody>. Perataan kolom yang diatur dengan titik dua di baris pemisah ditulis sebagai atribut align.
• Tidak ada gaya yang disertakan. Pratinjau menerapkan stylesheet ringan agar mudah dibaca, tetapi HTML yang disalin mewarisi CSS apa pun yang dimiliki halaman tujuan.

Versi unduhan membungkus fragmen dalam halaman mandiri yang minimal: dokumen <!doctype html> dengan <meta charset="utf-8"> dan <title> yang diambil dari heading pertama, sehingga huruf beraksen dan teks non-ASCII lainnya tampil benar saat file dibuka dari disk. Tidak ada gaya yang ditambahkan, jadi halaman memakai default browser.

Baris baru dan kejutan lainnya

Sebagian besar kebingungan dengan Markdown berasal dari segelintir aturan yang berbeda dari pengolah kata:

• Satu baris baru bukan baris baru. Dua baris yang ditulis atas-bawah bergabung menjadi satu paragraf. Sisakan baris kosong untuk memulai paragraf baru, atau akhiri baris dengan dua spasi atau backslash untuk memaksa <br>. Beberapa editor, termasuk komentar GitHub, memperlakukan satu baris baru sebagai pemisah baris; konverter ini mengikuti perilaku standar yang dipakai di file README GitHub dan sebagian besar static site generator.
• Front matter tidak dikenali. Blok YAML di antara baris --- di bagian atas file dirender sebagai garis horizontal diikuti teks, dan --- penutupnya bisa mengubah baris di atasnya menjadi heading. Hapus front matter sebelum mengonversi.
• Catatan kaki, rumus matematika, dan diagram bukan bagian dari dialek ini. $x^2$ tetap berupa teks literal dan blok Mermaid menjadi blok kode biasa. Sintaks catatan kaki bahkan lebih buruk daripada diabaikan: definisi seperti [^1]: note dibaca sebagai referensi tautan, jadi penandanya berubah menjadi tautan yang menunjuk ke kata note.
• Tanda kutip tetap lurus. Tanda kutip dan tanda pisah tipografis tidak disisipkan; apa yang Anda ketik itulah yang Anda dapat.
• Daftar bernomor yang tidak dimulai dari 1 tidak bisa dimulai langsung di bawah paragraf. Baris seperti 3. tiga diserap ke dalam teks paragraf kecuali dipisahkan baris kosong. Daftar berpoin dan daftar yang dimulai dari 1 tidak punya masalah ini.

HTML mentah dan keamanan

Markdown mengizinkan HTML mentah, dan konverter ini meneruskannya tanpa perubahan. Blok <details> atau <span style> yang Anda tulis sendiri akan muncul di hasil persis seperti ditulis. Itu berguna, tetapi juga berarti hasilnya tidak disanitasi: tag <script> atau atribut onerror di sumber akan ada di HTML yang disalin.

Pratinjaunya sendiri berjalan di frame sandbox dengan skrip dinonaktifkan, jadi melihat Markdown yang tidak tepercaya di sini aman. Menempel HTML hasilnya ke situs Anda sendiri adalah soal lain. Jika Markdown berasal dari pengguna atau sumber lain yang tidak tepercaya, proses HTML-nya dengan sanitizer di sisi Anda sebelum diterbitkan.

Konversi terkait

Untuk arah sebaliknya, dari halaman web atau ekspor CMS kembali ke Markdown, gunakan HTML ke Markdown. Untuk dokumen Word, DOCX ke Markdown menghasilkan Markdown yang kemudian bisa Anda pratinjau dan konversikan di sini. Semuanya berjalan di browser Anda saat mengetik, jadi draf dan dokumentasi internal tidak pernah dikirim ke server.