Issue #1296💬 RespondidoAbierto el 18 de julio de 2018por jvillenaReacciones 0

El Editor de Texto Enriquecido Personalizado no funciona

Respuesta rápidapor artf

Para ser sincero, no lo sé, pero quizá esto ocurra porque al hacer clic fuera estás desenfocando de la entrada, de hecho, probablemente deberías añadir esos botones dentro de 'rteToolbar', que tiene este oyente 'on(rteToolbar, 'mousedown', e => e.stopPropagation());' y así evita el desenfoque

Lee la respuesta completa abajo ↓

Pregunta

Hola @artf, acabo de crear un plugin personalizado del RTE usando diferentes librerías como CKEditor 5, TinyMCE 4 o Pell, pero todas con el mismo resultado: el editor pierde el enfoque y los botones no se aplican al contenido de texto.

! captura de pantalla 2018-07-18 a las 17 06 53

Así que en la imagen de arriba, si pulso el botón Negrita, el efecto no se aplica al contenido.

enable: function(el, rte){

Si ya existe, solo concéntrate
            If (RTE) {
                this.focus(EL, RTE); implementado posteriormente
                return rte;
            }

sea rteToolbar = editor. RichTextEditor.getToolbarEl();
            [].forEach.call(rteToolbar.children, (hijo) => {
                hijo.estilo.mostrar = 'ninguno';
            });

el.contentEditable = true;

// Init Pell
            rte = window.pell.init({
                Elemento: El,
                onChange: función (html) {
                    console.log(html);
                }
            });

el.focus();
            rte.focus();

return rte;
        },

Creo que todo mi problema está en la función de activar, pero no sé por qué ocurre este comportamiento. ¿Tienes alguna idea?

Si lo arreglo, será muy sencillo incluir los 3 plugins diferentes.

Respuestas (3)

artf20 de julio de 2018

Para ser sincero, no lo sé, pero quizá esto ocurra porque al hacer clic fuera estás desenfocando de la entrada, de hecho, probablemente deberías añadir esos botones dentro de 'rteToolbar', que tiene este oyente 'on(rteToolbar, 'mousedown', e => e.stopPropagation());' y así evita el desenfoque

jmtt8918 de febrero de 2019

¿Cómo solucionas esto? No encuentro ningún ejemplo funcional con Pell, CKEditor 5 o TinyMCE :/

lock[bot]18 de febrero de 2020

Este hilo se ha bloqueado automáticamente porque no ha habido actividad reciente desde que se cerró. Por favor, abre un nuevo problema para bugs relacionados.

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 →

Explorar categorías de plugins

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