Editor visual de contenido

Edita tu contenido donde vive: en tu sitio web real

El editor visual de b10cks le da a tu equipo de contenido una vista previa en vivo de los cambios mientras los hacen, con enlace bidireccional que convierte tu sitio real en el espacio de edición. Se acabó imaginar cómo se verá un cambio. Míralo al instante.

El problema de editar con formularios

Nadie piensa en campos de formulario.

Todos los demás CMS le piden a tu equipo de contenido que imagine cómo se verán sus cambios. Rellenan un formulario, hacen clic en guardar, van a una URL de vista previa y descubren que el título es demasiado largo, la imagen no se ve bien y el diseño se rompió en móvil. Luego vuelven atrás y lo hacen otra vez.

Ese ciclo es lento. Frustrante. Y completamente innecesario.

b10cks les da a los editores una vista previa en vivo, vinculada en ambos sentidos, de su contenido — dentro del sitio web real renderizado — para que vean cada cambio en el momento en que lo hacen.

Enlace bidireccional

Edita aquí. Míralo allí. Al mismo tiempo.

El editor visual de b10cks funciona mediante una conexión bidireccional entre el panel del editor del CMS y la vista previa en vivo de tu frontend:

Editor → Vista previa Cuando un editor cambia el valor de un campo en el panel del CMS, la vista previa se actualiza en tiempo real, sin recargar la página ni pasar por un paso de publicación. El cambio se ve al instante.

Vista previa → Editor Cuando un editor hace clic directamente en un elemento de la vista previa —un titular, un bloque, un botón— el panel del editor salta directamente a los campos de ese contenido. Sin buscar entre un árbol de tipos de contenido. Haz clic en lo que quieras editar y edítalo.

Así es como se ve la edición visual de verdad.

Arquitectura de vista previa en vivo

Funciona con tu frontend actual. No requiere una compilación especial.

El editor visual no exige que reconstruyas tu frontend con un framework o SDK específicos. Usa una conexión de vista previa ligera que se integra con cualquier frontend:

  • Nuxt — composables de vista previa incluidos en el SDK *
  • Cualquier framework — API de vista previa en bruto con un protocolo documentado

Tu frontend renderiza tu contenido. b10cks envía actualizaciones en vivo. Esa es toda la conexión.

* pronto habrá más SDK nativos para frameworks

El panel de edición

Todas las herramientas que necesita tu equipo de edición. Nada de lo que no.

El panel del editor se desliza junto a tu vista previa y muestra solo los campos de contenido relevantes para lo que esté seleccionado o enfocado en ese momento.

En el panel:

  • Formularios de campos estructurados para cada tipo de bloque
  • Edición de texto enriquecido en línea con una barra de herramientas limpia y configurable
  • Subida de imágenes, selección desde la biblioteca de recursos y vista previa de transformaciones
  • Arrastrar bloques para reordenarlos en campos de tipo array
  • Selector de referencias: encuentra y enlaza cualquier entrada de contenido en el espacio
  • Selector de idioma: previsualiza y edita en cualquier idioma habilitado
  • Indicador de estado borrador/publicado y controles de publicación
  • Panel de hilos de comentarios: ve y participa en conversaciones sobre el contenido actual

Vista previa móvil y adaptable

Ve exactamente lo que ven tus visitantes, en cualquier dispositivo.

Cambia la vista previa entre distintos tamaños de pantalla con un solo clic:

  • Escritorio — vista previa a ancho completo
  • Tableta — vista previa con punto de ruptura adaptable
  • Móvil — vista previa en ventana estrecha

Detecta problemas de diseño antes de que salgan en vivo. Sin teléfono. Sin necesidad de DevTools del navegador.

Biblioteca de bloques

Añade bloques de contenido como si usaras una herramienta de diseño.

El panel de biblioteca de bloques permite a los editores explorar todos los tipos de bloque disponibles y añadirlos a la página actual en un solo paso. No requiere conocimientos técnicos.

  • Tarjetas visuales de tipos de bloque con nombre y descripción
  • Búsqueda y filtros por categoría de bloque
  • Haz clic para añadir al final, o arrastra a cualquier posición del árbol de contenido
  • Vista previa de los campos de un nuevo bloque antes de insertarlo

Los editores pueden construir páginas ricas y estructuradas a partir de bloques, sin pedirle nunca a un desarrollador que "solo añada una sección".

Publicación programada

Configúralo y olvídate.

Planifica con antelación la publicación de tu contenido. Programa cualquier pieza de contenido para que se publique en una fecha y hora específicas: b10cks se encarga de publicar automáticamente.

  • Publicación programada por idioma para equipos globales
  • Despublicación programada para contenido por tiempo limitado
  • Lanzamientos atómicos: agrupa varios cambios de contenido en un solo despliegue programado

Se acabaron los inicios de sesión a medianoche para pulsar "publicar".

Tu equipo de contenido merece un editor que respete su tiempo.

El editor visual está incluido en todos los planes de b10cks: no hace falta subir de plan, no hay ninguna función oculta ni un "contacta con ventas". Pruébalo ahora.