Markdown Önizleme
Sol tarafta yazın, sağ tarafta HTML’in render edilişini izleyin. Önizleme, GitHub tarzı Markdown’ı destekler: tablolar, görev listeleri, sözdizimi vurgulu çitli kod blokları, üstü çizili metin, otomatik bağlanan URL’ler ve satır içi HTML. Commit’ten önce bir README hazırlamak, bir yorumun PR’de nasıl görüneceğini kontrol etmek ya da her tuş vuruşunun render edilişini izleyerek Markdown sözdizimini öğrenmek için kullanışlıdır.
Önizleme nasıl kullanılır
-
1
Markdown yazın
Sol bölme ham Markdown alır. Her değişiklik sağ bölmeyi anında yeniden render eder.
-
2
HTML önizlemesini görün
Sağ bölme, GitHub gibi biçimlendirilmiş render çıktısını gösterir.
-
3
Modu değiştirin
Dikkat dağıtmadan yazmak için yan yana görünüm, yalnızca önizleme veya yalnızca kaynak.
-
4
HTML'yi kopyalayın
Bir e-posta istemcisine veya CMS'ye yapıştırmanız gerekiyorsa render edilmiş HTML'yi alın.
Bu önizlemenin desteklediği özellikler
- CommonMark: başlıklar, paragraflar, vurgu, listeler, blok alıntılar, kod blokları, bağlantılar, resimler, yatay çizgiler.
- GFM uzantıları: sütun hizalamalı tablolar, görev listeleri (
- [ ]ve- [x]),~~ile üstü çizili metin, otomatik bağlanan URL’ler ve dil ipucu içeren çitli kod blokları. - Sözdizimi vurgusu: highlight.js ile 100’den fazla dil, JavaScript, Python, Go, Rust, SQL, YAML vb.
- Ham HTML: satır içi HTML olduğu gibi geçirilir (güvenlik için temizlenir).
- Matematik (isteğe bağlı): matematik uzantısını etkinleştirirseniz
$...$satır içi ve$$...$$blok olarak render edilir.
Desteklenmeyenler
- Obsidian tarzı özel wiki bağlantıları (
[[Page]]), bunlar yalnızca Obsidian’a özgüdür. - Pandoc’un çitli div’leri (
:::), yalnızca Pandoc için. - Sunucu tarafı içeriştirmeler (server-side includes) veya
{% ... %}şablon etiketleri.
Tipik kullanımlar
- README hazırlama: IDE dışında yazıp son sürümü yapıştırın.
- PR yorum biçimini kontrol etme: yayınlamadan önce, GitHub’ın yorum kutusu kod bloklarını doğru önizlemez.
- Notları HTML’ye dönüştürme: biçimlendirilmiş içeriği bir e-postaya veya ham HTML kabul eden bir CMS’ye yapıştırmanız gerektiğinde.
- Markdown öğretme: yan yana görünüm sözdizimini apaçık ortaya koyar.
Performans
Render işlemi, GFM eklentili bir Markdown-it ayrıştırıcısı kullanır ve tamamen tarayıcıda çalışır. Birkaç yüz KB’lik belgeler milisaniyeler içinde render edilir; çok büyük olanlar (tek dosyada koca bir kitap) siz yazarken takılabilir, böyle bir durumda bunları bölümlere ayırın.
Dışa aktarma
- HTML’yi kopyala, render edilmiş içeriği ve biçim sınıflarını içeren
<div>’i verir. - .md indir, kaynağı kaydeder.
- Tarayıcınızın yazdırma penceresinden PDF’e yazdır, render edilmiş görünümün biçimlendirilmiş bir PDF kopyasını üretir.
Sık Sorulan Sorular
GitHub, GFM’nin üzerine kendi CSS’ini uygular. HTML çıktısı eşleşmelidir; biçimlendirme (yazı tipleri, boşluklar) onlara aittir. Tam eşitlik için “GitHub’ta render edildi” tema anahtarını kullanın.
Evet, matematik uzantısını etkinleştirirseniz, satır içi $...$ ve blok $$...$$ KaTeX ile render edilir. Sayfayı hafif tutmak için varsayılan olarak kapalıdır.
Temizlenir, <div>, <span>, <table>, <img> gibi güvenli etiketler geçer; <script> ve satır içi olay işleyicileri kaldırılır.
Yüzlerce KB sorunsuz çalışır. Çok büyük dosyalar için canlı render’ı kapatıp istek üzerine render edin.
Render tamamen istemci tarafında yapılır. İçerik hiçbir yere gönderilmez. Sayfayı yenilerseniz, tarayıcı form durumunu korumadıkça taslaklar kaybolur.
İlgili Araçlar
ASCII Tablosu Referansı
NUL, LF ve DEL dahil her kod için ondalık, onaltılık, sekizlik ve ikili değerlerle HTML sayısal karakter başvurusu gösterimini sunan tam ASCII tablosu.
HTML Karakter Referansı
HTML varlıklarının aranabilir listesi; adlandırılmış ve sayısal kodlarıyla birlikte özel karakter ve semboller için tek tıkla kopyalama.
Klavye kısayolları başvurusu
macOS, Windows ve Linux’ta VS Code, Chrome ve GNU Readline kullanan Bash için belgelenmiş varsayılan kısayolları arayın.
FPS Sayacı
requestAnimationFrame ile tarayıcı FPS değerini ölçün: yumuşatma, en düşük ve en yüksek kare hızı, uyarı eşiği ve isteğe bağlı grafik. Yerel çalışır, yükleme ve API yoktur.
EditorConfig Oluşturucu
Girinti stili ve boyutu, satır sonu, karakter kümesi ve boşluk kurallarınızla bir .editorconfig dosyası oluşturarak IDE ve editörler arasında tutarlı biçimlendirme sağlayın.
E-posta Doğrulayıcı
Bir e-posta adresini doğrulayın: RFC 5322 sözdizimi kontrolü, canlı MX kaydı sorgulama, ayrıca yerel kısım, alan adı ve uzunluk bilgileri. Hiçbir e-posta gönderilmez.
Araç diğer dillerde mevcuttur
- Markdown-Vorschau [DE]
- Aperçu Markdown [FR]
- Markdown-förhandsvisare [SV]
- Markdown 미리보기 [KO]
- Markdown-preview [NL]
- معاينة Markdown [AR]
- Previsualizador de Markdown [ES]
- Pratinjau Markdown [ID]
- Markdownプレビュー [JA]
- ตัวแสดงตัวอย่าง Markdown [TH]
- Trình xem trước Markdown [VI]
- Podgląd Markdown [PL]
- Visualizador de Markdown [PT]
- Markdown 预览器 [ZH]
- Markdown Previewer [EN]
- Visualizzatore Markdown [IT]
- Предпросмотр Markdown [RU]