He creado un tipo personalizado y un bloque '''js DomComponents.addType('MyComponent', { ... }); BlockManager.add('Component', { content: { type: 'MyComponent' } }); ``` ¿es posible insertarlo en 'DomComponents' por nombre o por cualquier otro medio? No quiero tener que arrastrar y soltar el bloque manualmente cada ve...
z-vr
Ah, descubrí cómo hacerlo — a través de 'editor.addComponents({ type: 'MyComponent' })'. ¿Hay alguna forma de insertarlo en un elemento específico mediante un selector CSS? He encontrado este fragmento, pero ¿cómo podría encontrar el índic...
z-vr
Vale, lo que he hecho es '''js función de exportación por defecto iterateChildren(components, fn) { components.each((model) => { fn(modelo); const childComps = model.get('components'); iterateChildren(childComps, fn); }); } función export...
artf
De hecho, puedes obtener el modelo desde la instancia de cash element con 'view.$el.data('model')', así que podrías hacerlo funcionar con menos código '''js wrapper.view.$el.find('#hero .text').each((el, i, $el) => console.log($el.data('mo...
Hola @artf, muy buen framework para creadores de páginas web y mantenlo así :+1: Código : '''javascript ... blockManager.add('dynamic-nav', { etiqueta: 'Navegación Dinámica', atributos: { Clase: 'fa fa-ellipsis-h', título: 'Insertar menú dinámico de navegación' }, categoría: 'Sección', contenido: '<ul class="hide-on-m...
artf
Puedes actualizar el contenido del bloque de esta manera '''js const dblock = blockManager.get('dynamic-nav'); dblock.set('content', '<ul>...'); ```
bungambohlah
Ah, ya veo, muchas gracias @artf
bungambohlah
Hola, @artf tengo un problema, el bloque de mi dynamic-nav funciona ahora, pero cuando doy algún script a ese componente me da un error de '''Identificador inesperado'''. ¿Puedo corregir? Si no es así, por favor corrígeme, muchas gracias E...
Hola, Estamos evaluando GrapesJS para uno de los requisitos. Como parte de la evaluación, estoy creando el comando personalizado 'insertar marcador de posición'; lo que hace es (lo que planeo hacer) es que al seleccionar Texto y al hacer clic en este comando, debería insertar texto en la posición seleccionada del curs...
mathieuk
Duplicado con el #481
sarathksasi
Gracias
edwardjiawei
Similar a lo que hice en grapesjs-plugin-customrte. Pero no propongo que mi código se base en él, pero es un desastre. Deberías poder probar el código en Design y HTML en mi repositorio. También se puede establecer prioridad menor para imp...
¿Es posible reemplazar al gestor de activos por algo completamente diferente (como CKFinder - https://ckeditor.com/ckeditor-4/ckfinder/)? Alternativamente, ¿sería posible lanzar el gestor de activos incluido fuera del contexto de grapesjs?
artf
Bueno, nunca lo he probado antes, pero creo que puedes conseguirlo simplemente reemplazando el comando actual '''js editor. Commands.add('open-assets', { run(editor) { ... } }) ``` Así es como se llama el comando https://github.com/artf/gr...
ryandeba
¡Gracias @artf! He conseguido que esto funcione muy rápido gracias a tu sugerencia.
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.
Tengo un caso de uso en el que me gustaría bloquear completamente algunos componentes específicos (es decir, no redimensionables, no arrastrables, copiables, removibles, etc.). Lo tengo funcionando en su mayoría, pero tengo un problema con las imágenes: no consigo evitar la función de doble clic que abre el modal del...
artf
Sí, tienes razón, yo uso 'editable' solo para componentes de texto, pero lo que preguntas en realidad tiene sentido. Aceptaría encantado tu residencia permanente. Deberías añadir 'editable: true' al modelo https://github.com/artf/grapesjs/...
ryandeba
¡Gracias @artf! Aquí está la solicitud de tirada: https://github.com/artf/grapesjs/pull/496
Estoy acostumbrado al editor de html y css que menciono en el #324. Después de editar el html y el css, genera un CSS donde sospecho que causado por editor.setComponents() No estoy seguro de que esto sea un error o un comportamiento normal. Versión de Grapesjs - 0.12.8 Grapesjs preset - GJS-Preset-Newsletter 0.2.15
thecodefish
En mi caso de uso, constantemente obtengo y configuro el html/css dentro del editor, y lo que he visto es que acaba duplicando los estilos 'por defecto' (ver los estilos * y cuerpo en la imagen de arriba: aparecen dos veces). Conseguí solu...
thecodefish
@chiqui3d creo que siempre que necesites modificar el CSS desde alguna fuente externa, probablemente querrás restablecer primero el CSS Composer. Así que si tienes algo como 'editor.setStyle(css);' en tu código, puede que necesites llamar...
artf
Primero que nada, actualiza tu versión de grapesjs y luego sé más específico con tus cambios. ¿Qué has cambiado? ¿A qué te refieres con CSS no deseado?
A continuación hay código que utilicé para rasgos y sección personalizada, pero tras añadir componente mediante bloque, no puedo editar texto o la actualización de rasgos no actualiza el canvas. He extendido el 'texto'. Además, no recibo html cuando uso editor.html(). Además, cuando hago clic en la imagen no se abre e...
artf
En tu modelo, no necesitas definir 'data-gjs-*', solo tiene sentido para importar desde HTML, así que elimina esto: '''js atributos: { 'data-gjs-type': 'cust-section', }, No puedes editar esto '''js var rowDiv = document.createElement('sec...
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.
Hola, ¿Hay alguna opción para traducir el sistema? Saludos, Yair
artf
Lo he comentado varias veces (por ejemplo, el #26) La próxima vez, intenta buscar antes de abrir un nuevo número (por ejemplo, 'traducción' ya era suficiente) ¡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.
Mi intención es crear un bloque que permita que solo se dejen caer componentes de imagen (estoy usando el predeterminado de uvapes-blocks-basic) dentro de él. Tengo el siguiente código de prueba: Sin embargo, cuando ejecuto el código anterior, lo que ocurre es que no puedo dejar caer un componente de imagen dentro del...
roytang
Esta solución funciona. ¡Gracias!
artf
@roytang tu código parece estar bien, probablemente el problema sea porque tu componente está "demasiado vacío" y el puntero del ratón no puede entrar. Intenta añadir un poco de relleno y mira si funciona '''js Contenido: '<div class="imag...
roytang
Mmm. Tengo un formato de contenedor de imagen con ancho y altura de 100px. Además, eliminar la propiedad de dropping en el modelo extendido me permite insertar texto e imágenes dentro de él.
Estoy en proceso de crear un componente personalizado para la plantilla de abajo y queremos que el usuario introduzca texto, enlace, pase el cursor y seleccione imagen; queremos usar el gestor de activos predeterminado para seleccionar imagen, pero no sabemos cómo conseguir que la imagen seleccionada sea en un compone...
artf
@krunal039 ¿Por qué necesitas un componente personalizado? Tu plantilla parece bastante sencilla, ¿qué tal solo un bloque sencillo? '''js editor. BlockManager.add('your-block', { etiqueta: 'Custom Block', contenido: '<div class="row-class"...
krunal039
@artf gracias por responder, necesitamos la entrada del usuario para el paso del cursor, la imagen de fondo y el texto y el hipervínculo al final, y pensamos en usar un componente personalizado, pero si podemos pedirle al usuario que lo in...
artf
Intenta crear un bloque con tu plantilla, arrástralo dentro del lienzo y podrás cambiar todo eso