Issue #2962💬 RespondidoAbierto el 19 de agosto de 2020por SintoDemaReacciones 1

ERROR:

Respuesta rápidapor SintoDema1

Hola @mcottret, Ha sido una respuesta muy útil. Solucionó todos los problemas relacionados con el formato en línea. Gracias.

Lee la respuesta completa abajo ↓

Pregunta

Hola @artf,

Versión: grapesjs - 0.16.18 CKEDITOR - Estándar - 4.14.1

¿Puedes reproducir el error de la demo?

¿Cuál es el comportamiento esperado? Al aplicar las opciones de formato en línea de las opciones de CKeditor en línea, debería reflejarse en el texto seleccionado.

Describe el error detallado He integrado el CKeditor en el editor grapesJS para fines de edición en línea. Actualmente, cuando selecciono texto para formatearla, las opciones del editor CKeditor en línea se muestran junto con otras opciones en una barra de herramientas negra. Estoy confundido con eso. Y el problema principal es que incluso si uso cualquiera de las opciones de formato en línea, el formato no se refleja en el texto seleccionado. No se puede hacer nada desde la opción en línea de CKeditor como formatear texto, listas, subidas de imágenes, enlaces, etc.

¿Cuál es el comportamiento actual? El principal problema es que, incluso si uso cualquiera de las opciones en línea, el formato no se refleja en el texto seleccionado. No se puede hacer nada desde la opción en línea de CKeditor como formatear texto, listas, subidas de imágenes, enlaces, etc.

Plugins usados grapesjs-lory-slider, grapesjs-tabs, grapesjs-custom-code, grapesjs-touch, grapesjs-parser-postcss, grapesjs-tooltip, grapesjs-tui-image-editor, grapesjs-typed, grapesjs-style-bg, gjs-preset-webpage, grapesjs-plugin-forms, gjs-component-countdown, gjs-plugin-ckeditor.

¿Puedes adjuntar capturas de pantalla, screencasts o una demo en directo? Sí, aquí tienes un enlace de la demo y una captura de pantalla de la demo, otra de mi trabajo

Respuestas (3)

SintoDema28 de agosto de 2020

Hola @mcottret,

Ha sido una respuesta muy útil. Solucionó todos los problemas relacionados con el formato en línea.

Gracias.

mcottret27 de agosto de 2020

¡Hola @SintoDema!

El plugin GrapesJS CKEditor ya registra CKEditor como un RTE personalizado, así que llamar a 'editor.setCustomRte' en realidad es configurarlo dos veces, lo que creo que causa esos problemas.

Elimina el bloque 'editor.setCustomRte' y debería funcionar como se espera. Si quieres ofrecer opciones de CKEditor, esto debe hacerse a nivel de 'pluginsOpts' como se muestra aquí.

¡Salud!

SintoDema28 de agosto de 2020

Hola @mcottret,

Ya lo he intentado antes y, siguiendo tu sugerencia de nuevo, he eliminado esa sección de mi solicitud. Ahora, no hay una pestaña de opciones de formato. No he puesto ninguna restricción ('''pluginsOpts''') en la opción de CKEditor, solo cargué los archivos CDN y el nombre de su plugin en GrapesJS en la sección. Además, tras eliminar el bloque ''editor.setCustomRte''', me aparece otro error como:

ckeditor.js:270 Error no detectado: [CKEDITOR.resourceManager.load] El nombre del recurso "sharedspace" no se encontró en "https://cdn.ckeditor.com/4.14.1/standard/plugins/sharedspace/plugin.js?t=K5H9".
    en CKEDITOR.resourceManager. <anonymous> (ckeditor.js:270)
    at E (ckeditor.js:265)
    en Array.x (ckeditor.js:265)
    a la W (ckeditor.js:265)
    en HTMLScriptElement.CKEDITOR.env.ie.e.$.onerror (ckeditor.js:266)

¿Puedes reproducir el error de la demo (después de eliminar el bloque ''editor.setCustomRte''', puedes intentarlo)?

Aquí tienes una captura de pantalla de la demo

Después de probar diferentes códigos, he podido obtener opciones básicas de formato ¿puedes mirar la demo y ayudarme. Necesito más opciones de formato como lista (lista ordenada y lista no ordenada - esta es obligatoria), subidas de imágenes, enlaces, etc.

En el fiddle, puedes ver que acabo de cargar los archivos CDN. No he usado el CKEditor en la sección de plugins de GrapesJS mientras lo usaba, me está saliendo el error que se mencionó antes. Además, ahí también se ofrecen opciones de barra de herramientas, que no funcionan. Captura de pantalla con pocas opciones

He revisado la aplicación Grapedrop, hay más opciones como las que necesito. Captura de pantalla de esa aplicación en la que se implementa GrapesJS

¿Podrías ayudarme creando un fiddle funcional con más opciones de formato?

Gracias.

Preguntas y respuestas relacionadas

Continúa investigando con debates sobre temas similares.

Plugins de pago que cumplen con este problema

Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.

Ver todos los plugins

Cargando recomendaciones de plugins de pago...

Opción gratuita

Consulta los plugins de código abierto de GrapesJS en GitHub O haz una búsqueda rápida en nuestro catálogo gratuito.

Explora plugins gratuitos →
Opción premium

Los plugins premium incluyen soporte, actualizaciones regulares y funciones listas para producción — ahorrando días de trabajo de integración.

Explora plugins premium →

Tutoriales relacionados

Guías detalladas sobre el mismo tema.

Todos los tutoriales →

Explorar categorías de plugins

Ve directamente a las páginas de categorías de plugins en el marketplace.