Erstellen eines Bild-Mappings

Das Plugin Banner Mapping Advanced greift auf die erstellten Mappings der Einkaufswelten Banner zu. Das Mapping ist eine Standard-Funktion von Shopware und kann in den Einkaufswelten Bannern Elementen erstellt werden.

Navigiere dazu unter Marketing > Einkaufswelten. Hier kannst Du eine bestehende Einkaufswelt bearbeiten oder eine neue Einkaufswelt anlegen. (Weitere Informationen zum Anlegen einer Einkaufswelt findest Du hier: https://community.shopware.com/Einkaufswelten_detail_1852.html#Eine_Einkaufswelt_erstellen)

Nachdem Du eine Einkaufswelt angelegt hast kannst Du ein Banner Element im Raster der Einkaufswelt platzieren. Über die Felder des Elementes kannst Du ein Bild hochladen, welches als Banner genutzt wird.

Im Banner Element kannst Du ein Banner einbinden und entsprechend verlinken, das Link-Ziel definieren, einen Titel vergeben und eine CSS-Klasse auf das Element setzen. Wenn hier ein Banner hochgeladen wird, erscheint dies als Vorschau im unteren Bereich des Elements. Die Vorschau enthält ein 3x3 Raster, dies erfährt Bedeutung, wenn Deine Einkaufswelt den fluiden Effekt nutzt. Der Effekt sieht vor, Elemente immer zu füllen, dazu wird an einigen Stellen auch Bildmaterial abgeschnitten. Über das Setzen des Rasters kann hierzu ein Ausgangpunkt für den Zoom verwendet werden. So wird sichergestellt, dass der wichtigste Inhalt des Bildes stets zu sehen bleibt. Setze diese Einstellung durch Klicken in das entspechende Feld im Raster.

Weiter kann im Banner Element noch die Mapping-Funktion genutzt werden. Dadurch ist es möglich, einzelne Bereiche des Banners zu verlinken und z.B. auf verschiedene Artikeldetailseiten zu verweisen. Per Klick auf Bild-Mapping anlegen: öffnet sich die folgende Ansicht:

Durch Klicken auf den Button "Neues Mapping Anlegen" (A) können beliebig viele Mappings angelegt werden. Diese erscheinen als Liste unterhalb des Bildes (B). Im Folgenden erscheint ein Rechteck (1), welches über die Ziehpunkte verschoben und vergrößert oder verkleinert werden kann:

Hier wird das Banner in Originalgröße angezeigt und Du kannst nun neue Mappings erstellen. Diese kannst Du frei auf dem Banner (1) platzieren und über die dazugehörige Zeile im Mapping (2) verlinken. Hierbei kann der (3) Link-Typ (intern, extern), (4) Titel, sowie (5) "Titel als Tooltipp" konfiguriert werden. Das Mapping verhält sich analog zum Zoom. Es zoomt also dynamisch mit, sodass die Positionen im Bild weiterhin bestehen bleiben.