Te traigo 10 editores de texto WYSIWYG hechos con javaScript y HTML5. En esta entrada te recopilo los que más me han gustado y sus características básicas, muchos de estos editores tienen fascinantes plugins o extensiones que pueden mejorar el editor a las características que necesitas.
TinyMCE
TinyMCE es una plataforma independiente basada en JavaScript HTML WYSIWYG. Permite convertir campos de texto HTML u otros elementos HTML a instancias de editor. Puedes cargar y administrar archivos en Microsoft Azure, Google Drive, Amazon S3, DropBox y más. Sigue la especificación WAI-ARIA, haciéndola compatible con lectores de pantalla como JAWS y NVDA. Además cuenta con una solución empresarial en la que puedes obtener como cliente soporte prioritario.
Características
- Incorporación de medios en directo
- Edición de imágenes incorporada
- Corrector ortográfico (empresa)
- MS-Word amigable
- Soporte de más de 40 idiomas
- Rendimiento robusto del navegador cruzado
Editor Raptor
Raptor
Raptor Editor es un editor de código abierto JavaScript WYSIWYG HTML diseñado para ser fácil de usar y fácil de integrar y personalizar. Está diseñado para la edición en línea y es ideal para diseños complejos de varios bloques. Utiliza las últimas tecnologías, incluidas las características HTML5 ContentEditable y jQuery, incluidas las pruebas de unidad integradas y una base de código modular y extensible y una API de complemento.
Características
- Soporte de edición en línea
- Opciones de acoplamiento flexibles
- Tema personalizable
- Bien documentada
Froala
Froala WYSIWYG HTML Editor es fácil de integrar y utilizar. Requiere mínimo conocimiento de codificación. Requiere jQuery 1.11.0 o superior y la fuente icónica llamada Font Awesome 4.4.0. En combinación con todas las características de UI y UX que tiene, también viene con un fuerte mecanismo de defensa contra ataques XSS.
Características
- 34 KB comprimido
- Edición en línea
- Los accesos directos del teclado están disponibles
- Requiere conocimientos básicos de HTML y JavaScript
- Tema oscuro y ligero (se puede personalizar mediante la edición del archivo LESS)
- Optimizado para móviles
- MS-Word amigable
- Se admiten hasta 34 idiomas, incluido el soporte RTL (derecha a izquierda)
ContentTools
ContentTools es un pequeño y bonito editor de contenido. ContentTools no utiliza ningún framework de JavaScript o biblioteca (ni siquiera jQuery). El paquete ContentTools se compone de 5 librerías js, cada una de las cuales se puede utilizar de forma independiente. Está diseñado para ser fácil de extender.
Características
- 49 KB gzip
- Edición en línea
- Cambiar el tamaño de las imágenes y videos
- Soporta deshacer / rehacer
Aloha
Aloha Editor es una editor WYSIWYG de contenido funcional. Le permite crear formulas de edición embebidas a la perfección en su aplicación web. El problema principal es que todavía no soporta la inserción de imágenes.
Características
- Tamaño de 142 KB
- MS-Word amigable
- Compatibilidad cruzada entre navegadores
- Personalizable
bootstrap wysiwyg
Bootstrap wysiwyg es un complemento JavaScript que facilita la creación de editores WYSIWYG sencillos y hermosos con la ayuda de thewysihtml5 y Twitter Bootstrap.
Características
- 206 KB minified
- Soporte de RequireJS
- Plantilla personalizada para la barra de herramientas
- Los temas personalizados están disponibles
- Expone eventos como carga y desenfoque
Summernote
Summernote es un editor de texto basado en Bootstrap. Hay varios temas disponibles para este editor y son impulsados por Bootswatch. También hay una versión convertida al tema Material design que se llama MaterialNote
Características
- 80 KB JS + CSS
- Soporta Bootstrap 3.x.x
- Se puede integrar fácilmente con Django, Rails o Angular
- Fácilmente personalizable
- Integración de CodeMirror
Redactor
Redactor es un editor rápido, potente y extensible con un equipo de soporte de calidad. Ha estado alrededor por los últimos 7 años y está bajo desarrollo activo. También sube automáticamente las imágenes a Amazon S3.
Características
- 75 KB minified
- Edición de texto en línea
- Soporte de CodeMirror
- Funcionalidad de arrastrar y soltar para las imágenes
- Dado que el editor está basado en plugins, puede extenderse fácilmente.
CKEditor
CKEditor es un editor de texto HTML listo para usar, diseñado para simplificar la creación de contenido web. Trae características comunes del procesador de textos directamente a sus páginas web.
Características
- Creación personalizada con CKBuilder
- MS Word amigable
- Edición en línea
- Deshacer / rehacer el apoyo
- Soporte RTL
- Soporta alrededor de 60 idiomas
Trumbowyg
Trusmbowyg es el más ligero de todos los editores listados aquí. Mientras que todos los editores WYSIWYG existentes son mayores de 45 KB, Trumbowyg es sólo 16 KB. Depende de jQuery> = 1.7.
Características
- Sólo 16 KB
- 30+ Localisations
Conclusión
Cómo puedes ver tienes un montón de editores de texto para todas las funcionalidades que estés buscando, los más conocidos (en mi opinión) son los editores de texto tinyMcd y ckEditor , y últimamente está ganando bastante popularidad el editor de texto de Bootstrap, supongo que por la buena popularidad que tiene bootstrap en estos momentos.
¿Utilizas alguno más? ¿Crees que me falta alguno en la lista?