Come mostrare più immagini per variante su Shopify
Vendi una borsa in 6 colori. Ogni colore ha 5 foto: fronte, retro, dettaglio, indossata, confezione. In totale 30 immagini. Il cliente seleziona “Bordeaux” e vede tutte e 30 le foto mescolate. Deve scorrere, indovinare, confrontare. Non esattamente l’esperienza di un e-commerce professionale.
Il problema nasce da un limite strutturale di Shopify: puoi assegnare una sola immagine principale per variante. Non tre, non cinque. Una. La galleria prodotto mostra sempre tutte le foto, indipendentemente dalla variante selezionata.
In questa guida vediamo come superare questo limite e mostrare solo le immagini della variante scelta dal cliente.
In questo articolo
- Il limite di Shopify sulle immagini variante
- Perché servono più immagini per variante
- Come funziona il filtraggio con Rubik
- Configurazione passo dopo passo
- Assegnazione automatica con l’IA
- Risultati concreti
- Domande frequenti
Il limite di Shopify sulle immagini variante
Nella scheda prodotto di Shopify, ogni variante ha un campo “Immagine”. Puoi selezionare una foto dalla galleria prodotto e associarla a quella variante. Quando il cliente clicca su quella variante, l’immagine principale cambia. Ma la galleria sottostante resta identica: tutte le foto del prodotto, in ordine.
Questo funziona bene se vendi un prodotto con 2 colori e 2 foto ciascuno. Ma se hai 8 colori con 5 foto per colore, il cliente si trova davanti a 40 immagini senza alcuna organizzazione. Su mobile, dove il 70% del traffico Shopify si concentra, significa scorrere decine di thumbnail per trovare le foto giuste.
Il risultato? Confusione, abbandono, resi. Il 22% dei resi online dipende dal fatto che il prodotto appare diverso da come il cliente se lo aspettava.
Perché servono più immagini per variante
Una sola foto non basta per vendere. Il cliente vuole vedere il prodotto da più angolazioni, in contesto d’uso, con dettagli ravvicinati. Per ogni colore o stile, servono almeno 3-5 immagini per dare un quadro completo.
Marchi come Nike, Zara e Apple mostrano gallerie dedicate per ogni variante. Il cliente seleziona “Nero” e vede solo le foto del prodotto nero. Seleziona “Bianco” e la galleria si aggiorna istantaneamente. Nessuna confusione, nessun dubbio.
Con più immagini per variante, il tasso di conversione cresce. Un test A/B di MECLABS ha misurato il 14,6% in più di ordini su pagine con opzioni visive rispetto a pagine con solo testo. Se aggiungi il filtraggio della galleria, il vantaggio si amplifica ulteriormente.
Come funziona il filtraggio con Rubik
Rubik Variant Images risolve il problema sulla pagina prodotto. L’app ti permette di assegnare più immagini a ogni variante e filtra automaticamente la galleria quando il cliente cambia selezione.
Il funzionamento è semplice. Carichi tutte le foto nella galleria prodotto di Shopify come fai normalmente. Poi, nell’interfaccia di Rubik, trascini le immagini sotto ogni variante. Puoi assegnare 3, 5, 10 o più foto per variante. Quando il cliente seleziona “Rosso”, la galleria mostra solo le foto del rosso. Quando passa a “Blu”, le foto cambiano immediatamente.
I dati vengono salvati nei metafield di Shopify. Nessuna chiamata API esterna, nessun rallentamento. Lo swatch di colore e la galleria filtrata si caricano insieme alla pagina.
Configurazione passo dopo passo
Configurare più immagini per variante richiede pochi minuti. Ecco i passaggi:
- Installa Rubik Variant Images dallo Shopify App Store e attiva l’App Embed nel theme editor.
- Apri un prodotto nell’interfaccia dell’app. Vedrai tutte le immagini del prodotto e tutte le varianti.
- Trascina le immagini sotto ogni variante. Per esempio, le prime 5 foto sotto “Rosso”, le successive 5 sotto “Blu”, e così via.
- Salva e verifica. Apri la pagina prodotto nel tuo negozio. Seleziona una variante e controlla che la galleria mostri solo le foto corrette.
Puoi anche impostare immagini condivise che appaiono per tutte le varianti: la foto della confezione, la tabella taglie, il lifestyle shot generico. Basta assegnarle come “immagini comuni” nell’interfaccia di Rubik.
Per una guida completa alla configurazione, leggi il nostro articolo sulla configurazione delle immagini varianti.
Assegnazione automatica con l’IA
Se hai centinaia di prodotti, assegnare manualmente le immagini richiede tempo. Rubik include una funzione di assegnazione automatica basata sull’intelligenza artificiale. L’IA analizza i nomi dei file, i colori dominanti e i metadati delle immagini per abbinare automaticamente ogni foto alla variante corretta.
Non è perfetta al 100%, ma copre l’80-90% dei casi. Puoi poi rifinire manualmente le assegnazioni che l’IA non ha colto. Su un catalogo di 200 prodotti con 5 varianti ciascuno, questo ti fa risparmiare ore di lavoro.
Risultati concreti
I negozi che passano dalla galleria completa a quella filtrata per variante riportano risultati tangibili. Meno resi perché il cliente vede esattamente cosa sta comprando. Più tempo sulla pagina prodotto perché sfogliare 5 foto è più rapido e coinvolgente che scorrerne 40. Tassi di conversione più alti perché il dubbio scompare.
Se i tuoi immagini varianti non vengono mostrate correttamente, abbiamo anche una guida alla risoluzione dei problemi più comuni.
Per chi vende su Google Shopping, le immagini corrette per variante migliorano anche la qualità del feed. Ne parliamo nel nostro articolo sulle immagini varianti per Google Shopping.
Domande frequenti
Quante immagini posso assegnare a ogni variante?
Non c’è un limite imposto da Rubik. Puoi assegnare 3, 5, 10 o più immagini per variante. Il limite pratico è quello di Shopify sui file multimediali del prodotto (attualmente fino a 250 immagini per prodotto).
Serve modificare il codice del tema?
No. Rubik funziona come App Embed. Lo attivi dal theme editor di Shopify senza toccare il codice Liquid. Funziona con tutti i temi che supportano gli App Embed, incluso Dawn e la maggior parte dei temi a pagamento.
L’app rallenta il negozio?
No. I dati vengono salvati nei metafield di Shopify e caricati insieme alla pagina. Non ci sono chiamate API esterne. L’interfaccia degli swatch usa il Shadow DOM, che previene conflitti CSS con il tema.
Posso avere immagini condivise tra più varianti?
Sì. Puoi impostare immagini “comuni” che appaiono nella galleria indipendentemente dalla variante selezionata. Utile per la foto della confezione, la guida alle taglie o lo scatto lifestyle generico.
L’assegnazione automatica IA funziona con tutti i prodotti?
L’IA funziona meglio quando i nomi dei file contengono il nome del colore o della variante (es. “borsa-rossa-fronte.jpg”). Con nomi generici come “IMG_4521.jpg” il risultato è meno preciso, ma puoi sempre correggere manualmente.
Rubik mostra i campioni colore anche nella pagina collezione?
Rubik Variant Images funziona sulla pagina prodotto. Per i campioni colore nella pagina collezione serve Rubik Combined Listings, un’app separata.
Funziona con i page builder come EComposer o PageFly?
Sì, purché il page builder utilizzi la galleria prodotto nativa di Shopify. Se il page builder ha una galleria personalizzata completamente diversa, potrebbe servire una configurazione aggiuntiva.
Approfondimenti
