El editor de texto que hace respetar las reglas

Escribe libremente.
Impón reglas cuando las necesites.

NGTextEditor es un editor de texto integrable que permite tanto un uso libre como un uso estrictamente controlado mediante una configuración simple. Evita contenidos inconsistentes, derivas de formato y errores que terminan rompiendo tus interfaces.

Un editor pensado para proteger tus contenidos, no solo formatearlos.

Ver la demo Leer la documentación

Los editores clásicos dan demasiada libertad

En la mayoría de las aplicaciones:

  • Los usuarios pueden hacer de todo
  • Las reglas son implícitas
  • La identidad corporativa se ignora
  • El HTML se vuelve inconsistente
  • El soporte y el mantenimiento explotan

Los editores genéricos esperan que todo salga bien.

En la práctica, nunca es el caso.

Un editor gobernado por reglas explícitas

NGTextEditor funciona de manera diferente.

En lugar de exponer todas las opciones posibles, se basa en una configuración declarativa (JSON) que define precisamente:

  • Lo que está permitido
  • Lo que está prohibido
  • Cómo debe estructurarse el contenido

El editor aplica estas reglas en tiempo real. El usuario no puede salirse del marco.

// Configuración declarativa 
"media": {
  "link": true,
  "image": {
    "activate": true,
    "allowImageUrl": true,
    "allowDragNDrop": true,
    "allowRotation": true,
    "allowOpacity": true,
    "allowBorder": true
  },
  "video": {
    "activate": true,
    "allowBorder": false
  },
  "table": true,
  "columns": {
    "activate": true,
    "maxNumberOfColumns": 3,
    "allowBorder": true
  },
  "emoji": true
}

Cómo funciona

Un motor, dos modos de uso

Modo libre

Todas las herramientas disponibles

Perfecto para:

  • Blogs
  • Sitios personales
  • Proyectos secundarios

Sin bloqueos innecesarios

Modo gobernado

Herramientas y estilos estrictamente controlados

Alineación con:

  • Identidad corporativa
  • Reglas del producto
  • Tipos de contenido

Ideal para:

  • Empresas
  • Equipos
  • Aplicaciones multiusuario

El mismo editor se adapta a la madurez de tu producto.

Un editor basado en bloques y cuadrícula

Un enfoque estructurado para contenido controlado

A diferencia de los editores clásicos, NGTextEditor funciona con un sistema de bloques posicionados en una cuadrícula de 12 columnas. Este enfoque garantiza un control total sobre el diseño y la estructura del contenido.

Cómo funciona

  1. Clic derecho en el área de edición
  2. Elige el tipo de bloque: texto o multimedia
  3. Define el ancho del bloque (10% a 100%)
  4. Confirma: aparece una cuadrícula visual
  5. Haz clic en la posición deseada en la cuadrícula
  6. Crea tu contenido en el bloque
Bloque de texto

Para escribir texto, crear listas, insertar citas, aplicar estilos...

Bloque multimedia

Para insertar imágenes, videos, tablas o columnas

La cuadrícula de posicionamiento

Al crear o mover un bloque, aparece una cuadrícula visual:

  • Celdas verdes : posiciones disponibles para colocar tu bloque
  • Celdas rojas : posiciones ocupadas por otros bloques
  • Zonas "Insertar una fila aquí" y "Nueva fila" para gestionar filas

Reposicionar o configurar un bloque

Cada bloque tiene un botón de engranaje (⚙) en la parte superior izquierda. Haz clic en él para acceder a las opciones: reposicionar el bloque en la cuadrícula o modificar su configuración (ancho, imagen de fondo, eliminar).

Gestión de bloques
Pasa el cursor sobre un bloque para ver el botón de engranaje (⚙). Un solo botón agrupa todas las opciones: reposicionar, configurar o eliminar. Interfaz limpia para un área de edición despejada.

Ventajas de este enfoque

  • Diseño preciso con la cuadrícula de 12 columnas
  • Elementos uno al lado del otro fácilmente (ej: imagen 50% + texto 50%)
  • Reorganización fácil mediante el botón de configuración
  • Estructura de documento flexible y modular
  • Exportación HTML y PDF fiel a lo editado
  • Posibilidad de anidar bloques dentro de bloques
Consejos
  • Usa "Contornos de bloques" en la barra de herramientas para visualizar límites
  • Los bloques pasan automáticamente a la siguiente fila si no hay espacio suficiente
  • Anida bloques para diseños complejos

Lo que NGTextEditor evita (y es intencional)

Estilos inconsistentes
HTML impredecible
Copiar-pegar sucio
Derivas de diseño
Contenidos imposibles de mantener

Menos libertad innecesaria.

Menos bugs.

Menos soporte.

Lo que realmente ganas

Para desarrolladores

  • Integración simple
  • Comportamiento predecible
  • Menos casos especiales que manejar
  • Contenido utilizable en frontend y API
  • Completamente probado (unitario + funcional): fiable y mantenible

Para equipos de producto / diseño

  • Cumplimiento automático de la marca
  • Coherencia global
  • Sin recordatorios manuales necesarios
  • Detección automática de los colores del sitio para añadirlos a la paleta

Para usuarios finales

  • Interfaz clara
  • Imposible "hacerlo mal"
  • Menos frustración

Casos de uso típicos

CMS o back-office de aplicación
Contenidos de marketing controlados
Páginas de onboarding
FAQs estructuradas
Documentación interna
Contenidos multiusuario

Si tu contenido debe permanecer coherente, estable y mantenible, NGTextEditor es para ti.

Posicionamiento claro

NGTextEditor no es:

  • Un editor "todo en uno"
  • Un clon de un editor existente
  • Un mini Word en un navegador

Es:

Un editor que aplica reglas en lugar de confiar en la disciplina de los usuarios.

Empieza simplemente

Integra NGTextEditor

Úsalo libremente

Añade reglas cuando las necesites

Empezar con NGTextEditor Documentación y configuración

Las buenas herramientas dan poder.

Las mejores herramientas evitan errores.