Cloud / Self-hosted
Du kannst Shopware in der Cloud oder als self-hosted Variante für deinen Shop einsetzen. Hier erkennst du direkt, in welcher du diese App nutzen kannst.
Diese App kann nicht in einem Shopware Cloud Shop verwendet werden. Cloud Self-hosted
Shopware 6 Status
Support
- Support durch: Zenit Design
- Support Sprachen:
Details
- Artikel-Nr.: zenit56559768828m
- Extension Partner: Zenit Design
- Version: 2.2.1
- Letztes Update: 03.05.2022
- Sprachunterstützung:
- Self-hosted Kompatibilität: 5.3.0 – 5.3.75.4.0 – 5.4.65.5.0 – 5.5.105.6.0 – 5.6.105.7.0 – 5.7.19
Produktinformationen
Highlights
- Einkaufswelten Element → einfach zu verwenden
- inkl. installierbarer Vorlage → inkl. Einkaufsweltenvorlage der Demo
- Alle Einkaufswelten Modi werden unterstützt → Fluid, Resize & Zeilen Modus
- Echter Parallax Effekt → gegenläufiges Scrollen, Parallax Verschiebung beim Scrollen
- Text Slider → Text auf Bild als animierter Slider
Features
- Bis zu 3 Bild-Ebenen
- Geschwindigkeit und Richtung pro Ebene
- Vertikaler Offset pro Ebene
- Viele Gestaltungsmöglichkeiten
Beschreibung
Einkaufswelt Parallax Text Slider Banner
Einkaufswelten Element
Mit dem Parallax Text SLider Banner kannst Du den beeindruckenden Parallax-Effekt mit einem Text Slider kombinieren. Beim Parallax-Effekt werden verschiedene Bilder auf unterschiedlichen Ebenen positioniert. Beim Herunterscrollen werden die Ebenen in unterschiedlicher Geschwindigkeit und Richtung zueinander bewegt. Dadurch entsteht ein Effekt von Räumlichkeit und Bewegung. Es können bis zu drei Bild-Ebenen und eine Text-Ebene eingestellt werden.
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
- inkl. Einkaufsweltenvorlage der Demo
- Echter Parallax Effekt
- Bis zu 3 Bild-Ebenen
- Geschwindigkeit und Richtung pro Ebene
- Vertikaler Offset pro Ebene
- Text Slider
Parallax Verschiebung beim Scrollen
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
✓ 3 Ebenen ✓ Echter Parallax Effekt ✓ Viele Gestaltungsmöglichkeiten ✓ inkl. Einkaufswelt Vorlage
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
Parallax Banner
Der Parallax Effekt gehört zu den beliebtesten Effekten im Webdesign. Technisch gesehen lässt dieser Effekt das Hintergrundbild mit einer geringeren Geschwindigkeit im Vergleich zu dem Vordergrundbild bewegen, wenn man die Seite nach unten scrollt. Durch diesen Effekt entsteht ein Gefühl von Tiefe und Dynamik.
Parallax Verstehen
Beim Parallax-Effekt wird das Bild an einer festen Position im Browserfenster fixiert und erweckt dadurch beim Scrollen den Anschein, dass die Inhalte oder Bilder in den Ebenen darüber über das Hintergrundbild geschoben werden. (background-attachment: fixed) ist daher die Basis für den Parallax Effekt.
Zusätzlich werden die fixierten Bilder und Ebenen mit Javascript beim Scrollen nach oben oder unten bewegt (Konfiguration: Geschwindigkeit). So können die Bilder in unterschiedlicher Richtung aneinander vorbeigeschoben werden, wie die Schuhe in unserer Demo.
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
Hinweise
background-attachment: fixed ist relativ zum Viewport. Das bedeutet, dass sich die Größe des Bildes nach dem Browser-Fenster richtet und nicht nach der Größe des Einkaufswelten Elements im Raster.
- Der Effekt eignet sich besonders für vollflächige Einkaufswelten.
- Es können mehrschichtige, aber auch einfachere Banner Elemente mit nur einem Bild erzeugt werden. Es besteht kein Zwang mehrere Bilder und Ebenen zu verwenden.
- Der Einkaufswelten Modus Fluid eignet sich am besten für diesen Effekt.
- Der Einkaufswelten Modus Resize lässt aus technischen Gründen keine fixierte Positionierung von Bilder zu. Die Bilder beziehen sich in Ihrer Größe daher nicht auf den Viewport des Browsers, sondern auf die Größe des Einkaufswelten-Elements.
Interessant: Kleinere und nebeneinanderliegende Parallax-Banner sind möglich. Die einzelnen Bilder lassen sich beim Scrollen durch die Konfiguration Geschwindigkeit beim Mitscrollen beschleunigen oder bremsen. - Die über Bild 1 (Hintergrundbild) liegenden Bilder sollten Bilder mit transparentem Hintergrund sein - Dateiformate hierzu wären *.png oder *.gif
Hilfreich:Verwende die Einkaufswelten Vorlage um einen Banner zu erstellen.
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
Dokumentation
https://docs-sw5-parallaxbanner.zenit.design— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
› Wir helfen Dir!
kurzfristig und kostenlos
FAQ & Support: www.zenit.design Kundenbewertungen
Als Besitzer dieser App kannst du diese im Shopware Account bewerten
Jetzt im Account bewertenDurchschnittliche Kundenbewertung aus 4 Bewertungen:
Nur zu empfehlen - Support spitze
Ich habe absolut keine Kritikpunkte, außer dass es nicht noch mehr Erweiterungen gibt. :)
Mehr geht nicht - P E R F E K T E R S E R V I C E *****
Man denkt oft "Mehr geht nicht"... Ich wurde so eben eines besseren belehrt. Eine Fehlersuche und eine Problembehebung so wie die Ankündigung eine Aktualisierung im Plugin vorzunehmen ist das eine. Die Umsetzung innerhalb von 3 Stunden vorzunehmen, so daß nicht nur das Problem behoben ist und das Plugin eine zusätzliche Aufwertung von 100% erhält, das habe ich so noch nie erlebt. Wir betreiben 3 eigenständige Shops mit bis zu 150 Pluginlizenzen pro Shop und haben daher sehr viel Kontakt mit Herstellern und haben schon so manches erlebt. Dieses Team aber spricht die Sprache der Kunden! Von uns gibt es daher 5 ***** - Danke!
Wow-Effekt
Danke für das tolle Plugin. Hat mir sehr dabei geholfen eine Startseite mit Wow-Effekt zu designen.
Cooler Effekt!
Der Parallax Banner sieht echt schick aus und lässt sich auch sehr gut und einfach erstellen. Man kann einfache Parallax Banner, aber auch vielschichtigere Banner erstellen auf denen sich mehrere Ebenen auf einmal verschieben.
Konfigurationsanleitung
Installation des Plugins
Installiere das Plugin über den gewohnten Weg mit Hilfe des Plugin-Managers. Dazu sind nur sehr wenige Schritte notwendig:
- Öffne den Plugin-Manager unter Einstellungen > Plugin-Manager
- Unter Käufe erscheint nun das gekaufte Plugin
- Plugin nach Anweisung installieren und aktivieren
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
Tipp
Wir empfehlen, nach der Installation das Backend neu zu laden.
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
Dokumentation
https://docs-sw5-parallaxbanner.zenit.design
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
Einrichtung
Starte mit der Vorlage um einen einfacheren Einstieg in den Parallax Effekt zu bekommen. Der Effekt lässt sich im "Fluid" Modus der Einkaufswelten am besten darstellen.
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
Einkaufswelten Element verwenden
Navigiere im Backend unter Marketing > Einkaufswelten. Erstelle hier eine neue Einkaufswelte oder verwende eine bestehende Einkaufswelt. Beim Bearbeiten der Einkaufswelten steht Dir nun im Reiter "Elemente" das installierte Einkaufswelten-Element zur verfügung.
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
Kompilieren
In einigen Fällen gibt es Einstellungen in der Plugin-Konfiguration, welche erst durch eine erneute Kompilierung des Themes aktualisiert werden. Das ist notwendig, damit die LESS Dateien des Plugins mit dem Theme zusammengefasst werden. Erst danach sind die Änderungen am Aussehen zu sehen.
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
› Wir helfen Dir!
kurzfristig und kostenlos
FAQ & Support: www.zenit.design — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
Änderungen
Version 2.2.1
- Bugfix: Löst ein Darstellungsproblem bei der Verwendung des Resize-Modus.
Version 2.2.0
- Feature: Neues Konfigurations-Feld zur Steuerung der Text-Slider Schriftgröße;
- Optimierung: Verbesserte Berechnung des Offset Top Wertes des Parallax Elements;
- Optimierung: Aktualisierung des bxSliders auf Version 4.2.14;
- Optimierung: Verbesserung des Text Sliders bei Einkaufswelten im Resize Modus;
Version 2.1.0
- Shopware 5.7 Kompatibilität
Version 2.0.0
- Optimierung: Übersetzbarkeit von Einstellungen wurde hinzugefügt
Version 1.4.1
- Optimierung: Verbesserung der Initialisierung des Javascripts bei der Anzeige mehrerer und ausgeblendeter Einkaufswelten, da die Ladereihenfolge beim Nachladen mit Ajax entscheidend ist.;
Version 1.4.0
- Optimierung: Verbesserung der Initialisierung des Javascripts bei der Anzeige mehrerer Einkaufswelten, da die Ladereihenfolge beim Nachladen mit Ajax entscheidend ist. Da Plugin arbeitet nun zuverlässiger;
- Optimierung: Anpassung der Beschleunigung / Positionierung durch Einbeziehen des Einkaufswelten Offsets nach oben. Dadurch müssen voran liegende Einkaufswelten nicht mehr im Offset der Elemente berücksichtigt werden.;
- Achtung: Nach dem Update kann eine Anpassung der Offset-Y Konfiguration der Bilder in den Einkaufswelten Elementen erforderlich sein. Der Offsetwert bezieht sich nun auf den Bereich der Einkaufswelt und nicht mehr auf den Bereich der gesamten Seite. Dadurch wird es prinzipiell einfacher, den Offset-Wert festzulegen.;
Version 1.3.0
- Kompatibilität: Anpassungen für die Funktion "Nachladen der Einkaufswelten deaktivieren" - ajaxEmotionLoading - SW 5.6;
Version 1.2.3
- Optimierung: Optimiert den Subscribe auf die geladenen Einkaufswelten (plugin/swEmotionLoader/onLoadEmotionFinished);
Version 1.2.2
- Optimierung: Optimiert das initiale Laden des Sliders bei zusätzlichen externen Schriften.
Version 1.2.1
- Bugfix: background-attachment: fixed für mobile Geräte (iOS, Android) auf background-attachment: scroll geändert, da dies auf mobilen Geräten zu unvorhergesehenen Darstellungen der Bilder führt. Insbesondere in Kombination mit background-size: cover führt dies zu Problemen in der Darstellung. Mehr Informationen unter: https://caniuse.com/#search=background-attachment
Version 1.2.0
- Feature: Shopware 5.5 Kompatibilität
- Feature: Dieses Plugin ist nun quelloffen und verzichtet auf die Verschlüsselung mittels der Codierungs-Software ionCube.
- Feature: Kompatibilität mit PHP Version > 7.0.0 durch den Verzicht auf die ionCube Veschlüsselung.
Version 1.1.0
- Anpassung der Kompatibilität für SW 5.5
- ComponentHandler hinzugefügt
Version 1.0.1
- Javascript Plugin für Parallax Effekt für Smartphone Portrait initialisiert
Version 1.0.0
Initial Release - ErstveröffentlichungInfos zum Extension Partner
Zenit Design Shopware Premium Extension Partner 47 Erweiterungen 5 Ø-BewertungAktuelle Version:
Monatlich kündbar
Gratis Probemonat
Diese App startet mit einem kostenlosen Probemonat. Die Miete kann jederzeit monatlich gekündigt werden oder wird zu den angegebenen Preisen automatisch verlängert.Updates und Support