Pratinjau Markdown & Konverter HTML

Lihat Markdown Anda dirender berdampingan lalu salin HTML-nya — pratinjaunya berjalan dalam sandbox di browser Anda.

Cara menggunakan

  1. Ketik atau tempel Markdown Anda di sebelah kiri — pratinjau di sebelah kanan diperbarui saat Anda mengetik.
  2. Centang "Perlakukan satu baris baru sebagai
    " bila Anda menulis untuk kotak obrolan atau kolom komentar, tempat setiap Enter memulai baris baru.
  3. Klik "Konversikan ke HTML" untuk menampilkan kode sumber HTML-nya, lalu salin atau unduh berkas .html yang siap dibuka.

Tentang alat ini

Markdown adalah teks biasa dengan beberapa kesepakatan tanda baca — tanda pagar untuk judul, tanda bintang untuk penekanan, tanda hubung untuk butir daftar — yang diubah sebuah konverter menjadi HTML. Alat ini merendernya dengan marked dalam mode GitHub Flavored Markdown, jadi apa yang benar-benar orang tulis tetap terjaga: tabel, blok kode berpagar dengan penanda bahasa, daftar tugas, coretan, dan URL polos yang menjadi tautan. Pratinjaunya berada di samping editor dan digambar ulang saat Anda mengetik, jadi Anda menemukan tabel yang rusak atau pagar kode yang belum ditutup sambil menulis, bukan setelah Anda mendorong README ke repositori.

Sebuah konverter Markdown punya satu keputusan keamanan yang harus diambil, dan halaman ini menyatakannya terang-terangan alih-alih menyamarkannya: marked tidak menyanitasi apa pun. Markdown memang sengaja mengizinkan HTML mentah, jadi tag script, gambar dengan penangan onerror, atau tautan yang mengarah ke URL javascript: keluar dari parser persis seperti saat masuk. Merendernya di dalam halaman ini akan menjadi celah cross-site scripting. Alih-alih menulis penyanitasi, pratinjau digambar di dalam iframe yang atribut sandbox-nya kosong — semua pembatasan diaktifkan. Tanpa allow-scripts tidak ada yang dieksekusi dan tidak ada penangan peristiwa yang berjalan; tanpa allow-same-origin, frame itu berada di origin buram dan tidak dapat membaca halaman ini, cookie-nya, maupun penyimpanannya. Content-Security-Policy default-src 'none' di dalam frame adalah lapisan kedua yang berdiri sendiri. Sebuah penyanitasi justru akan menunjukkan kepada Anda sesuatu yang berbeda dari HTML yang akan Anda salin, dan dalam sebuah pratinjau itu jelas pertukaran yang keliru.

Yang sengaja tidak disanitasi adalah HTML-nya sendiri, karena justru itulah produknya: salin dan unduh memberi Anda persis apa yang dihasilkan marked. Maka ketika Markdown Anda memuat sesuatu yang dapat menjalankan kode, alat ini menyebutkannya — script, iframe, form, penangan on-, URL javascript: — dan mengingatkan bahwa isolasinya berhenti di pratinjau. Bila Anda menerbitkan HTML itu sementara Markdown-nya berasal dari orang lain, risikonya ikut terbawa. Semuanya berjalan dalam JavaScript di perangkat Anda sendiri dan tidak ada yang Anda ketik diunggah. Satu-satunya permintaan yang dibuat pratinjau adalah permintaan yang Anda tulis sendiri, ketika sebuah gambar mengarah ke URL eksternal. Tautan di pratinjau tidak dapat diklik: itulah harga dari sandbox, dan untuk sebuah pratinjau harganya murah.

Pertanyaan yang sering diajukan

Apakah Markdown saya keluar dari browser?

Tidak. Teksnya diurai dan dirender oleh JavaScript di perangkat Anda: tidak ada yang dikirim ke server mana pun, disimpan, atau dicatat. Putuskan koneksi internet setelah halaman termuat dan alat ini tetap berfungsi.

Apakah alat ini menyanitasi HTML-nya?

Tidak, dan alat ini tidak berpura-pura melakukannya. Pratinjaunya diisolasi dalam iframe bersandbox, jadi tidak ada yang berjalan di sana, tetapi HTML yang Anda salin persis seperti yang dihasilkan parser. Bila Markdown-nya berasal dari orang lain, sanitasi dulu sebelum menerbitkannya.

Kenapa tautan di pratinjau tidak bisa diklik?

Karena frame pratinjau mengaktifkan semua pembatasan sandbox, dan navigasi adalah salah satunya — sakelar yang sama yang mencegah tautan javascript: berjalan. Salin HTML-nya bila Anda butuh tautan yang aktif.

Varian Markdown mana yang didukung?

GitHub Flavored Markdown: CommonMark ditambah tabel, blok kode berpagar dengan penanda bahasa, daftar tugas, coretan, dan tautan otomatis. Judul tidak diberi atribut id, jadi anchor yang dibuat GitHub untuk daftar isi tidak tersedia.

Apa bedanya HTML yang disalin dengan berkas yang diunduh?

Salin memberi Anda potongan HTML, untuk ditempelkan ke halaman yang sudah Anda miliki. Unduhan membungkusnya menjadi dokumen lengkap dengan charset UTF-8 dan gaya yang enak dibaca, sehingga terbuka dengan benar secara mandiri, lengkap dengan huruf beraksennya.

Baris baru tunggal saya hilang. Kenapa?

Karena dalam Markdown standar satu baris baru hanya dianggap spasi — paragraf dipisahkan oleh baris kosong. Kotak obrolan dan kolom komentar berganti baris di setiap Enter, jadi centang "Perlakukan satu baris baru sebagai
" saat menulis untuk keperluan itu.

Alat terkait

Tautan panjang? Perpendek secara gratis

Vai.la mengubah URL apa pun menjadi tautan pendek dengan statistik klik, QR Code, dan biolink Anda sendiri.

Vai.la tidak bertanggung jawab atas cara alat-alat ini digunakan maupun atas keputusan yang diambil berdasarkan hasilnya.