Tutorial fotográfico de comercio electrónico
Tamaño y recorte de las imágenes de colección de Shopify
Una imagen de la colección de Shopify puede aparecer en una cuadrícula de productos cuadrada y en un encabezado ancho. El tema controla el espacio, por lo que una recomendación de un solo píxel no puede predecir el recorte. Esta guía combina los pasos de edición de la colección de Shopify con una colección de utensilios de cocina ficticia para mostrar cómo validar ambas ubicaciones.
Los pasos rápidos
Identifica las ubicaciones y proporciones del tema. Elige un original de alta resolución con espacio alrededor del producto y revísalo en escritorio y móvil. Si un único recorte no sirve para ambas ubicaciones, usa una imagen de cabecera independiente cuando el tema lo permita.
1. Identifique las dos ubicaciones visibles.
En el editor de temas, localice la tarjeta de la colección y la imagen o banner destacado de la página de la colección. Anota de dónde viene cada imagen y su proporción mostrada. En la colección ficticia de North Pier, asume una tarjeta de cuadrícula cuadrada y un héroe de escritorio 2:1. Esas proporciones son ejemplos de formas de ranura.
2. Dibuja la superposición segura en tu lienzo.
Pon la imagen de los utensilios de cocina en un lienzo de Ciyo. Añade un cuadrado y un marco de vista previa 2:1 en el mismo centro. Coloque el mango y el borde de la sartén en el área que retienen ambos recortes. Si el asa solo cabe en el diseño panorámico, comience con una fotografía más amplia o mueva el sujeto antes de cambiar el tamaño.
3. Obtenga una vista previa del tema real en ambos anchos.
Utilice un tema de desarrollo o una vista previa segura. En Shopify, la imagen destacada de la colección se puede editar en Productos → Colecciones. Consulte la cuadrícula y la página de colección en una ventana gráfica estrecha y amplia. Busque una manija cortada, un rumbo que aterrice en un área concurrida o una fuente incorrecta que alimente el cartel.
4. Exportar y reemplazar el activo correcto
Comience desde la fuente aprobada de la más alta calidad. Exporte suficientes píxeles para la ubicación más grande que desee ofrecer y verifique el resultado del tema. Si su tema admite un recurso de héroe dedicado, utilícelo donde una composición separada mantenga legibles el tema y el encabezado de la página. Asigne a cada imagen un texto alternativo descriptivo donde transmita contenido.
Revisar después de cambiar el tema.
Mantenga una nota breve con el nombre del tema, los nombres de las ranuras y el recorte marcado. Vuelva a visitar la vista previa después de cambiar la configuración de diseño o cambiar de tema. Guarde la fuente por separado para que comience un nuevo recorte a partir del activo aprobado en lugar de una exportación previamente recortada.
Usa otra imagen si un recorte no sirve para dos ubicaciones
Si la tarjeta necesita mostrar toda la cacerola y la cabecera necesita espacio para un titular, prueba imágenes distintas cuando el tema lo permita. Identifica primero qué ajuste controla cada imagen; cambiar una foto de producto no cambia necesariamente la cabecera de la colección.
Si ambas ubicaciones comparten imagen, protege el producto en el recorte más estrecho y vuelve a revisar el ancho. Guarda el nombre del tema y de la plantilla. Repite las comprobaciones cuando cambien el tema o los ajustes de sección.
Preguntas frecuentes
¿Cuál es el tamaño oficial de cada imagen de la colección de Shopify?
Verifique la configuración de diseño e imagen del tema activo. La guía de edición de la colección le indica cómo seleccionar la imagen y su tema determina cómo aparece.
¿Puedo compartir imagen entre tarjeta y cabecera?
Sí, si el tema permite usarla en ambos lugares y el producto se reconoce en escritorio y móvil. Comprueba el tema real antes de aprobarla.
Compara dos proporciones de recorte
Abre en Ciyo la foto aprobada de los utensilios y comprueba la tarjeta cuadrada y la cabecera ancha antes de subirlas.