Aggiungere più immagini a un prodotto in Zen Cart

Foto di edjpgcom @ flickr.com

Questo tutorial è frutto della mia esperienza di migliaia di foto caricate in un negozio realizzato con Zen-Cart, che gestisco per l'azienda dove lavoro. Ho imparato dalle FAQ del sito ufficiale www.zen-cart.com, in How do I add multiple images to a product?

Mettetevi in testa che da Zen Cart admin, alla pagina di inserimento prodotto, è possibile caricare una sola immagine (che chiameremo la principale), tutte le altre (che chiameremo le addizionali) devono essere caricate sul server in altro modo, di solito con un client FTP. Non esiste in tutto l'admin di Zen Cart un'opzione per caricare le immagini addizionali.

Bisogna allora, collegarsi al server dove avete installato Zen Cart e caricare manualmente le immagini nelle giuste cartelle. Il modo più ovvio per trasferire i file delle immagini addizionali sul server, è con un collegamento FTP. Usate pure il vostro client FTP preferito, se non ne avete uno scaricate e installate Filezilla, ottimo e gratuito, è il mio preferito.

Un esempio: il prodotto DVD

Vi ho detto che

• l'immagine principale è unica e può essere caricata dalla pagina admin
• le immagini addizionali sono una o più e non si caricano da admin ma via FTP

Diciamo di chiamare (con grande sforzo di inventiva) l'immagine principale dvd.jpg. Ce la carichiamo regolarmente dalla pagina inserimento prodotto del nostro DVD. Fin qui niente di nuovo, forse sapevate già tutto (cliccate sulla figura seguente).

Adesso viene il bello, e cioè caricare le immagini addizionali. Bene, preparatele sul vostro computer prima di spedirle via FTP sul server. In una cartella raccogliete insieme tutte le addizionali e rinominatele col nome della principale seguito da un suffisso numerico come segue:

dvd_01.jpg
dvd_02.jpg
dvd_03.jpg
dvd_04.jpg

Ho supposto che le addizionali siano in tutto 4, più la principale fanno 5 foto per il nostro DVD. La numerazione data rispeccherà l'ordine con cui le foto compariranno nella pagina prodotto, quella destinata all'acquirente. Adesso caricate via FTP sul server questo gruppo di 4 immagini nella cartella images. Notate che in images ci troverete anche la principale dvd.jpg caricata da admin.

Abbiamo finito, stupiti?

Caricamento veloce della pagina prodotto con le thumbnail

Le thumbnail sono le foto del prodotto in versione rimpicciolita. In termini di MB sono molto leggere e permettono il caricamento più veloce della pagina prodotto. Quando un utente clicca su una thumbnail allora viene caricata e mostrata la foto grande. Zen Cart ci consente di usare le thumbnail nella pagina prodotto, purchè siamo noi stessi a rimpicciolirle e a caricarle via FTP sul server.

A questo scopo dobbiamo riorganizzare le foto sul nostro computer, ora, in una cartella terremo le immagini piccole (le thumbnail) e in un'altra cartella terremo le immagini grandi (le foto originali), seguitemi nell'esempio del DVD.

Preparazione delle immagini piccole ovvero le thumbnail

Con un programma di manipolazione immagini rimpicciolite le foto originali e mettetele in una cartella sul vostro computer, poi rinominatele così:

        dvd.jpg

        dvd_01.jpg

        dvd_02.jpg

        dvd_03.jpg

        dvd_04.jpg

La prima, dvd.jpg, la caricate dalla pagina admin del prodotto, le altre le caricate via FTP sul server nella cartella images.

Di quanto dovranno essere rimpicciolite? Lo scegliete voi, impostate da admin --> Configurazione --> Gestione Immagini la larghezza e l'altezza delle immagini piccole e poi rimpicciolite di conseguenza.

Preparazione delle immagini grandi

Le immagini grandi vanno solo rinominate aggiungendo al suffisso numerico il pezzetto _LRG (LaRGe: grande in iglese). Raccoglietele in un'altra cartella:

dvd_LRG.jpg

dvd_01_LRG.jpg

dvd_02_LRG.jpg

dvd_03_LRG.jpg

dvd_04_LRG.jpg

caricatele via FTP sul server nella cartella images/large cioè la cartella images che sta dentro la cartella large.

Abbiamo finito, nella pagina prodotto l'utente vedrà le foto piccole mentre nella finestra di popup vedrà le foto grandi (cliccate sulla figura seguente).

Formato piccolo, formato grande e formato medio

Le immagini in formato grande sono le foto originali del prodotto così come le abbiamo reperite, belle grandi. Da queste ci creiamo le immagini in formato piccolo cioè le thumbnail così da velocizzare il caricamento della pagina prodotto, lo facciamo sia per l'immagine principale che per le immagini addizionali.

Solo per la principale esiste anche il formato medio, immagine con le dimensioni tra la piccola e la grande. Se la carichiamo sul server sarà visualizzata nella pagina prodotto al posto della piccola dando più risalto alla principale rispetto alle addizionali perchè apparirà più grande (cliccandoci sopra comunque verrà caricata e mostrata la foto grande).

Perchè questo privilegio? Perchè appunto è l'immagine principale, nella pagina prodotto è quella che compare sotto il titolo e accanto alla descrizione, mentre le addizionali sono in secondo piano. Dovremmo scegliere con cura la foto per l'immagine principale, in modo che rappresenti bene il prodotto messo in vendita.

Riprendiamo l'esempio del DVD utilizzando tutti i formati. Organizzate i file sul vostro computer, rinomitateli e inviateli sul server come segue.

Foto principale e addizionali nel formato piccolo, da caricare in images:

dvd.jpg

dvd_01.jpg

dvd_02.jpg

dvd_03.jpg

dvd_04.jpg

Foto principale nel formato medio da caricare in images/medium:

dvd_MED.jpg

Avete notato che è solo la principale, ha suffisso _MED e va caricata nella cartella medium sul server che già troverete? Penso di sì.

Foto principale e addizionali nel formato grande, da caricare in images/large:

dvd_LRG.jpg

dvd_01_LRG.jpg

dvd_02_LRG.jpg

dvd_03_LRG.jpg

dvd_04_LRG.jpg

Concludo questo tutorial, vi ringrazio per aver letto fin qui, se volete voi ringraziarmi condividete.