Erlebniswelten mit CSS-Animationen verschönern

In dieser Anleitung erfährst du, wie du Erlebniswelten mit ThemeWare® CSS-Scroll-Animationen verschönern kannst.

ThemeWare® ab Version 0.3.0 stellt dir eine umfangreiche Auswahl an CSS-Animationen zum Verschönern deiner Erlebniswelten bereit. Nachfolgend erklären wir dir, wie du die "CSS-Scroll-Animationen" in nur 2 Schritten aktivieren und nutzen kannst.

Tipp: Anwendungsbeispiele findest du auf den Startseiten in unseren Demoshops.


ThemeWare® CSS-Scroll-Animationen

1. Animationen aktivieren

  1. Öffne die Administration deins Shops

  2. Wechsel über die Hauptnavigation in den Theme-Manager ("Inhalte" => "Themes") Hinweis: In der Shopware Cloud findest du den Bereich "Themes" direkt in der Hauptnavigation.

  3. Öffne die Konfiguration deines Themes

  4. Wechsel im Tab "Erlebniswelten" in den Bereich "Alle Typen"

  5. Wähle die gewünschte Animation für CMS-Blöcke bzw. die Überschriften in CMS-Blöcken (optional).

  6. Speicher diese Änderung damit diese in die Storefront übernommen wird

2. Animationen anwenden

  1. Wechsel über die Hauptnavigation in die Erlebniswelt-Verwaltung ("Inhalte" => "Erlebniswelten")

  2. Bearbeite die gewünschte Erlebniswelt

  3. Wähle den gewünschten CMS-Block aus, welchen du animieren möchtest

  4. Öffne den Bereich "Layout" in den Block-Einstellungen am rechten Bildschirmrand

  5. Speicher die Erlebniswelt

Der entsprechende CMS-Block sollte nun mit der gewünschten Animation animiert werden. Wiederhole "Step 2" für alle CMS-Blöcke, die du animieren möchtest.

Sollte die Änderung nicht in der Storefront ankommen, prüfe bitte ob das Theme dem entsprechenden Verkaufskanal zugewiesen wurde. Leere bei Änderungen dieser Art auch unbedingt einmal den gesamten Shopware sowie den Browser-Cache.

Hinweis: Nutze die CSS-Animation nicht in CMS-Seiten die in Pop-ups bzw. Modals angezeigt werden. Dort funktionieren die Animationen nicht.

Last updated

Logo

© 2024 by ThemeWare® | Made with 💙 by TC-Innovations GmbH