Share
All'interno di un negozio web OpenCart, i banner possono essere visualizzati in molte forme. Possono essere visualizzati come un'immagine statica, una giostra o una presentazione. Ogni banner può includere una o più immagini e questi gruppi di immagini possono essere assegnati a moduli diversi a seconda delle dimensioni e della funzione che funzionano.
Quando si desidera posizionare un banner sul proprio sito Web, è innanzitutto necessario caricare le immagini sui banner e quindi assegnare questi banner con moduli di visualizzazione.
Nel dashboard di OpenCart, vai a Sistema> Design> Banner. Inseriamo il nostro primo banner, aggiungiamo un nome e impostiamo il suo stato. Ora abbiamo appena creato un gruppo per le immagini che caricheremo.
Iniziamo ad aggiungere immagini facendo clic su Aggiungi banner pulsante. Come vedi, qui possiamo aggiungere un titolo per ogni lingua del negozio web, copiare o digitare il tuo link e sfogliare o caricare il file immagine (JPG, PNG o GIF). Possiamo assegnare tante immagini di banner quante ne vogliamo, ma tutte le immagini devono avere la stessa dimensione o almeno il rapporto, poiché queste immagini si alterneranno o scivoleranno all'interno di un modulo contenente banner. (La convenzione di denominazione dei banner può essere fonte di confusione poiché il sistema utilizza il termine bandiera per un set di immagini banner e usi bandiera per il Immagine stesso, anche.)
Caricamento di immagini per banner in OpenCart (Admin> Sistema> Design> Banner)Come abbiamo imparato sopra, i banner vengono visualizzati con i moduli in OpenCart. Ci sono tre moduli comunemente usati per mostrare i banner: il Modulo banner, Giostra e Presentazione. Tutti hanno funzioni simili: animano le stesse foto e lasciano che l'utente faccia clic su di esse.
UN Modulo banner mostra gli striscioni svanendo immagini banner in un posto ciascuno dopo ciascuno. Per assegnare un banner a un modulo segnaposto banner, vai a Estensioni> Moduli> Banner> Modifica.
Clic Aggiungi modulo e questo ci consente di invocare banner in un layout. Devi scegliere quale banner mostrare, definire il Dimensione, scegli un disposizione dove visualizzare, a Posizione della colonna, impostare il Stato e il Ordine del modulo. La dimensione del modulo dovrebbe essere tale che si adatti al colonna sarà piazzato. Il sistema ridimensiona le immagini caricate in base a questa dimensione. layout sono predefiniti e il loro nome è descrittivo. Posizione può essere impostato a sinistra, a destra, in alto o in basso (vedere i dettagli sulle posizioni di layout qui). Ordine definisce la matrice di aspetto visivo di più moduli all'interno di una colonna.
Un banner può essere assegnato a un modulo solo quando il banner è già stato creato.Il Modulo di presentazione visualizza le immagini del banner come un'animazione di presentazione animata. Questo modulo viene generalmente visualizzato sulla home page con immagini di paesaggi più grandi. I parametri principali di questo modulo - come il tipo di animazione, velocità o il suo aspetto - sono definiti nel suo file tema, che non abbiamo bisogno di modificare, dal momento che usiamo il modulo preimpostato.
Possiamo assegnare un banner già impostato e caricato a una presentazione andando a Estensioni> Moduli> Presentazione> Modifica. Quando aggiungiamo un modulo, abbiamo bisogno di fare impostazioni simili come abbiamo fatto con il modulo banner qui sopra. Scegli un banner mostrare, aggiungi la sua dimensione, scegli un disposizione e posizione, impostare il stato e il ordine. Vedere l'illustrazione qui sotto.
Per ottenere la migliore esperienza visiva, la dimensione delle immagini del banner precedentemente caricate deve essere della stessa dimensione del modulo da utilizzare.Il modulo di giostra ti consente di visualizzare una serie di immagini banner più piccole una accanto all'altra e di animarle in modo che vengano visualizzate e nascoste passo dopo passo durante lo spostamento orizzontale.
Possiamo configurare questo modulo nello stesso modo in cui abbiamo aggiunto un banner a una presentazione, sebbene un modulo di giostra accetti altre due cose:
Questi moduli banner sono molto utili e non molte soluzioni di e-commerce li hanno come parte del core, sebbene abbiano capacità limitate, ad es. non puoi vedere il numero di clic sui banner. Se vogliamo misurare i clic, possiamo utilizzare Google Analytics per questo (dato che hai già installato il codice di monitoraggio).
Facendo clic su un banner che reindirizza a una pagina sullo stesso sito è un evento nel termine di Google Analytics. Questo è il motivo per cui usiamo il tracciamento degli eventi funzione di Google Analytics per misurare i clic sul banner banner in loco in OpenCart. Ecco un codice HTML di esempio per l'implementazione del monitoraggio degli eventi:
Un evento si verifica quando un utente fa clic su qualcosa. L'evento è tracciato dal _trackEvent () metodo che contiene le seguenti informazioni: categoria - gruppo di oggetti che vogliamo monitorare (ad esempio presentazione), azione - il tipo di interazione dell'utente (ad esempio clic sul banner), etichetta - una stringa opzionale per dati aggiuntivi, valore - dati numerici opzionali per l'azione. Come puoi vedere, una semplice linea di modifica HTML ti aiuterà a tracciare i nostri banner.
I moduli banner, slideshow e carosello hanno i loro modelli all'interno della directory del tema utilizzato. Abbiamo solo bisogno di cambiare alcune righe nei file modello del modulo. Questo è ciò che dobbiamo aggiungere al tag all'interno dei file modello: onClick = "_ gaq.push (['_ trackEvent', 'tipo di banner', 'cliccato', '']);"
Per banner, trova questo o simile pezzo di codice nel tuo tema la tua cartella tematica \ template \ module \ banner.tpl file:
">
e sostituire con questo:
"onClick =" _ gaq.push (['_ trackEvent', 'Banners', 'Clicked', '']); ">
Come puoi vedere, abbiamo aggiunto banner come il categoria componente, cliccato come il azione, e il senza barra versione del titolo del banner come etichetta. Non è stato necessario selezionare un valore, poiché è impostato su uno e nel nostro caso è ciò di cui abbiamo bisogno.
Il modello di presentazione, che può essere trovato a la tua cartella tematica \ template \ module \ slideshow.tpl, dovrebbe essere cambiato da questo:
">
a questo:
"onClick =" _ gaq.push (['_ trackEvent', 'Slideshow', 'Clicked', '']); ">
Il modello del carosello si trova a la tua cartella tematica \ template \ module \ carousel.tple queste linee devono essere cambiate da questo:
![<?php echo $banner['title']; ?>](http://accentsconagua.com/img/<?php echo $banner['image']; ?> "<?php echo $banner['title']; ?>")
a questo:
I risultati dei clic possono essere visti se vai a Google Analytics e vai al Comportamento sezione> eventi Panoramica. Lì vedremo la categoria (nel nostro caso il tipo di banner), il numero di clic e il nome del banner.
Abbiamo imparato che per prima cosa dobbiamo caricare le immagini del banner su banner (gruppo), quindi in seguito possiamo assegnarle a un modulo display, come banner, slideshow o carosello. Successivamente abbiamo modificato i file modello del modulo per tenere traccia degli eventi di clic con Google Analytics.
Se hai domande, ti preghiamo di rivolgerle nell'area di discussione sottostante.
Accentsconagua