Animierter Zähler

Step 1

Installing the app

Click "Install" in the Shopify App Store. The app doesn't change your theme's code: it only appears in your store once you add its block in the theme editor. To try it out first, add the block to a copy of your theme and check it in the preview.

In the next step, you will be shown which authorizations the app requires. Agree to the requested authorizations and click on "Install" to continue with the installation of the app.

Once the installation is complete, you will be taken to the start page of the app. The app is also displayed in the menu on the left side. By clicking on the pin symbol to the right of the title, you can pin the app to the navigation bar.

Benötigen Sie Hilfe oder haben Sie Fragen? Wir unterstützen Sie gerne, schreiben Sie uns eine E-Mail.
support@code108.de
Step 2

Setup of the app

In the following we explain how you can set up the app after installation.

Step 1: Activation of the app

As soon as you have installed the app, you can activate the app in the administration in the area "Extensions" > "My extensions" in the "Apps" tab by clicking the controller button to the left of the app name. When the app is active, the slider turns blue.

Schritt 2: Theme kompilieren

Nach der Aktivierung der App sollten Sie Ihr Theme kompilieren. Dies können Sie über die Administration erreichen, indem Sie im linken Seitenmenü der Administration auf den gewünschten Verkaufskanal klicken und dann das Tab „Theme“ aufrufen. Klicken Sie dann auf den Button „Theme ändern“, wählen Sie das gewünschte Theme aus (ggf. auch das gleiche, welches bereits gesetzt war) und speichern Sie Ihre Auswahl durch Klick auf den blauen Button „Theme übernehmen“ und bestätigen Sie die Aktion durch Klick auf den blauen Button „Theme wechseln“. Das Theme sollte dann kompiliert werden. Je nach Cache Einstellung müssen Sie anschließend zudem den Cache leeren (sowohl den Shop Cache als auch ggf. Ihren Browser Cache).

Schritt 3: Hinzufügen über die Erlebniswelten

Um den animierten Zähler zu Ihrem Shop hinzuzufügen, gehen Sie im Backend in den Bereich „Inhalte“ > „Erlebniswelten“ und öffnen Sie die gewünschte Erlebniswelt, in welcher der Zähler erscheinen soll. Anschließend können Sie den „Animierten-Zähler“-Block zur Erlebniswelt über Drag & Drop hinzufügen. Sie finden den Block in der Kategorie „Text“.

Schritt 4: Inhalte festlegen

Wenn Sie mit der Maus über das Element fahren, erscheint ein Icon für die Einstellungen. Durch Klick auf das Einstellungs-Icon können Sie das Element bearbeiten. In den Einstellungen des Elements können Sie den Zähler im Tab „Inhalt“ befüllen. Sie haben die Möglichkeit die Zahlen für die 4 Zähler sowie die Beschriftungen zu setzen. Es sind Zahlen zwischen 1 und 1000000 möglich.

Schritt 5: Weitere Konfiguration des Zählers

In den Einstellungen des Zähler Elements können Sie im Tab „Einstellungen“ die weitere Konfiguration vornehmen. Hier haben Sie die Möglichkeit die Animationsgeschwindigkeit sowie die Darstellung des Zählers festzulegen. Neben vordefinierten Designs und Farbpaletten, können Sie die 4 Zähler auch individuell einfärben. Speichern Sie Ihre gewünschten Einstellungen durch Klick auf den Button „Fertig“. Wenn Sie zufrieden mit den gesetzten Inhalten und den Einstellungen sind, speichern Sie die Erlebniswelt ab und überprüfen Sie, ob die Zähler wie gewünscht im Frontend dargestellt werden.

Schritt 6: Zähler testen

Da es stets vorkommen kann, dass die App unter bestimmten Theme-, App- und Shopkonstellationen nicht richtig funktioniert, sollten Sie anschließend testen, ob der animierte Zähler in Ihrem Shop wie gewünscht funktioniert.

Hinweis
Bitte nutzen Sie die Testversion der App in einer Test-Umgebung Ihres Shops, um sicherzustellen, dass die App in Ihrer Shop-Konfiguration reibungslos funktioniert.
Step 3

Settings

Inhalte

Sie können die Zahl sowie das Label für die Zähler festlegen. Für die Zahl sind Werte im Bereich 1 bis 1000000 möglich.

Anzahl

Wählen Sie aus, ob 1, 2, 3 oder 4 Zähler angezeigt werden sollen.

Animationsgeschwindigkeit

Sie können auswählen, ob die Zähler sehr langsam, langsam, normal, schnell oder sehr schnell hochzählen sollen.

Abweichende Startwerte

Wenn Sie diese Option aktivieren, können Sie abweichende Startwerte für die Zähler angeben. Standardmäßig liegt der Startwert der Zähler bei 1.

Design

Sie haben die Möglichkeit einen vordefinierten Stil für den Zähler auszuwählen oder alternativ individuelle Farben für die 4 Zähler festzulegen.

Hinweis
Bitte nutzen Sie die Testversion der App in einer Test-Umgebung Ihres Shops, um sicherzustellen, dass die App in Ihrer Shop-Konfiguration reibungslos funktioniert.
Animierter Zähler

Frequently asked questions

Warum wird der Zähler im Frontend nicht angezeigt?

Bitte stellen Sie sicher, dass Sie den Zähler auch bei der Erlebniswelt hinzugefügt haben, die auch für die gewünschte Seite bzw. Kategorie aktiv ist.

If you have any questions, please send us a message to support@code108.de.
Shopware 6 apps by CODE 108

You might also like these apps