Un gestor de contenidos inicia sesión en el panel de administración, busca una página entre otras 50, abre el editor, corrige un encabezado, guarda, vuelve al sitio y refresca la pestaña. Seis clics para una sola edición. Para Grav CMS existe una solución sencilla: el plugin Editable with ContentTools integra un editor WYSIWYG directamente en la página del sitio. Usted abre la página, hace clic en «editar», corrige el texto y lo guarda de vuelta en un archivo Markdown sin entrar al panel de administración.

El plugin no se actualiza desde 2022 (el autor suspendió oficialmente el soporte), pero funciona de forma estable en Grav 1.7 y cubre el escenario básico de editar páginas Markdown simples sin lógica dinámica. La instalación toma cinco minutos y, después de eso, editar texto en el frontend se vuelve mucho más sencillo.

A continuación encontrará una guía completa, desde la instalación hasta los derechos de acceso, con un desglose de las limitaciones y una alternativa (Fred).

💡 Resumen rápido:

• Instale el plugin mediante GPM o un archivo zip y copie la configuración.
• Configure git-sync para enviar los cambios a un repositorio (opcional).
• Marque las áreas editables con el shortcode editable usando nombres únicos.
• Otorgue permisos site.editable a los usuarios del frontend.
• Unifique las sesiones del admin y del frontend mediante session.split: false.
• Tenga presente la limitación: solo Markdown plano, sin Twig ni contenido dinámico.

Instalación: mediante GPM o manualmente

El plugin se instala a través de Grav Package Manager, el método estándar para cualquier complemento en Grav:

1
bin/gpm install editable-contenttools

Ejecute el comando desde la carpeta raíz del sitio (donde se encuentra bin/). GPM descargará la última versión y la extraerá en /user/plugins/editable-contenttools.

Como alternativa, puede instalarlo manualmente: descargue el archivo zip desde GitHub, extráigalo en /user/plugins/ y renombre la carpeta como editable-contenttools (sin el sufijo -master). La estructura debería quedar así: /user/plugins/editable-contenttools/editable-contenttools.php.

Copie la configuración a una ubicación segura

Después de la instalación, asegúrese de copiar el archivo de configuración al directorio del usuario:

1
cp user/plugins/editable-contenttools/editable-contenttools.yaml user/config/plugins/editable-contenttools.yaml

Este paso es importante: si la configuración permanece en la carpeta del plugin, se restablecerá al actualizar mediante GPM. Un enfoque alternativo es instalar a través del panel de administración de Grav (Plugins → Añadir), en cuyo caso el sistema crea automáticamente la configuración en user/config/plugins/ y no es necesario copiarla manualmente.

Configuración: tres opciones de configuración

El archivo editable-contenttools.yaml contiene tres parámetros:

1
enabled: true
2
git-sync: false
3
git-sync-mode: foreground

enabled activa el plugin. Sin enabled: true el editor no aparecerá en el frontend, incluso si se conceden los permisos. El valor predeterminado es true.

git-sync activa la sincronización con un repositorio Git después de cada guardado. Solo funciona cuando el plugin Git Sync está instalado. Si su sitio vive en Git y quiere registrar cada cambio en el historial, establézcalo en true. De lo contrario, déjelo en false.

git-sync-mode determina si se debe esperar a que la sincronización termine antes de devolver el control al usuario. foreground significa que el botón «Guardar» se desbloquea solo después de que finalicen el commit y el push. background funciona de forma asíncrona, pero algunos servidores Linux pueden tener problemas con los procesos en segundo plano. Para la mayoría de los escenarios, foreground es suficiente.

Marcado de áreas editables: el shortcode [editable]

El plugin no hace que toda la página sea editable automáticamente. Usted define qué bloques se pueden editar usando el shortcode [editable]:

1
[editable]
2
## Section heading
3
 
4
Text that can be edited from the frontend.
5
[/editable]

Una página puede contener cualquier cantidad de estas áreas. Cada área debe tener un nombre único; de lo contrario, ContentTools no sabrá dónde guardar los cambios.

El parámetro name: unicidad obligatoria

Por defecto, el plugin asigna nombres automáticamente (region-0, region-1, etc.), pero es mejor especificar nombres significativos manualmente:

1
[editable name="hero-block"]
2
## Main heading
3
 
4
Text that can be edited.
5
[/editable]

En la primera grabación desde el frontend, el plugin añadirá automáticamente un parámetro name al shortcode si faltaba. En la práctica, es más fácil especificar los nombres directamente durante el maquetado, ya que esto simplifica la depuración (puede ver qué bloque está editando en las herramientas de desarrollo del navegador).

Después de maquetar y guardar la página, visite el sitio como un usuario con el permiso site.editable, haga clic en el icono del lápiz a la izquierda y edite el texto como lo haría en un editor de texto estándar. Mantenga pulsada la tecla Mayús durante unos tres segundos para resaltar todas las regiones editables.

Puede probarlo en el sitio de demostración del plugin (la grabación está deshabilitada, Grav 1.7.46).

Derechos de acceso: frontend y backend

Para que un usuario vea el icono del lápiz, necesita permisos de edición. Las reglas difieren para los usuarios del frontend (gestores de contenido) y los usuarios del backend (administradores).

Usuarios del frontend

Un usuario debe poder iniciar sesión a través del plugin Grav Login o Private Grav. Luego, añada lo siguiente al archivo de cuenta (user/accounts/username.yaml):

1
access:
2
  site:
3
    login: 'true'
4
    editable: 'true'

Sin el permiso site.editable, el icono del lápiz no aparecerá, incluso si el usuario ha iniciado sesión y tiene otros derechos.

Usuarios del backend (administradores)

Por defecto, Grav separa las sesiones del admin y del frontend. Para permitir que un administrador edite páginas directamente en el sitio (sin entrar en el panel de administración), establezca lo siguiente en system.yaml (o a través del panel de administración en Configuración → Sistema):

1
session:
2
  split: false

Esto fusiona las sesiones: iniciar sesión en el panel de administración concederá automáticamente acceso al editor del frontend. El administrador también necesitará el permiso admin.super o admin.pages en su archivo de cuenta.

Si el icono no aparece después de iniciar sesión, revise la configuración de caché del admin:

1
admin:
2
  super: 'true'
3
  login: 'true'
4
  cache: 'false'

El parámetro cache: false deshabilita la caché para el admin y puede resolver el problema del icono invisible.

Limitaciones: lo que el plugin no puede hacer

El plugin funciona exclusivamente con Markdown plano. Esta es una limitación arquitectónica, no un error: ContentTools edita HTML en el navegador y el plugin convierte HTML de vuelta a Markdown. En el proceso, cualquier marcado dinámico se corromperá. No edite contenido a través de ContentTools si:

• está ensamblado por plantillas Twig (por ejemplo, páginas modulares: los bloques hijos son insertados por el padre dinámicamente y el plugin no puede ver su fuente);
• es inyectado por otros plugins (Page Inject y plugins similares insertan contenido de otras páginas, lo cual es un proceso unidireccional);
• cambia mediante JavaScript en el navegador (sliders, acordeones y otros elementos interactivos se convertirán a HTML estático);
• contiene etiquetas especiales de Grav Markdown (las imágenes con parámetros ?lightbox y ?resize se dañarán durante la conversión de HTML a Markdown, ya que los parámetros de procesamiento desaparecerán).

Las reglas de seguridad son simples:

• Mantenga las imágenes y los shortcodes complejos fuera de las áreas editables.
• Mantenga las áreas pequeñas: el número es ilimitado y 10 bloques pequeños son mejores que un bloque grande con riesgos.
• Pruebe en una copia de la entrada o en un entorno de pruebas antes de dar acceso a los editores.
• Si nota diferencias en el formato Markdown entre la versión con el icono del lápiz y la versión sin él, mueva ese fragmento fuera de [editable].

Alternativa: el plugin Fred

Si la funcionalidad de Editable with ContentTools no le resulta suficiente, eche un vistazo a Fred, un editor frontal más reciente para Grav que también se basa en ContentTools. Diferencias clave:

• Carga de imágenes mediante un diálogo (con rotación y procesamiento básico).
• Envoltorio automático del contenido a través del evento onPageProcessed, lo que requiere menos marcado manual de shortcodes.
• Desarrollo activo: el autor acepta incidencias en GitHub y continúa añadiendo funciones.

Instalación mediante clonación del repositorio en /user/plugins/fred:

1
cd user/plugins
2
git clone https://github.com/BugHunter2k/grav-plugin-fred.git fred

Los permisos se configuran de forma similar: site.editor: true en el archivo de cuenta del usuario (atención: site.editor, no site.editable).

Tanto Editable with ContentTools como Fred resuelven el mismo problema: ofrecen a los gestores de contenido una herramienta para ediciones rápidas sin entrar al panel de administración. El primero es adecuado si necesita una herramienta sencilla y probada para páginas Markdown sin experimentos. El segundo funciona si desea más automatización y está preparado para las posibles asperezas de un desarrollo activo.

Vídeo: cómo funciona ContentTools

Una demostración de dos minutos sobre la edición de una página de Grav en el navegador: el autor muestra cómo se resaltan las áreas editables, se realizan cambios y se guarda el contenido de vuelta a Markdown. Una buena forma de ver el plugin en acción antes de instalarlo.

⁉️🤔 Preguntas frecuentes

¿Por qué no aparece el icono del lápiz tras la instalación?

Compruebe cuatro cosas. Primero, enabled: true en la configuración del plugin (user/config/plugins/editable-contenttools.yaml). Segundo, el usuario debe tener el permiso site.editable en su archivo de cuenta. Tercero, para usuarios del backend, session.split debe ser false en system.yaml. Cuarto, limpie la caché de Grav: bin/grav clear-cache. Normalmente el problema está en los permisos o en las sesiones divididas.

¿Puedo editar páginas modulares?

No. Las páginas modulares se ensamblan a partir de páginas hijas mediante plantillas Twig, lo cual es un proceso unidireccional: el plugin no puede «desensamblar» el resultado de vuelta en partes. En el frontend usted ve el HTML terminado, pero la fuente (los archivos Markdown separados de los módulos hijos) se encuentra en otras carpetas y el plugin no sabe dónde guardar los cambios. Para páginas modulares utilice la interfaz estándar de administración de Grav.

¿Qué ocurre si dejo una imagen dentro de [editable]?

Las etiquetas especiales de Grav Markdown para imágenes (con parámetros ?lightbox, ?resize, ?cropResize) se dañarán durante la conversión de HTML a Markdown. La imagen en sí permanecerá en su lugar (la etiqueta <img> se convierte a Markdown normal ![](url)), pero los parámetros de procesamiento desaparecerán. Conclusión: mantenga siempre las imágenes con parámetros fuera del área editable. Si una imagen es simple (sin parámetros), técnicamente puede dejarla dentro, pero en la práctica es más seguro mover todos los medios fuera de [editable].

El plugin está abandonado por el autor. ¿Es seguro usarlo?

El autor anunció oficialmente el fin del soporte en 2022, y el último commit data de agosto de 2024 (una actualización de compatibilidad para Grav 1.7). El plugin es estable en Grav 1.7 y no afecta a componentes críticos de seguridad: solo trabaja con contenido Markdown y no tiene acceso a operaciones del servidor. Si planea migrar a Grav 2.0, considere echar un vistazo a Fred o esperar una solución oficial de edición frontal (se están discutiendo en el foro nuevos enfoques basados en TinyMCE y Prosemirror).

¿Cuál es la diferencia entre Editable with SimpleMDE y la versión con ContentTools?

Editable with SimpleMDE utiliza el mismo enfoque (edición frontal), pero en lugar de un editor visual proporciona el editor Markdown SimpleMDE con vista previa en vivo. Se adapta a quienes prefieren escribir el marcado a mano y desean ver el resultado a la derecha del editor en lugar de en modo WYSIWYG. Ambos plugins son del mismo autor (bleutzinn) y ambos han sido abandonados desde 2022.

¿Merece la pena instalar un editor frontal para Grav en 2026?

Si su sitio funciona con Grav 1.7, consta de páginas Markdown simples y los gestores de contenido están cansados de entrar al panel de administración para un par de ediciones, instale Editable with ContentTools. Cinco minutos para la instalación, configuración mínima y la edición se convierte en una operación de un solo clic. Abra la página, pulse el lápiz, corrija el texto, guarde. Sin buscar en listas de páginas, sin cambiar de pestaña.

Para proyectos nuevos o cuando planee una transición a Grav 2.0 (se espera un lanzamiento en 2026, aunque no hay una fecha exacta), considere Fred: tiene un desarrollo más activo y es más probable que reciba compatibilidad con la segunda versión del CMS. En cualquier caso, la edición frontal ahorra decenas de clics y minutos de tiempo en cada edición, lo que se nota especialmente en sitios con actualizaciones de contenido frecuentes. Pruébelo en un entorno de pruebas y decida cuánto acelera este enfoque su flujo de trabajo.