Configuratore di incisione nella scheda prodotto
- Pulsante con prezzo a partire da: nella scheda prodotto compare un pulsante di personalizzazione con il prezzo più basso tra i tipi di incisione abilitati e, quando i prezzi differiscono, il prezzo è preceduto dalla dicitura “a partire da”.
- Incisione gratuita con importo barrato: se uno qualsiasi dei tipi di incisione ha prezzo zero, accanto al pulsante viene mostrata un’etichetta che informa della personalizzazione gratuita, mentre l’importo regolare resta visibile come barrato.
- Finestra del configuratore: la personalizzazione avviene in una finestra modale sulla stessa pagina, senza reindirizzare il cliente a un modulo separato e senza perdere la combinazione prodotto selezionata in precedenza.
- Tre tipi di personalizzazione: incisione orizzontale, incisione verticale e simbolo o icona, ciascuno con il proprio prezzo, il proprio limite di caratteri e la propria dimensione del font salvata nel preset.
- Due posizioni di incisione: il cliente sceglie il layout “dal basso” oppure “al centro” dell’area designata, il che consente di gestire sia una scritta sotto una stampa esistente sia una scritta centrale.
- Ordine dei passaggi imposto dall’interfaccia: il campo di testo, la scelta del font e il pulsante di conferma vengono mostrati solo dopo aver indicato il tipo di incisione, e il pulsante di conferma resta inattivo finché la personalizzazione non è completa.
- Contatore dei caratteri: il campo di testo mostra in tempo reale il numero di caratteri inseriti rispetto al limite previsto per il tipo di incisione selezionato.
Anteprima sull’immagine del prodotto disegnata nel browser
- Rendering su elemento canvas: l’anteprima viene generata lato client, alla risoluzione dell’immagine usata come mockup, e si aggiorna a ogni modifica del testo, del font, della posizione, del tipo di incisione o dell’icona selezionata.
- Testo disposto sulla superficie dell’oggetto: il modulo calcola la disposizione delle lettere separatamente per ogni carattere, tenendo conto della curvatura della superficie, così la scritta su una tazza, una bottiglia o un altro oggetto arrotondato non appare come una sovrapposizione piatta.
- Anteprima coerente con ciò che viene salvato nell’ordine: lo stesso meccanismo di disegno crea l’immagine salvata con l’ordine, quindi il cliente e il laboratorio vedono lo stesso risultato.
- Font caricati su richiesta: i file dei font vengono scaricati solo all’apertura del configuratore, e non a ogni accesso alla scheda prodotto, così non si appesantisce il caricamento della pagina per i clienti che non usano la personalizzazione.
- Risorse caricate in modo condizionale: il foglio di stile e gli script del modulo vengono inclusi esclusivamente nelle schede prodotto con incisione abilitata – nelle altre pagine del negozio il modulo non aggiunge alcun file.
Preset – area di incisione e aspetto della scritta
- Immagine base della personalizzazione: nel preset si carica un’immagine in formato JPG, PNG o WebP sulla quale il cliente vedrà la propria incisione; può trattarsi dell’immagine di catalogo del prodotto.
- Area selezionata con il mouse sull’immagine: il rettangolo di incisione si disegna direttamente sull’anteprima – trascinando sullo sfondo, afferrando il centro per spostarlo e un angolo per ridimensionarlo.
- Gli stessi valori disponibili da tastiera: quattro campi numerici consentono di inserire posizione e dimensioni dell’area senza usare il mouse, rendendo l’impostazione più importante del modulo accessibile anche tramite tastiera.
- Area salvata in percentuale: posizione e dimensioni vengono memorizzate come percentuale della larghezza e dell’altezza dell’immagine, quindi la selezione resta corretta indipendentemente dalla risoluzione dell’anteprima.
- Dimensioni del font separate: il preset memorizza una dimensione per l’incisione orizzontale e una separata per quella verticale, perché la stessa scritta nei due layout richiede una scala diversa.
- Colore della scritta definito dal negozio: il colore dell’incisione viene definito dal proprietario del negozio nel preset, in modo che corrisponda all’effetto ottenuto sul materiale specifico; il cliente non può modificarlo.
- Ordine dei preset con trascinamento: l’elenco dei preset nel pannello supporta l’impostazione manuale dell’ordine e l’attivazione o disattivazione delle singole voci.
Galleria di font gestita dal pannello
- File di font personalizzati: il pannello accetta file nei formati WOFF2, WOFF, TTF e OTF, quindi il negozio può mettere a disposizione esattamente i caratteri che è in grado di realizzare in laboratorio.
- Dodici caratteri dopo l’installazione: il modulo installa un set pronto di dodici font, tra cui Caveat, Dancing Script, Pacifico, Roboto Slab, Libre Baskerville, Montserrat, Oswald, Courgette, Lobster, Alfa Slab One, Josefin Sans e Comfortaa.
- Anteprima del carattere sul pulsante di selezione: ogni pulsante del font nel configuratore mostra il proprio nome proprio con quel carattere, così il cliente vede la scelta prima di confermarla.
- Attivazione, disattivazione e ordine: ogni font può essere nascosto senza eliminare il file, e l’ordine nell’elenco si imposta trascinando.
- Cartella dei font protetta: il modulo crea, nel percorso di archiviazione dei font, regole di accesso che limitano il modo in cui i file possono essere scaricati.
Icone e simboli con controllo della sicurezza dei file
- Grafica vettoriale SVG: i simboli vengono caricati come file SVG, così si scalano senza perdita di qualità indipendentemente dalla risoluzione dell’anteprima.
- Pulizia del file caricato: prima del salvataggio nel negozio, il file SVG viene elaborato e privato degli elementi eseguibili – script, attributi di evento, riferimenti esterni, indirizzi javascript codificati come entità e importazioni negli stili.
- Etichetta “novità”: le icone selezionate possono essere evidenziate nella galleria con un’etichetta novità, così da attirare l’attenzione del cliente sui modelli aggiunti di recente.
- Quattro simboli dopo l’installazione: il modulo installa un set iniziale contenente cuore, stella, montagna e zampa.
- Nascondimento automatico del passaggio: se nel negozio non ci sono icone attive, il tipo di personalizzazione “simbolo” non viene mostrato affatto al cliente.
Impostazioni di incisione per il singolo prodotto
- Scheda separata nella scheda prodotto: l’incisione si abilita direttamente nella modifica del prodotto nel pannello, senza passare dalla configurazione del modulo.
- Preset selezionato da elenco: il prodotto indica un solo preset, quindi la stessa area e le stesse dimensioni del font possono essere usate per un intero gruppo di prodotti simili.
- Sei campi prezzo: per ogni prodotto si impostano il prezzo dell’incisione orizzontale, verticale e del simbolo, nonché i relativi prezzi promozionali.
- Prezzo promozionale visibile al cliente: quando è impostato un prezzo promozionale, il configuratore lo mostra accanto al prezzo regolare barrato per il relativo tipo di incisione.
- Attivazione senza eliminare le impostazioni: la personalizzazione del prodotto può essere disattivata mantenendo preset e prezzi per un uso successivo.
Varianti – immagine diversa e colore diverso per la variante del prodotto
- Mockup assegnato al valore dell’attributo: per le singole varianti del prodotto è possibile caricare un’immagine base separata, così il cliente vede l’incisione sulla variante da lui scelta.
- Immagine della combinazione dal catalogo: il modulo può usare l’immagine della combinazione già esistente nel negozio, purché mantenga l’inquadratura rispetto alla quale è stata definita l’area di incisione.
- Colore della scritta per variante: accanto all’immagine è possibile sovrascrivere il colore dell’incisione, in linea con la reale differenza dell’effetto su materiali e colori diversi.
- Sovrascrittura a livello dell’intero prodotto: quando ogni colore nel negozio è un prodotto separato, basta una sola sovrascrittura di immagine e colore invece di creare un preset separato.
Controllo del contenuto inserito dal cliente
- Elenco dei caratteri consentiti: la configurazione del modulo contiene un insieme di caratteri accettati per l’incisione, così al laboratorio non arriverà una scritta contenente un carattere impossibile da realizzare.
- Limiti di lunghezza separati per ogni tipo: per impostazione predefinita dieci caratteri per l’incisione orizzontale, venti per quella verticale e dieci per il simbolo; i valori possono essere modificati nelle impostazioni.
- Validazione lato server: il limite di caratteri e l’elenco dei caratteri consentiti vengono verificati nuovamente al salvataggio, e non solo nel browser.
- Salvataggio protetto da token: il salvataggio e la rimozione della personalizzazione avvengono tramite l’endpoint del modulo che richiede un token di sessione valido.
Carrello, ordine e comunicazione con il cliente
- Personalizzazione standard PrestaShop: l’incisione confermata viene salvata come personalizzazione del prodotto, quindi passa attraverso il carrello e il processo di ordine tramite i meccanismi nativi del negozio.
- Miniatura sostituita dall’immagine con incisione: nel carrello, nel riepilogo dell’ordine e nelle schede ordine nel pannello, l’immagine del prodotto viene sostituita dall’anteprima generata della personalizzazione.
- Descrizione chiara accanto alla riga d’ordine: alla riga viene aggiunta una descrizione contenente il tipo di incisione, il testo, la posizione e il nome del font, preparata in modo da rientrare nel limite di lunghezza del campo di personalizzazione di PrestaShop.
- Dettagli dell’incisione nell’e-mail: il modulo integra il messaggio di conferma dell’ordine con le informazioni sulla personalizzazione ordinata.
- Addebito del prezzo della personalizzazione: il costo dell’incisione viene incluso nel valore della riga d’ordine secondo il listino impostato per il prodotto specifico.
Gestione degli ordini nel pannello amministrativo
- Pannello incisioni nella scheda ordine: una tabella separata riunisce anteprima, nome del prodotto, tipo di incisione, testo, font, posizione, icona e prezzo – l’insieme completo dei dati necessari per eseguire il lavoro.
- Colonna “Incisione” nell’elenco ordini: l’elenco ordini nel pannello acquisisce una colonna che contrassegna gli ordini contenenti personalizzazione, posizionata accanto alla colonna dei pagamenti.
- Anteprima accanto alla riga d’ordine: accanto alla riga personalizzata compare un collegamento all’immagine di anteprima dell’incisione.
- Collegamento limitato ai file del modulo: l’indirizzo dell’anteprima viene costruito esclusivamente sulla base dei nomi dei file generati da questo modulo, salvati nel database delle personalizzazioni.
Manutenzione dei dati e ordine nel negozio
- Attività di pulizia eseguita ciclicamente: il modulo mette a disposizione un indirizzo per il CRON che rimuove le immagini di anteprima provenienti da carrelli abbandonati e i dati di personalizzazione orfani.
- Token generato per il negozio: l’endpoint di pulizia richiede un token definito in fase di installazione e confrontato con un metodo resistente all’analisi dei tempi di risposta, quindi la sola conoscenza dell’indirizzo non basta per eseguire l’attività.
- Età configurabile dei dati da eliminare: l’età minima dei file destinati alla rimozione viene passata come parametro della chiamata, il che consente di adattare la pulizia alla durata tipica del percorso di acquisto.
- Data dell’ultima esecuzione: il modulo salva il momento dell’ultima esecuzione dell’attività di pulizia.
- Pulizia alla rimozione del prodotto: l’eliminazione di un prodotto nel negozio rimuove la configurazione di incisione e i dati delle varianti a esso collegati.
- Limiti per le immagini: il modulo accetta file grafici fino a due megabyte e con lato massimo di 2400 pixel, e integra le anteprime salvate con una miniatura con lato di 600 pixel.
Implementazione, multistore e aggiornamenti
- Dati separati per negozio: preset, font, icone, impostazioni dei prodotti e varianti vengono memorizzati con assegnazione al negozio, il che consente di gestire offerte di personalizzazione diverse in ambiente multistore.
- Set iniziale dopo l’installazione: l’installazione crea la struttura delle cartelle per i file, copia font e icone e imposta i valori predefiniti dei limiti e dell’elenco dei caratteri consentiti.
- Sezione dedicata nel menu del pannello: il modulo aggiunge una sezione con tre schermate di gestione – preset, font e icone.
- Percorso di aggiornamento: il pacchetto contiene tredici script di aggiornamento che portano l’installazione dalle prime versioni a quella corrente, senza modifiche manuali al database.
- Disinstallazione pulita: la disinstallazione rimuove le tabelle del modulo, le sue impostazioni e la cartella con i file di font, icone e immagini base.
- Nessuna dipendenza esterna: il modulo non richiede Composer, librerie PHP esterne né servizi di rete – funziona esclusivamente con il codice fornito nel pacchetto e con le API di PrestaShop.
Vantaggi per il negozio online
- Valore medio del carrello più alto: la personalizzazione è un’aggiunta a pagamento al prodotto, il cui prezzo viene definito dal negozio separatamente per ogni tipo di incisione e per ogni prodotto.
- Meno domande prima dell’acquisto: il cliente vede la propria scritta sull’immagine del prodotto prima di aggiungerlo al carrello, quindi chiede meno spesso all’assistenza come apparirà il risultato.
- Meno errori in laboratorio: l’ordine arriva nel pannello con anteprima e descrizione completa – tipo, testo, font e posizione – invece che con una nota nel commento dell’ordine.
- Personalizzazione come argomento di marketing: l’incisione gratuita può essere messa in evidenza nella scheda prodotto con un’etichetta e il prezzo regolare barrato.
- Configurazione una volta, uso ripetuto: un solo preset gestisce un intero gruppo di prodotti con forma e inquadratura dell’immagine simili.
- Controllo su ciò che è realizzabile: l’elenco dei caratteri consentiti e i limiti di lunghezza limitano gli ordini alle scritte effettivamente realizzabili.
- Nessun disordine crescente nei file: l’attività di pulizia elimina le anteprime dei carrelli che non sono mai diventati ordini.
Compatibilità
PD Grawer na produktach Pro è predisposto per PrestaShop dalla versione 1.7.8.2, passando per 8.x fino a 9.x, nonché per PHP 7.0–8.5, e memorizza i dati in MySQL 5.6+ o MariaDB 10.x+. Il modulo non richiede Composer né librerie esterne, e l’anteprima dell’incisione viene generata nel browser del cliente senza ricorrere a servizi esterni. L’interfaccia cliente e il pannello sono tradotti in lingua polacca, e il modulo supporta l’ambiente multistore, assegnando preset, font, icone e impostazioni dei prodotti al negozio specifico.