Editor de Markdown con vista previa gratis
Editor Markdown en vivo con previsualización desinfectada, recuento de palabras y exportación HTML/MD.
Cargando herramienta…
Cómo escribir Markdown con una vista previa en vivo
Editar Markdown e inspeccionar una vista previa desinfectada. Descarga el código fuente o la copia que se traduce en HTML para otro flujo de trabajo de publicación.
- Escribe o pega Markdown en el editor.
- Inspecciona encabezados, listas, énfasis y enlaces en la vista previa en vivo.
- Revisar el recuento de palabras y la redacción final.
- Descarga.md para código fuente editable o Copia HTML para marcado renderizado.
Para quién es este editor
Markdown es una forma ligera de formatear texto con caracteres simples. Un signo de libra hace un encabezado, los asteriscos hacen texto en negrita o cursiva, y un guión comienza un elemento de la lista. Este editor es útil cuando escribes en Markdown pero quieres ver el resultado con formato antes de que vaya a cualquier parte.
Los desarrolladores lo usan para redactar archivos README, cambios de registro y descripciones de solicitudes. Los escritores lo usan para preparar posts de blog para plataformas que aceptan Markdown. Los estudiantes y los tomadores de notas lo usan para comprobar que un largo contorno anida correctamente antes de pegarlo en una aplicación de notas.
También ayuda cuando necesita HTML limpio, pero no quiere escribir etiquetas a mano. Puede escribir Markdown, comprobar la vista previa y luego copiar el marcado renderizado en un sistema de gestión de contenido o una plantilla de correo electrónico que acepta HTML.
Un ejemplo práctico
Suponga que escribas tres líneas. El primero es dos señales de libras seguido de la lista de compras. El segundo es un guión, un espacio y Huevos envueltos en dobles asteriscos. El tercero es un guión, un espacio y Leche. Deja una línea en blanco después del encabezado.
La vista previa muestra un título de segundo nivel que lee Lista de compras, seguido de una lista con viñetas con dos artículos. La palabra Huevos aparece en negrita. Si pulsa Copiar HTML, el portapapeles recibe un elemento de encabezado h2 y una lista sin ordenar con dos elementos de lista, con Huevos dentro de un elemento fuerte.
El contador sobre el editor cuenta la fuente en bruto, no la vista previa. En este ejemplo se reportan 7 palabras, porque los signos de libra y guiones están separados por espacios y cuentan como palabras. También muestra el número total de caracteres en la fuente, incluyendo saltos de línea y espacios.
Cómo se produce la vista previa
El editor convierte tu texto con la biblioteca marcada, que sigue las reglas comunes de Markdown y soporta populares adiciones de estilo GitHub como tablas y bloques de código vallados. La conversión se ejecuta de nuevo en cada pulsación de teclas, por lo que la vista previa se mantiene en el paso con la fuente.
Antes de mostrar cualquier cosa, el HTML pasa a través de DOMPurify, un desinfectante que mantiene etiquetas de formato ordinarias y tiras de contenido arriesgado como etiquetas de script y manejadores de eventos en línea. El HTML copiado es esta versión desinfectada, por lo que puede diferir del HTML crudo que escribiste en la fuente.
Descargar.md guarda su fuente exacta como un archivo llamado document.md. Mantén ese archivo si planea editar el texto más tarde. Copied HTML es una salida terminada y no puede ser fácilmente convertido de nuevo en ordenado Markdown.
Errores comunes a evitar
Olvidar las líneas en blanco es el problema más frecuente. Una lista o encabezado que toca el párrafo anterior puede no representar la forma que usted espera. Bloques separados con una línea vacía y la estructura generalmente se vuelve clara a la vez.
Otro error es mezclar la hendidura dentro de listas anidadas. Usa el mismo número de espacios para cada nivel, y comprueba la vista previa para confirmar que cada elemento se encuentra en la profundidad correcta. Recuerda también que una sola línea dentro de un párrafo no inicia una nueva línea en Markdown estándar. Usa una línea en blanco para un nuevo párrafo.
Por último, no asuma que tu sitio web se verá idéntica a esta vista previa. Los estilos de tu sitio controlan fuentes, espaciados y colores, y algunas plataformas añaden o eliminan funciones de Markdown.
Consejos útiles y limitaciones
- Sanitization elimina HTML insegura.
- Su plataforma de publicación puede utilizar diferentes extensiones y estilos de Markdown.
- Envuelva el código en tres backticks en tus propias líneas y agrega un nombre de idioma como js después de los backticks de apertura para mantener el bloque claramente etiquetado.
- Descarga el archivo.md antes de cerrar la pestaña, porque el editor no guarda el texto entre visitas.
Preguntas frecuentes
¿Retiene código HTML copiado Markdown?
No. Guarda el archivo.md para una edición posterior de Markdown.
¿Pueden ejecutarse scripts incrustados?
La vista previa desinfectada no es un entorno arbitrario de ejecución de scripts.
¿Se verá mi blog idéntico?
No necesariamente. Su tema, extensiones y manejo HTML afectan la renderización.
¿Puedo crear tablas en este editor?
Sí. Las filas separadas por tuberías con una línea divisora discontinuada bajo la fila de cabecera renderizan como una tabla en la vista previa, siguiendo la sintaxis común del estilo GitHub.
¿Por qué la palabra cuenta más de lo que esperaba?
El conteo se toma de la fuente de Markdown en bruto, por lo que los símbolos separados por espacios, como los signos de libras y guiones de lista, se cuentan como palabras.
¿Qué nombre de archivo utiliza la descarga previa de Markdown?
La fuente se guarda como document.md, que puede cambiar el nombre después de descargar.
Su entrada se procesa en tu navegador sin una cuenta ToolWorld Online. Copia o descarga cualquier cosa que quieras guardar antes de salir de la página.
Lee nuestra política de privacidad · Acerca de ToolWorld Online