Utilia

Editor i previsualitzador de Markdown

Escriu Markdown i mira'l renderitzat en directe. Admet GitHub Flavored Markdown, desament automàtic, còpia d'HTML i descàrrega en .md i .html.

Previsualització

Paraules
0
Caràcters
0
Temps de lectura
0 min

Com fer servir l’editor de Markdown

  1. Escriu o enganxa Markdown al quadre Markdown. La Previsualització del costat (a sota, en un telèfon) s’actualitza mentre escrius.
  2. Fes servir els botons de Format (Negreta, Cursiva, Títol, Enllaç, Llista, Cita, Codi) per emmarcar el text seleccionat, o prem Ctrl+B / Ctrl+I (⌘B / ⌘I en un Mac).
  3. Deixa marcat GitHub Flavored Markdown (taules, llistes de tasques, ~~ratllat~~, enllaços automàtics) per a la sintaxi que s’usa a GitHub, o desmarca’l per a un Markdown de tipus CommonMark senzill.
  4. Quan hagis acabat, fes clic a Copia l’HTML per enganxar l’HTML en un gestor de continguts o en una plantilla de correu, Baixa .md per desar el codi font en Markdown, o Baixa .html per obtenir una pàgina web completa.

Els comptadors sota l’editor mostren les Paraules i els Caràcters del document i un Temps de lectura estimat a 200 paraules per minut. Les paraules es compten al text renderitzat, de manera que els símbols de Markdown com # o ** no n’inflen el recompte.

Desament automàtic al navegador

Amb Desament automàtic en aquest navegador marcat, l’esborrany es desa poc després que deixis d’escriure, a l’emmagatzematge local del navegador d’aquest dispositiu. Quan hi tornes, es restaura l’últim esborrany. No s’envia res a cap servidor, de manera que l’esborrany no et segueix a un altre navegador ni a un altre dispositiu. En navegació privada, o si l’emmagatzematge és ple o està bloquejat, l’eina t’avisa que el desament automàtic no està disponible: baixa el teu text per conservar-lo. Si desmarques l’opció, s’elimina l’esborrany desat.

Full de referència de Markdown

  • Títols: # Títol, ## Secció, ### Subsecció
  • Èmfasi: **negreta**, _cursiva_, ~~ratllat~~ (GFM)
  • Enllaços: [text](https://example.com); amb GFM, les adreces web soltes també es converteixen en enllaços
  • Imatges: ![descripció](data:image/png;base64,…)
  • Llistes: - element o 1. element; llistes de tasques amb - [ ] i - [x] (GFM)
  • Cites: > text citat
  • Codi: `en línia` o un bloc entre dues línies de tres accents oberts
  • Taules (GFM): una fila de capçalera, una línia | --- | --- | i després una fila per línia

Seguretat de la previsualització i de l’exportació

El Markdown pot contenir HTML en brut, que podria amagar scripts. Cada vegada que s’actualitza la previsualització, l’HTML que produeix el motor de Markdown es neteja amb DOMPurify abans de mostrar-lo: s’eliminen els scripts, els gestors d’esdeveniments com onclick, els enllaços javascript:, els estils en línia, els formularis, els marcs i els mitjans incrustats. Els enllaços s’obren en una pestanya nova. El mateix HTML net l’utilitzen Copia l’HTML i Baixa .html, de manera que el pots enganxar a altres pàgines amb confiança.

La previsualització només mostra imatges incrustades com a URL data: o blob:. Les imatges remotes, com https://…/foto.jpg, no es carreguen mai: la política de seguretat d’aquesta pàgina les bloqueja, i això també vol dir que la previsualització no es pot fer servir per rastrejar-te. L’eina t’informa de quantes imatges no ha pogut mostrar. El Markdown que baixes conserva els enllaços originals de les imatges, de manera que funcionaran allà on el publiquis.

El fitxer .html és una pàgina autònoma amb un petit full d’estil integrat (tipus de lletra llegibles, taules, blocs de codi i mode fosc). El títol prové del primer títol del document, que també dona nom als fitxers baixats.

Preguntes freqüents

Què és GitHub Flavored Markdown?

GFM és el dialecte de Markdown que s’usa a GitHub i a molts altres llocs. Afegeix taules, llistes de tasques, text ratllat i enllaços automàtics a la sintaxi bàsica. Desmarca l’opció per veure com es renderitza el text sense aquestes extensions.

Puc fer servir HTML dins del Markdown?

Sí, l’HTML bàsic com <details>, <sup> o <kbd> funciona. Tot el que no és segur s’elimina, igual que els estils i les etiquetes de mitjans.

Per què no apareix la meva imatge?

A la previsualització només es mostren imatges data: i blob:; les imatges remotes es bloquegen. L’enllaç es manté al teu Markdown i funciona un cop publicat.

El meu document és privat?

Sí. El renderitzat, l’exportació i el desament automàtic passen al teu navegador. L’esborrany només es desa en aquest dispositiu, i pots desactivar el desament automàtic en qualsevol moment.

Quin motor de Markdown s'utilitza?

L’eina fa servir marked, un analitzador de Markdown ràpid i molt estès, i DOMPurify per netejar l’HTML. Tots dos només es carreguen quan s’inicia l’editor.