Produktinformationen als Hotspots/Tooltips in Shopware 6

Installation

Sie können das Plugin hier über den Shopware Community Store erwerben. Das Plugin wird wie ein ganz gewöhnliches Plugin installiert. Sollten Sie zum ersten Mal ein Plugin installieren, finden Sie unter dem folgenden Link eine Anleitung zur Installation von Plugins: Installation eines Plugin

Konfigurieren

Sie finden die Konfiguration bei Einstellung > Plugins. Die Übersicht zeigt Ihnen eine Liste der Hotspotseinstellungen für Ihre Darstellung an.

Gestaltung der Hotspots

In der Konfigurieren für die Darstellung der Hotspots stehe Ihnen dabei folgenden Einstellung zur Verfügung:

• Bezeichnung
  Diese Feld dient als interne Bezeichnug für die Hotpot-Einstellung.
• Tooltip anzeigen bei
  Bei welchem Ereignis (Mouseclick oder Mouseover) des Benutzers soll das Tooltip angezeigt werden?
• Class
  Sie können eigene Klassen vergeben damit Sie per Style-Sheet die Hotspots selbst gestalten oder animieren können.

Hotspots verwalten

Die Hotspots werden in der Produktebene verwaltet. Es wird Ihnen ein weiterer Tab "Hotspot" bei der Produktbearbeitung angezeigt, in der Sie die Produktinformationen pflegen können.

Stammdaten

Bevor Sie die eigentlichen Hotspots anlegen können, müssen Sie die Stammdaten pflegen. Dabei tragen Sie folgende Werte ein:

• Hotspot Konfiguration
  Das Verhalten der Hotspots die Sie zuvor konfiguriert haben.
• Bild
  Das Produktbild das Ihnen für die Produktinformationen dient.
• Bühnenbreite und Bühnenhöhe
  Diese Einstellung gibt die Größe der Bühne/Bild vor, das Sie im Storefront darstellen wollen.
• Aktiv
  Wenn die Produktinformationen im Storefront angezeigt werden soll, dann aktivieren Sie das hier.

Hotspots

Nachdem Sie die Stammdaten eingerichtet haben können Sie Ihre Hotspots in der Liste verwalten. Dabei können Sie wie in Shopware gewohnt die Einträge hinzufügen, löschen oder ändern.

Hotspots hinzufügen/bearbeiten

Durch hinzufügen oder bearbeiten (klick auf die Bezeichnung) eines Hotspot, öffnet sich das Bearbeitungsfenster. In diesem Fenster positionieren Sie das Hotspot auf der Bühne und tragen die nötigen Informationen ein. An welcher Position das Tooltip angezeigt wird können bei der "Ausrichtung" festlegen. Durch die Angabe einer Klasse haben Sie per Style-Sheet auch hier die Möglichkeit Einfluss auf die Gestaltung der Produktinformationen zu nehmen. Durch die Angabe der Klasse "dark" z.B. können Sie die Hintergrundfarbe des Tooltips in einen dunklen Grauton anzeigen. Soll die Funktionalität eines Hotspot erhalten bleiben, aber der Spot nicht sichtbar sein, dann können Sie das Verhalten mit "Sichtbar" beeinflussen. Jeder einzelne Hotspot kann aktiviert werden, damit dieser auf der Bühne angezeigt wird.