Issue #391✓ ResueltoAbierto el 7 de octubre de 2017por tomichalReacciones 7

¿CSS en espacio de nombres?

Respuesta rápidapor danfitz363

¿Crees que podrías simplemente prefijar todos los nombres de clase generados por Grapejs? Si en vez de .row usas .grape-row o lo que sea (probablemente haría que el prefijo sea una variable), obtendrás principalmente el efecto que @tomichal buscas.

Lee la respuesta completa abajo ↓

Pregunta

Hola, ¿Hay alguna forma de configurar el editor grapesjs de modo que el CSS generado para el contenido HTML esté espaciado en nombres? En otras palabras, ¿cómo evitar que las reglas de estilo definidas para el contenido creado/editado en el editor se filtren al resto de la página web? En el caso de mi sitio web, el usuario puede editar gran parte de la página, pero no toda: el resto del contenido HTML y CSS de la página es generado dinámicamente por el servidor (esto es un sitio Rails + Angular). He comprobado que si, por ejemplo, uso una fila con columnas, el CSS generado por el editor grape...

Respuestas (3)

👍 Muy útildanfitz3610 de octubre de 2017

¿Crees que podrías simplemente prefijar todos los nombres de clase generados por Grapejs? Si en vez de .row usas .grape-row o lo que sea (probablemente haría que el prefijo sea una variable), obtendrás principalmente el efecto que @tomichal buscas.

artf24 de mayo de 2018

De hecho, puedes añadir un oyente en los nuevos selectores y añadir un prefijo ahí '''js prefijo const = 'miprefijo-'; editor.on('selector:add', selector => { nombre de const = selector.get('nombre'); si (selector.get('type') === editor. SelectorManager.Selector.TYPE_CLASS & name.indexOf(prefijo) !...

devmohitagarwal4 de noviembre de 2019

HOLA, La gente que busca sandbox, prefijo el CSS exportado puede intentarlo, nosotros tuvimos el mismo caso de uso y optamos por el enfoque sass. Para ello, utilicé sass.js (https://github.com/medialize/sass.js/) Pasos:encierra la cadena css con tu clase personalizada, por ejemplo, MiClase Personal...

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.