Individuelle Promotion Banner für Angebote, Nachrichten oder Hinweise

Über die Erweiterung

Kontakt & Support

Treten Sie bei Fragen oder Anregungen einfach mit uns über die E-Mail shopware.support@digitalwert.de in Kontakt und wir helfen Ihnen gern weiter. Eine Anleitung zum Plugin finden Sie unter: https://shopwaredemo.digitalwert.de/media/pdf/2d/8b/bd/Anleitung_PromotionBanner.pdf (Link zur Anleitung).

Beschreibung des Plugins

Das Plugin "Individuelle Promotion Banner für Angebote, Nachrichten oder Hinweise" ermöglicht individuelle Promotion Banner für Angebote, Nachrichten, Hinweise und vieles mehr.

Beim Promotion Banner kann die Position, die Seite und der Shop, bei dem der Promotion Banner angezeigt werden soll, ausgewählt werden. Folgende Positionen stehen dabei zur Verfügung:

• unterhalb des body-Tags
• unterhalb des Menüs
• am unteren Bildschirmrand (fixiert)
• im OffCanvas - Menü / der linken Sidebar unterhalb der Kategorien
• in einer Modalbox
• unbestimmt (beispielsweise über ein Auswahlfeld bei einem Artikel, bei einer Kategorie, im Erweiterten Menü, uvm.)

Folgende Seiten stehen derzeit zur Auswahl:

• im gesamten Shop
• Startseite
• Kategorie Listing
• Artikeldetailseite
• Registrierung
• Warenkorb
• Registrierung im Checkout
• Zahlungs- und Versandauswahlseite
• Bestellabschluss
• Bestellbestätigungsseite
• kompletter Checkout
• Bloglisting
• Blogdetailseite
• kompletter Blog
• Landingpage
• Merkzettel
• Shopseiten
• Formulare
• Suchergebnisseite
• Newsletterseite
• Kundenkonto

Des Weiteren kann festgelegt werden, ob der Promotion Banner zuklapp- bzw. ausblendbar sein soll sowie die dazugehörige Cookie - Lebensdauer in Tagen definiert werden. Das Ausblenden eines Promotion Banners wird jeweils in einem eigenen Cookie gespeichert, damit der Kunde den jeweiligen Promotion Banner nicht erneut sieht, wenn er diesen bereits ausgeblendet hat. Innerhalb der Plugin-Konfiguration kann der Name des Cookies für den Cookie-Hinweis eingegeben werden, im Standard ist dies der Shopware - Cookie allowCookie. Seitens des Plugins werden also nur Cookies gesetzt, wenn den Cookie-Richtlinien zugestimmt (Schaltfläche "Einverstanden") und / oder die Erlaubnis für den Cookie im Shopware Consent Tool durch den Kunden gesetzt wurde (die Beschriftung kann über den Textbaustein PromotionbannerCookieLabel angepasst werden). Die Cookie - Gruppe, zu der der Cookie gehören soll, kann dabei innerhalb der Plugin - Konfiguration ausgewählt werden.

Die Hintergrund- und Schriftfarbe des Aufklapp - Icons kann dabei auch individuell je Promotion Banner festgelegt werden.

Insofern der Promotion Banner in einer Modalbox angezeigt werden soll, kann bei dieser auch eine Zeitverzögerung definiert werden. Innerhalb der Plugin - Konfiguration kann zusätzlich die Breite der Modalbox in Pixeln als auch die Hintergrund- und Schriftfarbe des Schließen - Icons der Modalbox festgelegt werden.

Des Weiteren kann für jeden Promotion Banner ein Hintergrund, also ein Hintergrundbild oder eine Hintergrundfarbe (als Hexcode oder rgba - Wert), festgelegt werden. Beim Hintergrundbild kann dabei die Ausrichtung (von links oben bis rechts unten), die Abmessung (cover, contain oder auto) und die Deckkraft (von 0,05 bis 1) definiert werden.

Der Promotion Banner selbst kann beispielsweise aus drei Bereichen bestehen, einem Bereich für eine Prozentzahl (HTML-Code ist möglich), einem Inhaltsbereich (mit Überschrift und Text, HTML-Code ist ebenso möglich) und einem Linkbereich (hier ist ebenfalls HTML-Code möglich). Bei allen drei Bereichen kann jeweils die Hintergrundfarbe (als Hexcode oder rgba - Wert), die Schriftfarbe (als Hexcode oder Farbname), die Inhaltsausrichtung (links, mittig oder rechts), die Inhaltsbreite in Prozent (von 5% bis 100%), der Innenabstand (padding, Einfach- oder Mehrfachwerte) sowie der jeweilige Text festgelegt werden (hier ist ebenso HTML-Code möglich).

Der Link selbst kann auch unterhalb des Inhaltsbereichs platziert werden sowie sich um den ganzen Promotion Banner erstrecken. Des Weiteren kann der Link auch auf eine JavaScript - Funktion verweisen beziehungsweise verlinken. Zusätzlich hat man auch die Möglichkeit, den Link mit transparenten Hintergrund anzuzeigen, die Rahmenfarbe (als Hexcode oder rgba - Wert) zu definieren und eine individuelle CSS - Klasse für den Link festzulegen (beispielsweise is--primary oder is--secondary).

Ebenso kann man für den Promotion Banner das Anzeigedatum (im englischen Datumsformat "yyyy-mm-dd") festlegen, also in welchem Zeitraum der jeweilige Promotion Banner angezeigt werden soll sowie die Auflösungen auswählen, in denen der Promotion Banner ausgeblendet werden soll.

Durch die Einbindung der Promotion Banner über ein eigenes Action - Widget können Sie an beliebiger Stelle im Shop angezeigt werden.

Hinweise zum Plugin

(1). Entwickelt nach dem neuen Pluginsystem ab Shopware 5.2.

(2). Kompatibel mit PHP 7.

(3). 30 Tage unverbindlich testen: mit der Testversion können Sie das Plugin 30 Tage kostenfrei und in vollem Umfang direkt in Ihrem Shop einsetzen.

(4). Kompatible Themes: dieses Plugin ist zu dem Responsiven Theme von Shopware und zu Themes, die von diesem abgeleitet werden, kompatibel. Bei der Nutzung eines Drittanbieter - Themes, das über den Shopware Store erworben wurde, kann der ordnungsgemäße Einsatz des Plugins wie bei jedem anderen Shopware - Plugin nicht garantiert werden. 

(5). Subshop-Fähigkeit: das Plugin ist subshopfähig und kann je Subshop aktiviert werden. 

(6). Unverschlüsselt: das Plugin wird komplett quelloffen bereitgestellt, Sie benötigen also auch nicht den Lizenz Manager von Shopware und es kann somit problemlos ohne den iOnCube Loader genutzt werden.

(7). Eigene Shopware - Blöcke: das Plugin stellt eigene Shopware – Blöcke bereit, um das Plugin updatesicher im eigenen Theme anpassen oder erweitern zu können. Die Namen der entsprechenden eigenen Shopware - Blöcke finden Sie in der Anleitung: https://shopwaredemo.digitalwert.de/media/pdf/2d/8b/bd/Anleitung_PromotionBanner.pdf .

Konfigurationsbeispiele

1. unterhalb des body – Tags (beispielsweise "Newsletter abonnieren") [Screenshot 1]:

Allgemeine Einstellungen

• aktiv: ja
• Promotionbanner ist dauerhaft zuklapp- und ausblendbar: ja
• Hintergrundfarbe des Aufklapp - Icons (Hexcode): #000000
• Schriftfarbe des Aufklapp - Icons (Hexcode): #FFFFFF
• Position des Promotionbanners: 0 - unterhalb des body-Tags
• Anzeigen im Shop (Pflichtfeld): Demoshop
• Anzeigen auf folgender Seite: 1 – Startseite

Allgemeine Einstellungen - Hintergrund

• Hintergrundbild: Hintergrund auswählen
• Ausrichtung des Hintergrundbildes: 4 – mittig mittig
• Deckkraft des Hintergrundbildes: 3 - 85% (0.85)

Allgemeine Einstellungen - Inhaltsbereich

• Innenabstand (padding), z. B. "10px": 40px 10px 40px 10px
• Schriftfarbe der Überschrift (Hexcode): #000000
• Inhaltsausrichtung der Überschrift: 1 – mittig
• Inhaltsbreite der Überschrift: 19 - 85%
• Überschrift: NEWSLETTER ABONNIEREN!
• Schriftfarbe des Textes (Hexcode): #000000
• Inhaltsausrichtung des Textes: 1 - mittig
• Inhaltsbreite des Textes: 19 - 85%
• Text: Jetzt den 10% Willkommensgutschein erhalten!

Allgemeine Einstellungen - Linkbereich

• Innenabstand (padding), z. B. "10px": 10px
• Ziel des Links: /newsletter
• Individuelle CSS – Klasse für den Link: is--secondary
• Transparenter Hintergrund des Links: Ja
• Schriftfarbe des Links (Hexcode): #000000
• Rahmenfarbe des Links (Hexcode): #000000
• Linktext, wenn eine Schaltfläche genutzt wird: Mehr erfahren
• Inhaltsausrichtung: 2 – rechts
• Inhaltsbreite: 3 - 15%

2. unterhalb des body – Tags (beispielsweise eine Hinweismeldung zum Osterurlaub) [Screenshot 2]

Allgemeine Einstellungen

• aktiv: ja
• Hintergrundfarbe des Aufklapp - Icons (Hexcode): #000000
• Position des Promotionbanners: 0 - unterhalb des body-Tags
• Anzeigen im Shop (Pflichtfeld): Demoshop
• Anzeigen auf folgender Seite: 1 – Startseite

Allgemeine Einstellungen - Hintergrund

• Hintergrundfarbe: #FFFFFF

Allgemeine Einstellungen - Prozentzahlbereichs

• Hintergrundfarbe des Prozentzahlbereichs (Hexcode): #4AA3DF
• Schriftfarbe des Prozentzahlbereichs (Hexcode): #FFFFFF
• Inhaltsausrichtung: 2 – rechts
• Inhaltsbreite: 2 - 10%
• Text der Prozentzahl:

Allgemeine Einstellungen - Inhaltsbereich

• Hintergrundfarbe des Imhaltsbereichs (Hexcode): #E9F2F8
• Innenabstand (padding), z. B. "10px": 15px 10px 15px 10px
• Schriftfarbe der Überschrift (Hexcode): #217DBB
• Inhaltsbreite der Überschrift: 22 - 100%
• Überschrift: Urlaub:
• Schriftfarbe des Textes (Hexcode): #217DBB
• Inhaltsbreite des Textes: 22 - 100%
• Text: Wir befinden uns vom 20.04.2019 bis zum 22.04.2019 im Osterurlaub und können in diesem Zeitraum eingehende Bestellungen erst nach unserer Rückkehr bearbeiten. Wir danken für Ihr Verständnis.

3. unterhalb des Menüs (beispielsweise "Happ Women's Day 2019") [Screenshot 3]

Allgemeine Einstellungen

• aktiv: ja
• Promotionbanner ist dauerhaft zuklapp- und ausblendbar: ja
• Aufklapp - Icon beim zugeklappten und ausgeblendeten Promotionbanner ausblenden: ja
• Hintergrundfarbe des Aufklapp - Icons (Hexcode): #D25285
• Schriftfarbe des Aufklapp - Icons (Hexcode): #FFFFFF
• Position des Promotionbanners: 1 - unterhalb des Menüs
• Anzeigen im Shop (Pflichtfeld): Demoshop
• Anzeigen auf folgender Seite: 1 – Startseite

Allgemeine Einstellungen - Hintergrund

• Hintergrundfarbe: #D25285

Allgemeine Einstellungen - Inhaltsbereich

• Innenabstand (padding), z. B. "10px": 20px
• Schriftfarbe der Überschrift (Hexcode): #FFFFFF
• Inhaltsausrichtung der Überschrift: 1 - mittig
• Inhaltsbreite der Überschrift: 22 - 100%
• Überschrift: HAPPY WOMEN'S DAY: 20% Rabatt* | CODE: WOMEN19
• Schriftfarbe des Textes (Hexcode): #217DBB

4. am unteren Bildschirmrand (fixiert) (beispielsweise "Spotlight Deals") [Screenshot 4]

Allgemeine Einstellungen

• aktiv: ja
• Promotionbanner ist dauerhaft zuklapp- und ausblendbar: ja
• Hintergrundfarbe des Aufklapp - Icons (Hexcode): #99FFCC
• Position des Promotionbanners: 2 - am unteren Bildschirmrand (fixiert)
• Anzeigen im Shop (Pflichtfeld): Demoshop
• Anzeigen auf folgender Seite: 1 – Startseite

Allgemeine Einstellungen - Hintergrund

• Hintergrundfarbe: transparent

Allgemeine Einstellungen - Prozentzahlbereichs

• Hintergrundfarbe des Prozentzahlbereichs (Hexcode): #99FFCC
• Schriftfarbe des Prozentzahlbereichs (Hexcode): #000000
• Inhaltsausrichtung: 2 – rechts
• Inhaltsbreite: 1 - 5%
• Text der Prozentzahl: 50%

Allgemeine Einstellungen - Inhaltsbereich

• Hintergrundfarbe des Imhaltsbereichs (Hexcode): #FFFFFF
• Innenabstand (padding), z. B. "10px": 10px
• Schriftfarbe der Überschrift (Hexcode): #000000
• Inhaltsausrichtung der Überschrift: 1 - mittig
• Inhaltsbreite der Überschrift: 18 - 80%
• Überschrift: SPOTLIGHT DEALS
• Schriftfarbe des Textes (Hexcode): #000000
• Inhaltsausrichtung der Textes: 1 - mittig
• Inhaltsbreite des Textes: 18 - 80%
• Text: TOP-Marken um bis zu 50% reduziert

Allgemeine Einstellungen - Linkbereich

• Hintergrundfarbe des Linkbereichs (Hexcode): #FFFFFF
• Innenabstand (padding), z. B. "10px": 10px
• Ziel des Links: /newsletter
• Individuelle CSS – Klasse für den Link: is--secondary
• Transparenter Hintergrund des Links: Ja
• Schriftfarbe des Links (Hexcode): #000000
• Rahmenfarbe des Links (Hexcode): #000000
• Linktext, wenn eine Schaltfläche genutzt wird: Mehr erfahren
• Inhaltsausrichtung: 2 – rechts
• Inhaltsbreite: 3 - 15%

5. in einer Modalbox (beispielsweise "Mega sparen") [Screenshot 5]

Allgemeine Einstellungen

• aktiv: ja
• Promotionbanner ist dauerhaft zuklapp- und ausblendbar: ja
• Position des Promotionbanners: 4 - in einer Modalbox
• Anzeigen im Shop (Pflichtfeld): Demoshop
• Anzeigen auf folgender Seite: 1 – Startseite
• Zeitverzögerung der Modalbox in Sekunden: 5

Allgemeine Einstellungen - Inhaltsbereich

• Hintergrundfarbe des Inhaltsbereichs (Hexcode): #DF0238
• Innenabstand (padding), z. B. "10px": 15px 0 5px 0
• Schriftfarbe der Überschrift (Hexcode): #FFFFFF
• Inhaltsausrichtung der Überschrift: 1 – mittig
• Inhaltsbreite der Überschrift: 22 - 100%
• Überschrift: MEGA SPAREN
• Schriftfarbe des Textes (Hexcode): #FFFFFF
• Inhaltsausrichtung des Textes: 1 - mittig
• Inhaltsbreite des Textes: 22 - 100%
• Text: Gratis-Artikel bei vielen Produkten

Allgemeine Einstellungen - Linkbereich

• Link unterhalb des Inhaltsbereichs: ja
• Hintergrundfarbe des Linkbereichs (Hexcode): #e9f2f8
• Innenabstand (padding), z. B. "10px": 15px
• Ziel des Links: /newsletter
• Individuelle CSS – Klasse für den Link: is--secondary
• Transparenter Hintergrund des Links: Ja
• Schriftfarbe des Links (Hexcode): #FFFFFF
• Rahmenfarbe des Links (Hexcode): #FFFFFF
• Linktext, wenn eine Schaltfläche genutzt wird: Mehr erfahren
• Inhaltsausrichtung: 1 – mittig
• Inhaltsbreite: 5 - 25%

6. im OffCanvas - Menü / der linken Sidebar unterhalb der Kategorien (beispielsweise "Newsletter Abonnieren") [Screenshot 7]

Allgemeine Einstellungen

• Position des Promotionbanners: 3 - im OffCanvas - Menü / der linken Sidebar unterhalb der Kategorien
• Anzeigen im Shop (Pflichtfeld): Demoshop

Allgemeine Einstellungen - Prozentzahlbereichs

• Hintergrundfarbe des Prozentzahlbereichs (Hexcode): #FFDB73
• Schriftfarbe des Prozentzahlbereichs (Hexcode): #000000
• Inhaltsausrichtung: 1 - mittig
• Inhaltsbreite: 4 - 20%
• Text der Prozentzahl: 10%

Allgemeine Einstellungen - Inhaltsbereich

• Innenabstand (padding), z. B. "10px": 10px
• Schriftfarbe der Überschrift (Hexcode): #000000
• Inhaltsausrichtung der Überschrift: 0 - links
• Inhaltsbreite der Überschrift: 22 - 100%
• Überschrift: NEWSLETTER ABONNIEREN!
• Schriftfarbe des Textes (Hexcode): #000000
• Inhaltsbreite des Textes: 22 - 100%
• Text: Jetzt den 10% Willkommens-gutschein erhalten!

Allgemeine Einstellungen - Linkbereich

• Promotionbanner komplett verlinken: ja
• Ziel des Links: /newsletter