Acerca de la función "Mostrar imagen del producto por variante seleccionada"
Esta función le permite controlar qué imágenes de producto aparecen cuando un cliente selecciona una variante específica.
Cuando está habilitada, GemPages muestra automáticamente solo las imágenes relevantes para la variante elegida, haciendo coincidir el nombre de la variante con el texto alternativo de la imagen.
Puedes aplicar esta configuración a ambos Elementos del producto y Elementos de la lista de productos.
Cómo funciona la función
Cuando un visitante selecciona una variante de producto, GemPages hará lo siguiente:
- Compara el nombre de la variante con el texto alternativo de cada imagen en tu producto de Shopify.
- Mostrar solo las imágenes que incluyan el nombre de la variante en su texto alternativo.
- Ocultar automáticamente las imágenes no relacionadas.
También puedes marcar ciertas imágenes para que aparezcan en todas las variantes añadiendo la palabra clave “todas las variantes” en su texto alternativo (por ejemplo, instrucciones de cuidado, tabla de tallas).
Por defecto, se muestran todas las imágenes de los productos. Deberá habilitar esta opción manualmente siguiendo las instrucciones a continuación.
Cómo habilitar la opción “Mostrar imágenes de productos por variante seleccionada” en GemPages
Siga los pasos a continuación para habilitar esta función en el editor de GemPages:
Paso 1: Desde Administración de Shopify, vaya a Aplicaciones > GemPages, luego abre la página que contiene tu Elemento Producto.
Paso 2: Haga clic en su Elemento Producto para seleccionarlo. En el panel Capas, busque y haga clic en el Elemento de imagen del producto dentro de eso.
Paso 3: En la barra lateral izquierda, debajo de Configuración pestaña, desplácese hacia abajo para encontrar Condición de visualización:.
Paso 4: Elija la opción de visualización
Verás dos opciones:
- Todas las imágenes (predeterminado)Muestra todas las imágenes del producto independientemente de la variante.
- Variante seleccionada: Muestra únicamente las imágenes que coinciden con la variante seleccionada según su texto alternativo.
Seleccione las Variante seleccionada para habilitar la característica.
Paso 5: Una vez habilitado, haga clic Guardar y Publicar tu pagina.
Las imágenes de tus productos se actualizarán dinámicamente cada vez que un visitante seleccione una variante diferente.
Cómo configurar el texto alternativo para imágenes con variantes en Shopify
Para que esta función funcione correctamente, deberá asignar los valores adecuados. texto alternativo GemPages utiliza el texto alternativo de cada imagen de producto en Shopify para determinar a qué variante pertenece cada imagen.
Paso 1: Desde su administración de Shopify, vaya a la Productos > [Tu producto].
Paso 2: Encuentra las imágenes que deseas asignar a una variante.
Paso 3: Haz clic en una imagen → clic Agregar texto alternativo → Introduzca el nombre de la variante.
Para garantizar que el sistema identifique correctamente las imágenes basadas en variantes, siga estos pasos. Reglas de nomenclatura para el texto alternativo:
- Todo el texto se convierte a minúsculas.
- Espacios, guiones (-) y guiones bajos (_) se ignoran
- El texto alternativo debe incluir todos los valores de variantes seleccionados (por ejemplo, color y tamaño).
- La función El nombre de la variante debe aparecer en el texto alternativo.
- Para mostrar una imagen para todas las variantesincluir “todas las variantes” en el texto alternativo.
- Utilice texto descriptivo para mejorar la accesibilidad y el posicionamiento SEO.
- Mantén convenciones de nomenclatura coherentes en toda tu tienda. Haz clic. Guardar Una vez que hayas terminado, repite este proceso para todas las imágenes del producto.
Por ejemplo, supongamos que usted vende un Camisetas con las siguientes opciones de variantes:
- Color Rojo azul
- Tamaños: S, M, L
Cada imagen del producto debe incluir tanto el color como el tamaño. texto alternativo, de modo que GemPages pueda identificar qué imagen pertenece a qué variante.
Ejemplos correctos:
| Variante | Ejemplo de texto alternativo |
| Rojo – S | Camiseta roja S |
| Rojo – M | Camiseta roja M |
| Azul – L | Camiseta azul talla L |
| Todas las variantes (por ejemplo, tabla de tallas) | Tabla de tallas para todas las variantes |
Ejemplos incorrectos:
| Alt Text | Por qué está mal |
| Camiseta roja | Falta información sobre el tamaño. |
| Camiseta M | Falta información de color |
| IMG_0001 | Sin información de variantes |
Para obtener información más detallada sobre cómo administrar las imágenes de productos y el texto alternativo en Shopify, visite:
Centro de ayuda de Shopify – Medios del producto
Centro de ayuda de Shopify: Agregar texto alternativo
Notas:
- Comportamiento de la imagen destacada: Cuando el "Variante seleccionadaSi la opción está habilitada, GemPages determina la imagen destacada en función de primera imagen cuyo texto alternativo coincide con el nombre de la variante seleccionadaEsto significa que la imagen destacada se muestra en GemPages. podría no ser lo mismo que la “imagen destacada” que asignaste manualmente a esa variante dentro de Shopify.
- Desactivado por defecto: El "Variante seleccionada"Opción es desactivado por defectoTodas las imágenes se mostrarán normalmente hasta que actives la función manualmente.
Preguntas frecuentes
1. ¿Por qué las imágenes de mis productos no se muestran correctamente al seleccionar una variante?
Si tus imágenes no se actualizan según la variante seleccionada, prueba los siguientes pasos:
- Asegúrese de que cada imagen del producto incluya el nombre de variante correcto en su texto alternativo.
- Compruebe que el "Variantes seleccionadas" La opción está activada en la configuración de Imagen del producto.
- Recuerda que Los espacios, los guiones (-) y los guiones bajos (_) se ignoran durante el emparejamiento.
- Si ninguna imagen coincide con el nombre de la variante, GemPages mostrará automáticamente todas las imágenes del producto.
2. ¿Cómo puedo mostrar ciertas imágenes para todas las variantes del producto?
Si quieres que aparezca una imagen (como una tabla de tallas, una guía de cuidados o una foto general del producto) para cada variante, simplemente añade “todas las variantes” a su texto alternativo en Shopify.
GemPages mostrará siempre esa imagen, independientemente de la variante que seleccione el cliente.
3. ¿Puedo desactivar la función “Mostrar imágenes del producto por variante seleccionada”?
Sí. Para apagarlo, abra el Imagen de Producto En la configuración de elementos del editor de GemPages, desmarque la opción “Todas las imágenes” .
Una vez desactivada, todas las imágenes de los productos volverán a mostrarse de forma predeterminada, independientemente de la variante seleccionada.
4. ¿Qué sucede si no hay imágenes coincidentes para una variante?
Si ningún texto alternativo de la imagen coincide con la variante seleccionada, GemPages lo mostrará automáticamente. Todas las imágenes de productos disponibles.
gracias por tus comentarios