Share
In einem OpenCart-Webshop können Banner in vielen Formen angezeigt werden. Sie können als statisches Bild, Karussell oder Diashow angezeigt werden. Jedes Banner kann ein oder mehrere Bilder enthalten, und diese Gruppe von Bildern kann abhängig von der Größe und der Funktion, die sie ausführen, verschiedenen Modulen zugewiesen werden.
Wenn Sie ein Banner auf Ihrer Website platzieren möchten, laden Sie zuerst Bilder zu Bannern hoch und weisen diese Banner dann mit Anzeigemodulen zu.
Navigieren Sie im Dashboard von OpenCart zu System> Design> Banner. Fügen Sie unser erstes Banner ein, fügen Sie einen Namen hinzu und legen Sie den Status fest. Jetzt haben wir gerade eine Gruppe für die hochzuladenden Bilder erstellt.
Beginnen wir mit dem Hinzufügen von Bildern, indem Sie auf klicken Banner hinzufügen Taste. Wie Sie sehen, können wir hier für jede Webshop-Sprache einen Titel hinzufügen, Ihren Link kopieren oder eingeben und die Bilddatei (JPG, PNG oder GIF) durchsuchen oder hochladen. Wir können beliebig viele Bannerbilder zuweisen, aber alle Bilder sollten die gleiche Größe oder zumindest das Verhältnis haben, da diese Bilder innerhalb eines Bannerhaltemoduls wechseln oder gleiten. (Die Namenskonvention für Banner kann verwirrend sein, da das System den Begriff verwendet Banner Für ein Satz von Bannerbildern und verwendet Banner für die Bild selbst auch.)
Bilder für Banner in OpenCart hochladen (Admin> System> Design> Banner)Wie wir oben erfahren haben, werden Banner mit Modulen in OpenCart angezeigt. Es gibt drei häufig verwendete Module zum Anzeigen von Bannern: das Banner-Modul, Karussell und Diashow. Diese Funktionen haben alle ähnliche Funktionen: Sie animieren Bilder gleicher Größe und lassen den Benutzer darauf klicken.
EIN Banner-Modul zeigt Banner durch Ausblenden Bannerbilder an einem Ort jeweils nach. Um einem Banner-Platzhaltermodul ein Banner zuzuweisen, navigieren Sie zu Erweiterungen> Module> Banner> Bearbeiten.
Klicken Modul hinzufügen und so können wir Banner in einem Layout aufrufen. Sie müssen auswählen, welches Banner angezeigt werden soll Abmessungen, Wähle eine Layout wo angezeigt werden soll, a Spaltenposition, stellen Sie das ein Status und das Reihenfolge des Moduls. Die Größe des Moduls sollte so sein, dass es in das Modul passt Säule es wird platziert. Das System passt die hochgeladenen Bilder entsprechend dieser Dimension an. Layouts sind vordefiniert und ihr Name ist beschreibend. Position kann links, rechts, oben oder unten eingestellt werden (Details zu den Layoutpositionen finden Sie hier). Auftrag Definiert das visuelle Erscheinungsbild mehrerer Module innerhalb einer Spalte.
Ein Banner kann nur dann einem Modul zugewiesen werden, wenn das Banner bereits erstellt wurde.Das Diashow-Modul zeigt Bannerbilder als bewegte Diashowanimation an. Dieses Modul wird im Allgemeinen auf der Startseite mit größeren Landschaftsbildern angezeigt. Die Hauptparameter dieses Moduls - wie die Art der Animation, die Geschwindigkeit oder das Aussehen - werden in der Themendatei definiert, die wir nicht ändern müssen, da wir das voreingestellte Modul verwenden.
Wir können ein bereits gesetztes und hochgeladenes Banner einer Diashow zuordnen, indem Sie zu gehen Erweiterungen> Module> Diashow> Bearbeiten. Wenn Sie ein Modul hinzufügen, müssen Sie ähnliche Einstellungen vornehmen wie im obigen Banner-Modul. Wähle ein Banner zeigen, füge seine Größe hinzu, Wähle eine Layout und Position, stellen Sie das ein Status und das Auftrag. Siehe die Abbildung unten.
Um ein optimales visuelles Erlebnis zu erhalten, sollte die Größe der zuvor hochgeladenen Bannerbilder der Größe des zu verwendenden Moduls entsprechen.Das Karussellmodul Damit können Sie eine Reihe kleinerer Bannerbilder nebeneinander anzeigen und animieren, sie anzuzeigen und schrittweise zu verbergen, während Sie sich horizontal bewegen.
Wir können dieses Modul auf dieselbe Weise einrichten, wie wir ein Banner zu einer Diaschau hinzugefügt haben. Ein Karussellmodul akzeptiert jedoch zwei weitere Dinge:
Diese Bannermodule sind sehr nützlich und nicht viele E-Commerce-Lösungen haben sie als Teil des Kerns, obwohl sie eingeschränkte Fähigkeiten haben, z. Sie können die Anzahl der Klicks auf den Bannern nicht sehen. Wenn wir Klicks messen möchten, können wir Google Analytics dafür verwenden (vorausgesetzt, dass Sie den Tracking-Code bereits installiert haben).
Wenn Sie auf ein Banner klicken, das auf eine Seite auf derselben Website weiterleitet, wird ein angezeigt Veranstaltung in Google Analytics-Begriff. Deshalb benutzen wir die Ereignisverfolgung Funktion von Google Analytics zur Messung von Banner-Klicks vor Ort in OpenCart. Hier ein Beispiel-HTML-Code zum Implementieren der Ereignisüberwachung:
Ein Ereignis tritt ein, wenn ein Benutzer auf etwas klickt. Das Ereignis wird vom verfolgt _trackEvent () Methode, die folgende Informationen enthält: Kategorie - Gruppe von Objekten, die wir verfolgen möchten (z. B. Diashow), Aktion - die Art der Benutzerinteraktion (z. B. Banner-Klick), Etikette - eine optionale Zeichenfolge für zusätzliche Daten, Wert - optionale numerische Daten für die Aktion. Wie Sie sehen, hilft eine einfache HTML-Modifikationslinie dabei, die Klicks unserer Banner zu verfolgen.
Die Banner-, Slideshow- und Karussellmodule verfügen über eigene Vorlagen im Verzeichnis der verwendeten Themen. Wir müssen nur einige Zeilen in Modulvorlagendateien ändern. Das müssen wir dem hinzufügen Tags innerhalb der Vorlagendateien: onClick = "_ gaq.push (['_ trackEvent', 'banner type'), 'Clicked', '']); "
Für Banner, Finden Sie diesen oder einen ähnlichen Code in Ihrem Theme Ihr Themenordner \ template \ module \ banner.tpl Datei:
">
und ersetzen Sie mit diesem:
"onClick =" _ gaq.push (['_ trackEvent', 'Banner', 'Clicked', '']); ">
Wie Sie sehen können, haben wir hinzugefügt Banner als die Kategorie Komponente, Angeklickt als die Aktion, und das ungeschnitten Version des Bannertitel wie Etikette. Wir mussten keinen Wert auswählen, da dieser Standardwert ist, und in unserem Fall ist es das, was wir brauchen.
Die Diashowvorlage, das kann bei gefunden werden Ihr Designordner \ template \ module \ slideshow.tpl, sollte davon abgeändert werden:
">
zu diesem:
"onClick =" _ gaq.push (['_ trackEvent', 'Slideshow', 'Clicked', '']); ">
Die Karussellvorlage finden Sie unter Ihr Designordner \ template \ module \ carousel.tplund diese Zeilen müssen hieraus geändert werden:
![<?php echo $banner['title']; ?>](http://accentsconagua.com/img/<?php echo $banner['image']; ?> "<?php echo $banner['title']; ?>")
zu diesem:
Die Ergebnisse der Klicks können angezeigt werden, wenn Sie zu Google Analytics gehen und zu Verhalten Abschnitt> Veranstaltungen Überblick. Dort sehen wir die Kategorie (in unserem Fall die Art des Banners), die Anzahl der Klicks und den Namen des Banners.
Wir haben gelernt, dass wir die Bannerbilder zuerst in Banner (Gruppen) hochladen müssen, um sie später einem Anzeigemodul wie Banner, Diashow oder Karussell zuzuordnen. Später haben wir die Modulvorlagendateien geändert, um Klickereignisse mit Google Analytics zu verfolgen.
Wenn Sie Fragen haben, stellen Sie diese bitte unten im Diskussionsbereich.
Accentsconagua