Issue #2684💬 RespondidoAbierto el 25 de marzo de 2020por imso077Reacciones 0

Elemento de imagen

Respuesta rápidapor imso077

Hola, hola a todos, ¿habéis solucionado el problema de las imágenes responsivas? (Tenemos que cambiar las imágenes, porque el contenido de la imagen debería cambiar en dispositivos más pequeños, así que el enfoque es menor)

Lee la respuesta completa abajo ↓

Pregunta

Hola, Me gustaría añadir un bloque de "imagen" al editor, donde podamos definir una imagen diferente para cada dispositivo, y el HTML base para eso sería así:

<picture>
        <source data-gjs-type="source" media="(min-width: 650px)" srcset="">
        <source data-gjs-type="source" media="(min-width: 465px)" srcset="">
        <img src="">
      </picture>

Mi problema es que, cuando se inserta en el editor, el componente de img es visible y movible, incluso desde el elemento imagen. Con eso, podría causar problemas de diseño no intencionados y las imágenes podrían acabar en lugares diferentes. Otro problema con esto es que la cantidad de fuentes puede cambiar según el uso, a veces solo se reutiliza 1 fuente (soporte de dispositivo), 3...

¿Cuál sería la mejor manera de superar estos problemas?

Respuestas (2)

imso07730 de marzo de 2020

Hola, hola a todos, ¿habéis solucionado el problema de las imágenes responsivas? (Tenemos que cambiar las imágenes, porque el contenido de la imagen debería cambiar en dispositivos más pequeños, así que el enfoque es menor)

artf2 de abril de 2020

Aprende a crear Components personalizados y luego echa un vistazo a todas las propiedades disponibles en el Component (para que puedas notar, por ejemplo, que la imagen no se puede arrastrar)

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 →

Tutoriales relacionados

Guías detalladas sobre el mismo tema.

Todos los tutoriales →

Explorar categorías de plugins

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