JavaScript plugins

Note: This article is work in progress.

ThemeWare® erweitert die Shopware Storefront um ein paar JavaScript-Plugins. Diese Plugins sind für verschiedene Funktionen nötig und werden nur geladen, sofern diese Funktionen konfiguriert bzw. genutzt werden.

ThemeWare® "Ankündigungsbanner" (twtAnnouncementBannerPlugin)

• Dieses Plugin speichert einen Zeitstempelt im "localStorage" (Browser des Besuchers), wenn der ThemeWare® "Ankündigungsbanner" vom Besucher geschlossen wird.

• Der "Ankündigungsbanner" ist dann 12 Stunden lang nicht mehr sichtbar.

• Das Plugin wird nur registriert, wenn der Standard-Cookie-Hinweis von Shopware verwendet wird und das "Ankündigungsbanner" mit "Lässt sich schließen" konfiguriert ist.

• Trigger: data-twt-announcement-banner="closable"

"CookiePermission" (twtCookiePermission)

• Dieses Plugin überschreibt die Funktion "_setBodyPadding" vom JS-Plugin "CookiePermission" von Shopware um das Body-Padding an den konfigurierbaren Cookie-Hinweis anzupassen.

• Das Plugin wird nur registriert, wenn der Standard-Cookie-Hinweis von Shopware verwendet wird.

• Trigger: data-cookie-permission

ThemeWare® "Countdown-Banner" (twtCountdownBannerPlugin)

• Dieses Plugin ist für den Countdown der ThemeWare® CMS "Countdown-Banner" zuständig.

• Das Plugin wird nur registriert, wenn ein "Countdown-Banner" in einer Erlebniswelt genutzt wird.

• Trigger: data-twt-countdown-banner

ThemeWare® "Floating-Widget" (twtFloatingWidget)

• Dieses Plugin ist für das ThemeWare® "Floating-Widget" zuständig.

• Es steuert die Funktion des Öffnen und Schließens und die Darstellung des Overlays.

• Zudem verhindert es, dass das Widget aus dem sichtbaren Bereich herausrutscht, wenn die Größe des Browserfensters geändert wird.

• Das Plugin wird nur registriert, wenn der "Floating-Widget" in der Theme-Konfiguration aktiviert wurde.

• Trigger: id="twt-floating-widget"

ThemeWare® "Full-Width Sticky-Header" (twtFullWidthStickyHeader)

• Dieses Plugin ist für den ThemeWare® "Full-Width Sticky-Header" zuständig.

• Es berechnet und positioniert diverse Header-Elemente.

• Das Plugin wird nur registriert, wenn der "Full-Width Sticky-Header" in der Theme-Konfiguration aktiviert wurde.

• Trigger: data-twt-full-width-sticky-header

ThemeWare® "Parallax-Banner" (twtParallaxBannerPlugin)

• Diese Plugin ist für den "Parallax-Effekt" in CMS-Bannern von ThemeWare® zuständig.

• Der Effekt kann in der Konfiguration der entsprechenden CMS-Elemente aktiviert werden.

• Das Plugin wird nur registriert, wenn ein CMS-Element die Klasse twt-parallax-banner hat.

• Trigger: class*="twt-parallax-banner"

ThemeWare® "CSS-Scroll-Animationen" (twtScrollAnimation)

• Diese Plugin kümmert sich um die "CSS-Scroll-Animationen" für CMS-Blöcke.

• Die CSS-Scroll-Animationen können in der Theme-Konfiguration aktiviert werden.

• Das Plugin wird nur registriert, wenn ein CMS-Block die Klasse twt-cms-animation hat.

• Trigger: class*="twt-cms-animation"

ThemeWare® "Erlebniswelt-Header" (twtShoppingExperiencesHeader)

• Dieses Plugin ist für den ThemeWare® "Erlebniswelt-Header" zuständig.

• Es berechnet und positioniert diverse Header-Elemente damit diese die Erlebniswelt überlagern.

• Das Plugin wird nur registriert, wenn der "Erlebniswelt-Header" und der "Header 1.x" oder "Header 2.x" in der Theme-Konfiguration aktiviert wurden.

• Trigger: data-twt-shopping-experiences-header="true"

• Hinweis: Diese Plugin benötigt derzeit noch jQuery.

ThemeWare® "Slideout-Communities" (twtSlideoutCommunities)

• Dieses Plugin ist für die ThemeWare® "Slideout-Communities" zuständig.

• Es verhindert, dass die Logos aus dem sichtbaren Bereich herausrutschen, wenn die Größe des Browserfensters geändert wird.

• Das Plugin wird nur registriert, wenn die "Slideout-Communities" in der Theme-Konfiguration aktiviert wurden.

• Trigger: id="twt-slideout-communities"

ThemeWare® "Sticky Top-Navigation" (twtStickyMainNavigation)

• Dieses Plugin ist für die ThemeWare® "Sticky Top-Navigation" zuständig.

• Es fixiert die Top-Navigation am oberen Browserrand, wenn die Shopseite nach unten gescrollt wird.

• Das Plugin wird nur registriert, wenn die "Sticky Top-Navigation" und der "Header 1.x" oder "Header 2.x" in der Theme-Konfiguration aktiviert wurden.

• Trigger: data-twt-sticky-header

• Hinweis: Diese Plugin benötigt derzeit noch jQuery.