Loggen Sie sich in die Administration Ihres Shops ein und klicken Sie im linken Seitenmenü auf „Erweiterungen“ > „Store“. Geben Sie dann in das Suchfeld oben den Namen unserer App ein, also in diesem Fall „Interaktives Seitenelement (Cloud)“. Anschließend wird die App in einer Box unter dem Kategorie-Filter im Tab „Apps“ angezeigt. Klicken Sie auf die Box, um auf die detaillierte Beschreibung der App zu gelangen. Klicken Sie in dieser Ansicht rechts oben auf den blauen Button „Erweiterung hinzufügen“. Nach dem Klick erscheint ein Modal, in welchem Sie den Checkboxen zustimmen müssen, damit Sie die Erweiterung durch Klick auf den Button „Füge die Erweiterung kostenlos hinzu“ zu Ihrem Shop hinzufügen können.
Wenn Sie die App erfolgreich über den Store hinzugefügt haben, können Sie diese installieren. Klicken Sie dazu im linken Seitenmenü der Administration des Shops auf „Erweiterungen“ > „Meine Erweiterungen“. Jetzt können Sie die App durch Klick auf den Link „App installieren“ in Ihrem Shop installieren.
Im Folgenden erklären wir Ihnen, wie Sie die App nach der Installation einrichten können.
Sobald Sie die App installiert haben, können Sie die App in der Administration unter „Erweiterungen“ > „Meine Erweiterungen“ im Reiter „Apps“ durch Klick auf den Regler-Button links neben dem App-Namen aktivieren. Wenn die App aktiv ist, wird der Regler blau.
Nach der erfolgreichen Installation und Aktivierung der App können Sie die App-Einstellungen über das Kontext-Menü, den Button mit den 3 Punkten („…“), aufrufen. Klicken Sie hier auf „Konfiguration“, damit die Einstellungsmöglichkeiten der App zu sehen sind. Sie sehen dann verschiedene Einstellungsmöglichkeiten zur Konfiguration des Seitenelements. Sobald Sie die gewünschten Einstellungen für das Seitenelement gesetzt haben, klicken Sie auf „Speichern“, damit die Änderungen übernommen werden.
Nach der Aktivierung der App sollten Sie Ihr Theme kompilieren. Dies können Sie über die Administration erreichen, indem Sie im linken Seitenmenü der Administration auf den gewünschten Verkaufskanal klicken und dann das Tab „Theme“ aufrufen. Klicken Sie dann auf den Button „Theme ändern“, wählen Sie das gewünschte Theme aus (ggf. auch das gleiche, welches bereits gesetzt war) und speichern Sie Ihre Auswahl durch Klick auf den blauen Button „Theme übernehmen“. Bestätigen Sie die Aktion durch Klick auf den blauen Button „Theme wechseln“. Das Theme sollte nun kompiliert werden. Je nach Cache Einstellung müssen Sie anschließend zudem den Cache leeren (sowohl den Shop Cache als auch ggf. Ihren Browser Cache).
Da es stets vorkommen kann, dass die App unter bestimmten Theme-, App- und Shopkonstellationen nicht richtig funktioniert, sollten Sie anschließend testen, ob das interaktive Seitenelement in Ihrem Shop wie gewünscht funktioniert.
Legen Sie fest, ob der Button im Storefront angezeigt werden soll.
Es ist möglich, auszuwählen, an welcher Stelle das Seitenelement auf der Website angezeigt werden soll. Sie können sich zwischen 4 Positionen entscheiden: „Oben links“, „Unten links“, „Oben rechts“ und „Unten rechts“.
Mit dieser Einstellung kann man sich für einer der drei Seitenelement-Funktionen entscheiden. Bei der Option „Einfache Verlinkung“ dient das Seitenelement als einer einfachen Verlinkung zu einer von Ihnen ausgewählten Seite, wenn man auf dem Element klickt. Bei der Option „Off-Canvas“ öffnet sich beim Klicken einen Bereich, welcher den von Ihnen festgelegten Inhalt anzeigt. Bei der Option „Modal“ öffnet sich ein modales Fenster, welches ebenfalls den von Ihnen festgelegten Inhalt zeigt.
Wählen Sie den Buttontyp. Mögliche Buttontypen sind: „Icon“ und „Eigenes Bild“.
Hier kann das Icon (Shopware Icons) auf dem Button gesetzt werden. Damit das Icon auf dem Button erscheint, muss die Einstellung Typ auf „Icon“ gesetzt werden.
Die URL für das Bild, wenn der „Typ“ des Elements auf „Eigenes Bild“ gesetzt ist. Achten Sie darauf, dass das ausgewählte Bild quadratisch ist. Die Breite und Höhe des Bildes sollte nicht größer als 120 Pixel sein.
Die URL, wenn die Funktion des Elements auf „Einfache Verlinkung“ gesetzt ist.
Wählen Sie aus, welche Größe der Button haben soll. Folgende Größen sind möglich: „Klein“ (30px x 30px), „Default“ (40px x 40px), „Groß“ (80px x 80px).
Setzen Sie die Hintergrundfarbe des Buttons fest.
Sie können die Hauptfarbe für das Icon auf dem Button setzen. Damit das Icon auf dem Button erscheint, muss die Einstellung „Typ“ auf „Icon“ gesetzt werden.
Sie können die Sekundärfarbe (Hover) für das Icon auf dem Button setzen. Damit das Icon auf dem Button erscheint, muss die Einstellung „Typ“ auf „Icon“ gesetzt werden.
Man kann Einstellungen für den Radius, die Breite und die Farbe der Umrandung des Buttons vornehmen.
Bei „Off-Canvas“ kann man bestimmen, an welcher Stelle sich der Button in Relation zu dem „Off-Canvas“ Bereich befinden soll. Die möglichen Positionen sind: „Oben“, „Mittig“ und „Unten“.
Legen Sie die Größe des Inhalts im „Off-Canvas“ und im „Modal“ fest.
Legen Sie den Inhalt für den „Modal“ oder „Off-Canvas“ fest. Es ist möglich, eigenes HTML-Code zu verwenden.
Die Hintergrundfarbe für den „Modal“ oder den „Off-Canvas“ Bereich.
Die Farbe des Inhalts im „Modal“ oder im „Off-Canvas“.