Markdown Editor online

Code

Export

The print dialog opens with the document only. Choose Save as PDF (or "Microsoft Print to PDF") as the printer. In Chrome and Edge, untick "Headers and footers" if the browser offers it. The text in the PDF stays sharp and can be selected.

My documents

Click a document to open it. They are stored only in this browser - nothing is uploaded. Clearing the browser's site data removes them, so download the ones you want to keep.

AI Assistant

Any AI can write with you - ChatGPT, Claude, Gemini, Copilot.

  1. Click Copy prompt.
  2. Paste it into your AI and say what it should write.
The AI should

The document travels in the link after the “#”, which no server sees. What you paste into your AI is handled by its provider.

Save to your server

The editor can send each saved version to your own server (a webhook), so your work is kept where you want it. Nothing is sent until you enter an address here.

What your server receives

A POST request with JSON (your server must allow CORS from https://md.giit.ch):

{ "editor": "md", "event": "save", "id": "…", "name": "Notes",
  "content": "# Notes\n\n…",
  "assets": { "logo.png": "data:image/png;base64,…" },
  "updated": "YYYY-MM-DDTHH:MM:SS.000Z" }
Embed the editor in your website
<iframe src="https://md.giit.ch/?embed=1" style="width:100%;height:80vh;border:0"></iframe>
<script>
const frame = document.querySelector('iframe');
addEventListener('message', e => {
  if (e.origin !== 'https://md.giit.ch' || e.source !== frame.contentWindow) return;
  if (e.data.type === 'mdeditor:ready')
    frame.contentWindow.postMessage({ type: 'mdeditor:load', name: 'Notes',
      content: '# Notes\n\n…', assets: {} }, 'https://md.giit.ch');
  if (e.data.type === 'mdeditor:save') saveOnYourServer(e.data.content, e.data.assets);
});
</script>

Also possible: ?src=<URL of a .md file> opens a file, &webhook=<URL> saves this document there. The editor can also open in a window of its own (?embed=window), and your page can hand it its own AI prompt and a session key so the AI sends its result to your server (mdeditor:ai, mdeditor:key-request) - see "Use the editor on your own website" below the editor. Details are in llms.txt.

Help

How it works

  1. Write Markdown on the left - or start with New and one of the templates. The preview in the middle shows the document as you type.
  2. Click text in the preview to edit it right there: the cursor is where you clicked, and the code's cursor goes to the same place. Enter or a click elsewhere writes the change into the code (one step for Undo), Escape cancels; characters such as * or _ are escaped so they stay text. A click on math, a picture or code jumps to its place in the code instead. Ctrl + click follows a link. A check box of a task list ticks the task in the code.
  3. Insert on the right has ready-made pieces (headings, lists, tables, math, symbols); Pictures holds the pictures of the document; Outline lists the headings.
  4. Problems (a missing picture, a link to a heading that is not there, a code block that is never closed, a table row with too many cells) are listed above the code - click one to go there.
  5. My documents (the folder button at the top left) lists every document kept in this browser.
  6. Export makes an HTML page, a PDF (via the print dialog) or plain text. Download .md saves the code (with its pictures as ZIP).

The preview understands CommonMark with GitHub's tables, task lists, strikethrough, autolinks and footnotes, and math in $…$ and $$…$$. HTML in the Markdown is shown without scripts, styles, frames and forms.

Keyboard shortcuts

Ctrl + B / I
Bold / italic around the selected text
Ctrl + K
Link
Ctrl + M
Math: $…$ around the selection
Ctrl + /
Lines in or out of a comment (<!-- -->)
Ctrl + Enter
Show the cursor's place in the preview
Tab / Shift + Tab
Indent / outdent
Ctrl + Z / Y
Undo / redo
Ctrl + S / E
Save (download .md, or to your server) / export
Ctrl + O
My documents
Ctrl + P
Print / save as PDF

Enter in a list starts the next item (-, 1., - [ ], >); on an empty item it ends the list. * _ ` ~ $ [ ( close by themselves around a selection.

Çevrimiçi Markdown yazın, canlı önizlemeyle

Markdown Editörü kodunuzu ve bitmiş belgeyi yan yana gösterir. Yazdığınız her şey hemen önizlemede görünür - başlıklar, listeler, tablolar, görev listeleri, dipnotlar ve formüller - ve önizlemedeki herhangi bir metne tıklamak sizi koddaki yerine götürür. Metni doğrudan önizlemede de düzenleyebilirsiniz. Böylece README'leri, notları, belgeleri ve makaleleri hızla yazabilirsiniz.

Her şey tarayıcınızda çalışır. Belgeler yüklenmez; kayıt ve reklam yoktur.

Editörün yapabilecekleri

Vurgulamalı kod

Kendi renklerinde başlıklar, listeler, bağlantılar, kod, formüller ve HTML, satır numaraları, Enter ile devam eden listeler ve satırlarıyla birlikte açık bir sorun listesi.

GitHub Markdown

Tablolar, görev listeleri, üstü çizili metin, otomatik bağlantılar ve dipnotlarla CommonMark. Başlıklar GitHub'dakiyle aynı çapaları alır ve onlara verilen bağlantılar kontrol edilir.

Formüller

$…$ içinde satır içi formüller ve $$…$$ içinde ayrı satırda formüller, doğrudan önizlemede KaTeX ile dizilir.

Önizlemede düzenleyin

Önizlemede bir cümleye, başlığa, liste öğesine veya tablo hücresine tıklayın ve orada değiştirin - Markdown, özel karakterler kaçışlanarak takip eder.

Resimler

Bir resmi editöre sürükleyin ve ![description](name.png) ile kullanın. Resimler tarayıcınızda belgeyle birlikte saklanır.

Dışa aktarma

Resimleri içeren tek bir HTML dosyası, yazdırma iletişim kutusu üzerinden PDF, düz metin veya resimleriyle birlikte Markdown ZIP olarak.

Nasıl çalışır

  1. Başlayın - "Yeni" altından bir şablon seçin, bir .md dosyası açın veya Markdown yapıştırın.
  2. Yazın - koda yazın; önizleme takip eder. Tablolar, listeler ve formüller için "Ekle"yi kullanın.
  3. Dışa aktarın - bir HTML sayfası, bir PDF veya .md dosyasını kaydedin.

Editörü kendi web sitenizde kullanın

Her https sayfası (ve localhost) editörü bir <iframe> ve ?embed=1 ile yerleştirebilir - kayıt yok, anahtar yok. Yerleştirildiğinde editör bu metni gizler ve bir Kaydet düğmesi gösterir. Belgeyi içeri almanın ve dışarı vermenin iki yolu vardır.

1. Bir bağlantıdan dosya açın, sunucunuza kaydedin

src= bir dosya açar (sunucunuz CORS'a izin vermelidir), webhook= ise "Kaydet"in (Ctrl+S) belgeyi o adrese göndermesini sağlar. Authorization: Bearer … başlığı için &token=…, her değişiklikten sonra kaydetmek için &auto ekleyin.

<iframe src="https://md.giit.ch/?embed=1&src=https://your-site.com/docs/notes.md&webhook=https://your-site.com/save.php"
        allow="clipboard-write" style="width:100%;height:800px;border:0"></iframe>

Webhook, JSON içeren bir POST alır: { editor, event: "save", id, name, content, assets, updated }. Bunu saklayan küçük bir PHP betiği:

<?php
header('Access-Control-Allow-Origin: https://md.giit.ch');
header('Access-Control-Allow-Headers: Content-Type, Authorization');
header('Access-Control-Allow-Methods: POST, OPTIONS');
if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') exit;
if (($_SERVER['HTTP_AUTHORIZATION'] ?? '') !== 'Bearer SECRET') { http_response_code(403); exit; }
$d = json_decode(file_get_contents('php://input'), true);
$name = preg_replace('/[^\w\- ]/u', '_', $d['name']);
file_put_contents(__DIR__ . "/docs/$name.md", $d['content']);
echo '{"ok":true}';

2. Belgeyi sayfanız tutar (postMessage)

Editör mdeditor:ready der, sayfanız mdeditor:load ile yanıt verir, editör mdeditor:loaded, gerçek düzenlemelerde mdeditor:change ve kullanıcı kaydettiğinde mdeditor:save bildirir. Sayfanız mdeditor:get (geçerli durum) veya mdeditor:save (Kaydet'e basma) gönderebilir. Kaydetme böylece kendi oturum açma ve oturum sisteminiz üzerinden yapılır.

<iframe id="ed" src="https://md.giit.ch/?embed=1" allow="clipboard-write" style="width:100%;height:800px;border:0"></iframe>
<script>
const ed = document.getElementById('ed');
const ORIGIN = 'https://md.giit.ch';

addEventListener('message', async e => {
  if (e.source !== ed.contentWindow || e.origin !== ORIGIN) return;
  const m = e.data;
  if (m.type === 'mdeditor:ready') {                // editör hazır: belgeyi ona verin
    ed.contentWindow.postMessage({
      type: 'mdeditor:load',
      name: 'Notes',
      content: await (await fetch('/docs/notes.md')).text(),
      assets: { 'logo.png': 'data:image/png;base64,…' }   // isteğe bağlı resimler
    }, ORIGIN);
  }
  if (m.type === 'mdeditor:change') document.title = '● not saved';   // gerçek bir düzenleme
  if (m.type === 'mdeditor:save') {                 // kullanıcı "Kaydet"e tıkladı
    await fetch('/api/save', { method: 'POST', headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ name: m.name, content: m.content, assets: m.assets }) });
    document.title = 'Saved';
  }
});

// Kendi sayfanızda bir kaydet düğmesi: yanıt mdeditor:save olarak gelir
function saveNow() { ed.contentWindow.postMessage({ type: 'mdeditor:get' }, ORIGIN); }
</script>

Sayfanızın içinde Yapay Zekâ Asistanı: çerçeve içinde de çalışır. iframe üzerinde allow="clipboard-write" ile "İstemi kopyala" panoyu doğrudan kullanır (aksi halde editör eski kopyalama komutuna geri döner veya istemi elle kopyalamanız için gösterir). Yapay zekânın gönderdiği bir bağlantı başka bir web sitesinin içindeki editöre ulaşamaz; bu yüzden editör, yapay zekâya ve kullanıcıya bunun yerine yapay zekânın yanıtının tamamını editöre yapıştırmasını söyler - veya editörü kendi penceresinde açın.

3. Kendi penceresinde

window.open("https://md.giit.ch/?embed=window", "mdeditor-17") tam editörü kendi penceresinde açar ve aynı mesajları window.opener ile konuşur. Yapay zekâdan gelen bağlantılar ona orada ulaşır. mdeditor:load ayrıca context: { host, title, rules } taşıyabilir - yapay zekâ istemi bu durumda belgenin nereye ait olduğunu söyler ve kurallarınıza uyar - ve hook: { url, token, assets: false }, yalnızca bu belge için olan ve asla saklanmayan bir webhook. Kaydedilmemiş değişikliklerle pencereyi kapatmak mdeditor:closing gönderir.

4. Kendi sunucunuz üzerinden yapay zekâ

Editöre kendi isteminizi, sitenizde bir adresi ve bu editör oturumu için bir anahtarı verin. Yapay zekâ iletişim kutusu bu durumda sitenize "Bağlı" olduğunu, yapay zekâya ne söylediğinizi ve geçerli belgeyi değiştir veya yeni bir belge oluştur seçimini gösterir; İstemi kopyala hepsini bir araya getirir. Yapay zekâ sonucunu anahtarla sunucunuza gönderir ve sayfanız onu editörde açar - yeni bir belge ayrı açılır ve kullanıcının tarayıcısında kalır. Editör oturumu başına bir anahtar: editör açık olduğu sürece geçerli kalır ve editör yalnızca anahtarı yokken mdeditor:key-request ile ister. Editör anahtarı asla kendisi göndermez ve asla saklamaz; adres kendi alan adınızda veya onun bir alt alan adında https olmalıdır.

const key = async () => (await fetch('/api/ai-key.php?doc=17')).json();   // editör oturumu başına bir anahtar
const k = await key();
ed.contentWindow.postMessage({ type: 'mdeditor:load', name: 'Notes', content, ai: {
  label: 'My Site', prompt: 'Keep the [[placeholders]]. Write in German.',
  endpoint: 'https://your-site.com/api/ai-result.php', key: k.key } }, ORIGIN);
// mdeditor:loaded içindeki id'yi hatırlayın ve başka id'li change/save/closing mesajlarını yok sayın
// yalnızca editörün anahtarı yokken:
if (m.type === 'mdeditor:key-request') { const k = await key(); ed.contentWindow.postMessage({ type: 'mdeditor:ai', key: k.key }, ORIGIN); }
// editör açıkken sunucunuza her dakika bildirin; editörü veya sayfayı kapatmak anahtarı geçersiz kılar
setInterval(() => fetch('/api/ai-key.php?alive=' + k.key.slice(0, 8)), 60000);
// sunucunuzda bir sonuç var (polling, SSE …): target "current" veya "new" olur
ed.contentWindow.postMessage({ type: 'mdeditor:load', name: 'Notes', content: draft, from: 'ai', target }, ORIGIN);
<?php // api/ai-key.php - oturum açmış kullanıcının bu editör oturumuna ait anahtar (sayfanız çağırır)
session_start();                                     // kullanıcının bu belgeyi düzenleyebileceğini kontrol edin
$key = bin2hex(random_bytes(24));
$_SESSION['ai'][hash('sha256', $key)] = ['doc' => (int)$_GET['doc'], 'seen' => time()];  // veya veritabanınızda; ?alive= seen değerini yeniden ayarlar
echo json_encode(['key' => $key]);

<?php // api/ai-result.php - yapay zekâ buraya gönderir (CORS başlıkları yok: yapay zekâlar bunu bir sunucudan çağırır)
$key = preg_replace('/^Bearer\s+/', '', $_SERVER['HTTP_AUTHORIZATION'] ?? '');
$row = find_key(hash('sha256', $key));               // veritabanınız: geçersiz kılınmamış, son 3 dakikada görülmüş
if (!$row) { http_response_code(401); exit('{"ok":false,"error":"key not valid"}'); }
$d = json_decode(file_get_contents('php://input', false, null, 0, 2000000), true);
save_draft($row['doc'], $d['content'], $d['target'] === 'new' ? 'new' : 'current');   // sayfanız bunu mdeditor:load ile gösterir
echo '{"ok":true}';

Anahtarları en az 128 rastgele bitle oluşturun, yalnızca özetlerini (hash) saklayın, her birini oturum açmış kullanıcıya, belgeye ve bu editör oturumuna bağlayın, oturum başına bir tane oluşturun, yalnızca sayfanız oturumu açık bildirdiği sürece geçerli tutun ve editör veya sayfa kapandığında geçersiz kılın.

Protokolün tamamı llms.txt dosyasındadır - bir yapay zekâya verin, sisteminiz için bağlantıyı o kursun. LaTeX Editörü ve SVG Editörü latexeditor: ve svgeditor: önekleriyle aynı şekilde çalışır - latex.giit.ch, svg.giit.ch.

Sıkça sorulan sorular

Belgem yükleniyor mu?

Hayır. Editör tamamen tarayıcınızda çalışır. Kendi sunucunuza bir webhook kurmadığınız sürece belgeleriniz ve resimleriniz asla bir sunucuya gönderilmez.

Editör hangi Markdown'ı anlar?

GitHub uzantılarıyla CommonMark: tablolar, görev listeleri, üstü çizili metin, otomatik bağlantılar ve dipnotlar, ayrıca $…$ ve $$…$$ içinde formüller. Başlıklar GitHub'dakiyle aynı çapaları alır, böylece [see below](#my-heading) gibi bağlantılar çalışır.

Nasıl PDF veya HTML sayfası elde ederim?

"Dışa aktar"a tıklayın. PDF'i seçin ve "Yazdır / PDF olarak kaydet"e tıklayın - yazdırma iletişim kutusunda "PDF olarak kaydet"i seçin. Ya da resimleri ve stilleri içeren tek bir dosya için HTML sayfasını seçin.

Nasıl resim eklerim?

Bir resmi editöre sürükleyin veya yapıştırın ya da sağdaki Resimler sekmesinde ekleyin. Tarayıcınızda belgeyle birlikte saklanır ve ![description](name.png) ile kullanılır.

Belgelerim nereye kaydediliyor?

Yalnızca tarayıcınıza. Belgeleri açmak, yeniden adlandırmak, çoğaltmak, indirmek veya silmek için sol üstteki klasör düğmesine (Belgelerim) tıklayın. Tarayıcınızın site verilerini temizlemek onları siler; bu yüzden saklamak istediklerinizi indirin - veya editörün onları kendi sunucunuza göndermesine izin verin ("Sunucuya kaydet").

Bir yapay zekâ Markdown Editöründe yazabilir mi?

Evet, her yapay zekâ - ChatGPT, Claude, Gemini, Copilot veya kodlama aracınızdaki yapay zekâ. "Yapay Zekâ Asistanı"na, ardından "İstemi kopyala"ya tıklayın, istemi yapay zekânıza yapıştırın ve ne yazması gerektiğini söyleyin. Yapay zekâ bir bağlantıyla yanıt verir; ona tıklayın, belge editörünüzde görünür. "Geri al" her değişikliği geri alır.

Editörü kendi web sitemde kullanabilir miyim?

Evet. Bir iframe ile yerleştirin ve belgeleri postMessage ile alıp verin ya da kaydedilen her sürümü bir webhook ile sunucunuza göndermesine izin verin. Örnekler için Editörü kendi web sitenizde kullanın bölümüne bakın.

Markdown Editörü ücretli mi?

Hayır. Editör ücretsizdir; reklam ve kayıt yoktur.