He reproducido esto en la demo de la web, así que sé que no es por mi programación. Si pones un límite mínimo de altura y ancho a un bloque de texto y luego eliminas todo el texto para que quede vacío, cuando vuelves a entrar el texto se duplica.
ryandeba
Hola @markbailey, Pude recrear ese problema y envié una solicitud pull para solucionarlo. El contenido duplicado solo parece estar en el dom, no en las propiedades del componente, y forzar que la vista se renderice tras editar parece soluc...
markbailey
Hola @ryandeba, gracias por esa información y la solución alternativa. Espero que tus cambios se fusionen.
lock[bot]
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.
He notado que en la demo actual solo es posible redimensionar la mayoría de los bloques usando el editor de propiedades, no arrastrando anclajes en el bloque (que es posible, por ejemplo, con el elemento de mapa). ¿Es esto intencionado o simplemente es una función que aún no se ha implementado?
ryandeba
Hola @matthewgertner, Creo que esto se puede activar en componentes individuales mediante la propiedad "redimensionable": 'component.set("resizeable", true)'. Probablemente no funcione muy bien en elementos que tengan un estilo 'display: i...
artf
@matthewgertner la solución de Ryan debería funcionar y, sí, no los aplico por diseño por razones que ya explicó Ryan, pero de hecho puedes crear bloques/componentes con Resizeable activado
matthewgertner
@ryandeba @artf Genial, gracias por la sugerencia. Ahora estamos experimentando con la base de código, así que lo probaremos.
¿Sería posible crear un bloque que permitiera al usuario escribir en HTML responsivo, ya sea directamente en la plantilla o en un lateral en el gestor de estilo/maquetación?
ryandeba
Hola @NorthstarTech, Acabo de crear un plugin (muy temprano, podría necesitar más trabajos) que puede que te resulte útil: https://github.com/ryandeba/grapesjs-html-block. Deberías poder incluir ese archivo en tu proyecto e incluir el plug...
ryandeba
@chiqui3d Cambia la función 'isComponent' a esta para evitar que el html interno inicial sea analizado por grapesjs en componentes: El otro código que publiqué debería impedir que grapesjs analice el html después de editar a través del mod...
ryandeba
Creo que este asunto ya está resuelto y podría cerrarse basándose en el primer comentario aquí: https://github.com/ryandeba/grapesjs-html-block/issues/1. @NorthstarTech podrías confirmar o responder con más detalles si quieres mantener est...
Cómo añadir características de vídeo de tipo HTML personalizado para que el usuario pueda introducir el código iframe y que se incruste en el html.
artf
Diría que es un tipo totalmente diferente de Componente.
Deepak813
¿Tenemos este componente en la siguiente versión en los rasgos tipo vídeo?
lock[bot]
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.
¿Es posible, y si es así, cómo hacerlo, usar un elemento html personalizado, por ejemplo, <body> <my-custom-tag/> </body> ¿Cuál renderizará HTML específico para la ventana de previsualización, pero la fuente mostrará la etiqueta personalizada? Gracias, Paul
artf
Sí, puedes usar diferentes nombres de etiquetas en tu componente personalizado '''js const dc = editor. DomComponents; const defaultType = dc.getType('default'); dc.addType('my-custom-type', { model: defaultType.model.extend({ etiquetaNomb...
paulroberttaylor-zz
Gracias @artf, eso me orienta en la dirección correcta. Si quiero que todo lo que necesite ser editable en el bloque aparezca en el código de etiquetas personalizadas, ¿cómo lo conseguiría?
Hola, Tengo una idea para una app que creo que a la gente de mi campo les resultaría útil. Básicamente, hay un framework que usamos para el desarrollo de aplicaciones, pero no existe un constructor de interfaz para él. Tiene una carpeta bastante grande de assets css/icons/svg/fonts. Lo que me gustaría es poder crear u...
artf
Hola Paul, puedes inyectar estilos externos de esta manera '''js const editor = grapesjs.init({ ... lienzo: { Estilos: ['... file1.css', '... file2.css', '...'] } }); ```
paulroberttaylor-zz
¡Fantástico! ¡Gracias @artf
suraj740
Hola @paulroberttaylor, ¿cómo has incluido las fuentes dentro de los estilos? Yo también hago lo mismo, pero no pasa nada const editor = grapesjs.init({ ... lienzo: { Estilos: ['<link href="https://fonts.googleapis.com/css?family=Roboto" r...
Hola, Hay un nuevo problema con GrapesJS (quizá). He creado un nuevo componente usando 'bm.add()' en el que he usado un elemento de tabla con <thead>etiquetas '' y '<tbody>'. Pero al obtener html usando el método 'editor.getHtml()', se <thead>omiten las etiquetas '' y '<tbody>'. ¿Podrías ayudarme, por favor? ! captura...
artf
@fsaiyedOB sí, he hecho el componente de tabla así porque en ese momento de escribir el clasificador actuaba de forma diferente y era un caos ordenar filas con elementos tipo 'tbody' alrededor. Actualmente, tratar con tablas no es mi prior...
ryandeba
¡Gracias! Intentaré empezar con esto en los próximos días.
ryandeba
Hola @artf - probablemente pueda echarle un vistazo a esto en algún momento. He empezado simplemente eliminando la sección "Limpiar filas de tabla de filas que no son filas" en el componente de tabla (líneas 54-68). ¿Puedes indicarme qué p...
Intentando crear un componente personalizado, consulta demo aquí y código aquí Arrastra dos 'botones' y luego saca dos 'botón + enlace' Los dos botones tienen el ancho adecuado, pero el componente personalizado es una especie de ancho completo y altura fija rara ¿Por qué? ! imagen
artf
la propiedad predeterminada 'tagName' es un 'div', cámbiala en tu modelo '''js ... defaults: Object.assign({}, defaultModel.prototype.defaults, { etiquetaNombre: 'span', //<--- Droppable: falso, ... ```
Geczy
Ahora tiene sentido, gracias
lock[bot]
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.
@artf ¿podrías dar un ejemplo completo de un gráfico usando chart.js con rasgos para cambiar el color, los valores y los puntos de datos? Sería genial si pudiera recibir ayuda.
Geczy
Puedes usar la demo sandbox aquí https://github.com/artf/grapesjs/issues/559 Te permite modificar rasgos y actualiza al dominante. Eso debería ayudarte a empezar
suchithmahadi
@artf Por favor, ayúdame.
artf
@suchithmahadi para este tipo de preguntas, recomendaría hacerlas en https://stackoverflow.com
Veo que se añaden clases en Canvas, pero cuando obtengo html a través de editor.gethtml(), algunas clases no están incluidas y son solo divs sin clases. Captura adjunta con HTML en Canvas y HTML a través de editor.gethtml() ! captura
Geczy
No creas que volverán las clases con prefijo 'gjs-'
arthuralmeidap
Cuando usas el 'editor.getHtml', solo devuelve el html . Si necesitas el CSS también, puedes usar el 'editor.getCss()'.
Geczy
Uso newsletter-plugin y 'const html = window.grapesjs.editors[0].runCommand('gjs-get-inlined-html')'