Klicke im Shopify App Store auf „Installieren“. Die App ändert nichts am Code deines Themes: Sie erscheint erst in deinem Shop, wenn du ihren Block im Theme-Editor einfügst. Möchtest du sie vorher ausprobieren, füge den Block in einer Kopie deines Themes ein und sieh ihn dir in der Vorschau an.
Im nächsten Schritt wird dir angezeigt, welche Berechtigungen die App benötigt. Stimme den angeforderten Berechtigungen zu und klicke auf „Installieren“, um mit der Installation der App fortzufahren.
Nach Abschluss der Installation wirst du auf die Startseite der App geleitet. Ebenso wird dir die App im linken Seitenmenü angezeigt. Durch Klick auf das Stecknadel-Symbol rechts neben dem Titel kannst du die App an die Navigation anpinnen.
Im Folgenden erklären wir dir, wie du die App nach der Installation einrichten kannst.
Klicke in der linken Seitenleiste deines Shop-Admins unter "Advent calendar" auf "Pläne". Auf unserer Plan-Übersicht siehst du die verfügbaren Pläne mit ihren Preisen und Funktionen. Wähle zwischen dem Free Plan, der ideal ist, um die App kennenzulernen, und dem kostenpflichtigen Pro Plan. Der Pro Plan bietet erweiterte Funktionen wie mehrere Kalender, Designs passend zu deinem Shop, illustrierte Türchen-Motive, ein eigenes Hintergrundbild, die Wahl, wie sich die Türchen öffnen, einen Countdown bis zum Start und mehr. Um zu wechseln, klicke auf den Button in der Box des gewünschten Plans. Du wirst zu Shopify weitergeleitet, wo du den Plan bestätigst. Der Pro Plan kann 7 Tage kostenlos getestet werden und wird direkt über Shopify abgerechnet.
Bei der Installation legt die App bereits deinen ersten Adventskalender an. Seine 24 Türchen sind mit Beispielinhalten befüllt. Du findest ihn in der linken Seitenleiste deines Shop-Admins unter "Advent calendar" > "Kalender". Mit dem Pro Plan kannst du dort über die Kachel "Neuer Kalender" weitere Kalender anlegen. Jeder neue Kalender hat 24 Türchen und einen Namen aus "Adventskalender" und der aktuellen Jahreszahl, den du auf der Übersichtsseite des Kalenders unter "Kalendername" jederzeit ändern kannst. Der Name ist nur für dich sichtbar, nicht für deine Kundinnen und Kunden.
Klicke auf ein Türchen, um es zu bearbeiten. Gib jedem Türchen einen Titel und Inhalt, z. B. einen Rabattcode, einen Produkttipp oder eine kleine Überraschung. Den Inhalt kannst du formatieren und mit Links versehen. Speichere das Türchen mit "Speichern" oder "Speichern & zurück zur Übersicht". Mit "Vorheriges" und "Nächstes" springst du direkt zu den benachbarten Türchen.
Klicke auf der Übersichtsseite deines Kalenders auf "Design bearbeiten". Dort wählst du zwischen Türchen-Motiven (illustrierte Sets mit einem eigenen Motiv für jedes Türchen), Hintergrundbildern, Designs passend zu deinem Shop (Stil, Farbpalette und Schrift der Zahlen frei wählbar) und deinem eigenen Bild aus der Shopify-Mediathek. Je nach Design passt du unter "Darstellung" außerdem den Zahlen-Stil, die Farbe des Kreises, die Hintergrundfarbe und die Farbe des Countdowns an, unter "Effekte" den Schneefall. Die Vorschau zeigt sofort, wie dein Kalender aussieht. Klicke auf "Speichern", damit die Änderungen in deinem Shop erscheinen.
Den Türchen-Modus, den Hinweis bei geschlossenen Türchen und den Countdown legst du auf der Übersichtsseite des Kalenders unter "Einstellungen" fest. Diese Änderungen werden sofort gespeichert und automatisch in deinen Shop übernommen.
Klicke in der linken Seitenleiste deines Shop-Admins unter "Advent calendar" auf "Hilfe" und anschließend auf "Theme-Editor öffnen". Der Theme-Editor öffnet sich mit dem Adventskalender-Block, der bereits auf deiner Startseite eingefügt ist.
Alternativ kannst du den Block manuell hinzufügen: Klicke in deinem Shop-Admin in der linken Seitenleiste auf "Onlineshop", wähle dein gewünschtes Theme aus und klicke daneben auf "Anpassen". Wähle in der oberen Leiste über das Dropdown-Menü die Vorlage aus, auf der der Adventskalender erscheinen soll (Startseite, Seite, Produkt, Kategorie, Blog oder Blogbeitrag). Klicke im gewünschten Abschnitt auf "Block hinzufügen" und wähle im Bereich "Apps" den Block "Adventskalender" aus.
Bitte beachte: App-Blöcke benötigen ein Online-Store-2.0-Theme (z. B. Dawn).
Klicke im Theme-Editor in der linken Seitenleiste auf den Adventskalender-Block. Wähle unter "Kalender" den Kalender aus, den du in der App angelegt hast. Speichere deine Einstellungen mit dem Button "Speichern" oben rechts im Theme-Editor.
Da bestimmte Theme-, App- und Shop-Konfigurationen die Funktionalität beeinflussen können, empfehlen wir zu testen, ob der Kalender in deinem Shop wie gewünscht angezeigt wird und funktioniert.
Tipp: In den Block-Einstellungen kannst du unter "Testdatum" ein Datum im Format TT.MM (z. B. 05.12) eingeben. So siehst du im Theme-Editor, wie der Kalender an diesem Tag aussieht. Das Testdatum wirkt nur im Theme-Editor, deine Kundinnen und Kunden sehen immer das echte Datum.
Jedes der 24 Türchen hat einen Titel (bis zu 80 Zeichen) und einen Inhalt (bis zu 5.000 Zeichen), den du formatieren und mit Links versehen kannst. Der Inhalt erscheint in deinem Shop, sobald sich das Türchen öffnet. In der Kalender-Übersicht siehst du auf einen Blick, wie viele Türchen bereits befüllt sind, und kannst zwischen einer Kachel- und einer Tabellenansicht wechseln.
Wähle ein Hintergrundbild für deinen Kalender. Der Free Plan enthält eine Auswahl an Hintergrundbildern, der Pro Plan alle Designs.
Illustrierte Sets mit einem eigenen Motiv für jedes Türchen. Auch das geöffnete Türchen ist passend zum Set gestaltet.
Gezeichnete Türchen, die du an deinen Shop anpasst: Wähle einen Stil, eine Farbpalette und die Schrift der Zahlen. Statt einer Palette kannst du auch eigene Farben verwenden: eine Hauptfarbe und eine Akzentfarbe aus deiner Marke, wahlweise mit dunklem Hintergrund. Die übrigen Farbtöne werden daraus abgeleitet. Im Free Plan kannst du alle Stile und Paletten in der Vorschau ausprobieren.
Verwende ein Bild aus deiner Shopify-Mediathek als Hintergrund, damit der Kalender zu deiner Marke passt.
Bei Hintergrundbildern und deinem eigenen Bild wählst du zwischen einer schlichten Zahl in Weiß ohne Hintergrund und (Pro Plan) einer Zahl mit Kreis. Bei Türchen-Motiven und Designs passend zu deinem Shop sind die Zahlen Teil des Designs.
Lege die Farbe des Kreises hinter den Türchen-Zahlen fest. Die Einstellung erscheint, wenn du den Zahlen-Stil "Zahl mit Kreis" gewählt hast.
Bei Türchen-Motiven und Designs passend zu deinem Shop kannst du die Farbe zwischen und hinter den Türchen ändern oder die Farbe des Designs wiederherstellen.
Lege fest, wie sich die Türchen öffnen: Vergangene Türchen bleiben offen (Standard, auch im Free Plan verfügbar), nur das Türchen des aktuellen Tages lässt sich öffnen, oder alle 24 Türchen lassen sich jederzeit unabhängig vom Datum öffnen. Die Türchen öffnen sich um Mitternacht in der Zeitzone deines Shops.
Klickt jemand auf ein geschlossenes Türchen, erscheint ein Hinweis, wann es sich öffnet oder dass es schon vorbei ist.
Zeigt vor dem 1. Dezember an, wie viele Tage es noch bis zum ersten Türchen sind, und steigert so die Vorfreude. Ist der Countdown aktiv, kannst du unter "Design bearbeiten" > "Darstellung" seine Farbe ändern. Ohne eigene Farbe wird eine zum Design passende Farbe verwendet.
Lässt bei Hintergrundbildern und deinem eigenen Bild Schnee über den Kalender fallen, für winterliche Stimmung. Du findest ihn unter "Design bearbeiten" > "Effekte".
Auf der Übersichtsseite eines Kalenders kannst du ihn mit dem Pro Plan duplizieren, z. B. um eine Variante für einen anderen Markt anzulegen. Beim Löschen wird der Kalender mit allen 24 Türchen endgültig gelöscht und aus deinem Shop entfernt. Das lässt sich nicht rückgängig machen.
Im Theme-Editor kannst du ein Testdatum im Format TT.MM eingeben, um den Kalender so zu sehen, wie er an diesem Tag aussieht. Lass das Feld leer, um das heutige Datum zu verwenden. Das Testdatum ist nur im Theme-Editor sichtbar.