Correcto
Imagen
Añada una imagen independiente con controles flexibles de tamaño, recorte, pie de foto, superposición y diseño móvil.
Utilice este bloque para añadir una imagen independiente con controles de visualización flexibles. Puede ajustar su forma, ancho, comportamiento de recorte, pie de foto, tratamiento de superposición, alineación y comportamiento del enlace para adaptarlo al diseño circundante. Para una visión general más amplia de cómo encaja esto en el contenido del tema, consulte la documentación de Shopify sobre secciones y bloques
Ajustes de imagen
Sección titulada «Ajustes de imagen»Este grupo controla la imagen en sí y cómo se muestra. Para obtener orientación más amplia sobre los controles relacionados con las imágenes, consulte la referencia de ajustes de imagen.
Elija primero la imagen y después refine cómo se muestra. El estilo de la imagen cambia la forma visual, mientras que el ancho máximo de la imagen le permite mantenerla contenida o extenderla por el espacio disponible. Establecer el ancho máximo de la imagen en 0 hace que la imagen use el ancho disponible completo.
La relación de aspecto es útil cuando quiere un diseño más consistente, especialmente si aparecen varias imágenes juntas. La relación predeterminada conserva las proporciones naturales de la imagen, mientras que las relaciones fijas crean una cuadrícula más ordenada, pero pueden recortar la imagen visible.
La relación de aspecto en móvil puede seguir la relación principal o usar su propio ajuste. Esto resulta útil cuando un recorte ancho en escritorio parece demasiado bajo o demasiado ajustado en pantallas más pequeñas.
Si añade un enlace, la imagen se vuelve interactiva. Abrirla en una nueva pestaña es más útil para destinos externos o descargas.
Las relaciones de aspecto fijas pueden recortar los bordes de la imagen. Compruebe tanto escritorio como móvil si la imagen incluye rostros, detalles de producto o texto.
Ajustes de pie de foto
Sección titulada «Ajustes de pie de foto»Use el pie de foto cuando la imagen necesite una etiqueta, una breve explicación o una línea de crédito. Puede colocarlo encima o debajo de la imagen y luego ajustar la alineación y el tamaño del texto para que coincidan con su función.
Los pies de foto breves suelen funcionar mejor. Si el pie de foto necesita más énfasis, aumente el tamaño del texto, pero manténgalo breve para que la imagen siga siendo la protagonista.
Ajustes de superposición
Sección titulada «Ajustes de superposición»Los ajustes de superposición añaden un color sólido o un degradado sobre la imagen. Esto puede ayudar a crear un estilo visual más marcado o mejorar el contraste del pie de foto sobre fotografías cargadas.
La opacidad controla con qué intensidad afecta la superposición a la imagen. Una opacidad más baja conserva más detalle de la imagen, mientras que una opacidad más alta crea un efecto teñido más dramático.
Ajustes de alineación
Sección titulada «Ajustes de alineación»Estos ajustes controlan cómo se sitúa el bloque dentro del espacio disponible en escritorio y móvil. Son más importantes cuando la imagen no ocupa todo el ancho.
La alineación centrada suele ser la opción más segura para imágenes independientes. La alineación a la izquierda o a la derecha puede funcionar bien cuando la imagen forma parte de un diseño más editorial o se combina con contenido cercano.
Ajustes estándar de bloque
Sección titulada «Ajustes estándar de bloque»Ajustes de color
Sección titulada «Ajustes de color»Estos controles le permiten anular los colores habituales de este bloque, incluidos el color del borde y del texto. Úselos cuando esta imagen necesite diferenciarse del diseño circundante o cuando el pie de foto necesite un tratamiento de contraste más claro. Consulte la referencia de ajustes de color.
Ajustes de visibilidad
Sección titulada «Ajustes de visibilidad»Use los controles de visibilidad para mostrar u ocultar este bloque según el dispositivo. Esto resulta útil cuando desea tratamientos de imagen distintos para los diseños de escritorio y móvil. Consulte la referencia de ajustes de visibilidad.
Ajustes del editor
Sección titulada «Ajustes del editor»Los ajustes del editor le ayudan a etiquetar claramente el bloque en la barra lateral del editor. Un título personalizado del editor es especialmente útil cuando tiene varios bloques de imagen en la misma área. Para la interfaz de edición del bloque, consulte la documentación de Shopify sobre el editor de temas
Notas de uso
Sección titulada «Notas de uso»- Revise escritorio y móvil por separado. El diseño, la alineación, la visibilidad y el comportamiento del medio pueden diferir según la ventana gráfica, así que compruebe ambas vistas antes de publicar.
- Mantenga el estilo alternativo cuando pueda. Las opciones de color vacías o con estilo predeterminado suelen conservar el aspecto circundante, mientras que los colores explícitos, los degradados o las anulaciones del medio hacen que el bloque se perciba más independiente.
- Considere el medio separado como una decisión deliberada. Las imágenes distintas para escritorio y móvil pueden mejorar el ajuste, pero también pueden cambiar el recorte, la carga, el comportamiento de reserva y la legibilidad.
- Vigile el contenido importante de la imagen. Si la imagen incluye rostros, detalles de producto o texto, confirme que el recorte elegido sigue manteniendo legible el sujeto en ambos tamaños de pantalla.