Issue #2596💬 RespondidoAbierto el 24 de febrero de 2020por cristianumali22Reacciones 2

Añadir html, css y js a Block Manager

Respuesta rápidapor cristianumali221

Hola @pouyamiralayi, así que, hago, 'contenido: '<div></div><style></style>'' ¿separará el HTML del CSS en la función de descarga de código de GrapesJS? Ten en cuenta que en cada bloque de código hay diferentes HTML, CSS y JS. ¿El CSS de, por ejemplo, block1, no afectará al estilo de block2?

Lee la respuesta completa abajo ↓

Pregunta

[PREGUNTA]

¡Hola! Estoy recuperando códigos dinámicos html, css y js de la base de datos. ¿Cómo puedo crear bloques con esto? Actualmente, este es mi código,

    editor. BlockManager.add($aBlock['name'], {
        id: $aBlock['nombre'],
        Etiqueta: $aBlock['Nombre'],
        Categoría: $aBlock['Categoría'],
        Contenido: $aBlock['html'],
        estilo: $aBlock['CSS'],
        Guion: $aBlock['CSS'],
      });

Pero no funciona. Por favor, ayudadme. Gracias.

Respuestas (3)

cristianumali2225 de febrero de 2020

Hola @pouyamiralayi, así que, hago, 'contenido: '<div></div><style></style>'' ¿separará el HTML del CSS en la función de descarga de código de GrapesJS?

Ten en cuenta que en cada bloque de código hay diferentes HTML, CSS y JS. ¿El CSS de, por ejemplo, block_1, no afectará al estilo de block_2?

pouyamiralayi26 de febrero de 2020

@cristianumali22 tu código se ve bien y no se ejecuta antes de la inicialización de grapesjs porque estás pasando la referencia y no la llamas realmente. Te sugiero usar el grapesjs cli porque te hace todo el montaje y te proporciona un entorno limpio y agradable. ¡Salud!

pouyamiralayi24 de febrero de 2020

@cristianumali22 por favor, considera poner tanto tu ''html'' como ''css'' dentro de la propiedad ''content'' de esta manera:

Contenido: '<div></div><style></style>'

Para incluir scripts, debes definir un nuevo tipo de componente y luego proceder a component & js ¡Salud!

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.