Dieser Artikel zeigt dir, wie du das Number Counter Widget verwenden kannst, um deine wichtigsten Kennzahlen auf eine auffällige, animierte Weise hervorzuheben! Von Umsatzmeilensteinen über zufriedene Kunden bis hin zu Social-Proof-Statistiken – der Number Counter verwandelt einfache Zahlen in dynamische Visuals, die Aufmerksamkeit erzeugen und deine Markenbotschaft verstärken.
INHALTSVERZEICHNIS
Was ist das Number Counter Widget?
Wichtige Vorteile des Number Counter Widgets
Wie man das Number Counter Widget zu einer Website oder einem Funnel hinzufügt
Konfiguration jeder Kennzahl (Einstellungswerte)
Styling des Number Counter Widgets (Layout anpassen)
Wichtige Hinweise
Häufig gestellte Fragen
Verwandte Artikel
Was ist das Number Counter Widget?
Das Number Counter Widget ist ein natives Element im Funnels- & Websites-Builder, das numerische Werte in lebendige Hochzähl-Animationen verwandelt. Durch die Kombination von intelligenter Formatierung, anpassbaren Layout-Steuerungen und Scroll-Triggern kannst du wichtige Erfolge auf eine Weise präsentieren, die sowohl visuell ansprechend als auch markenkonform ist.
Wichtige Vorteile des Number Counter Widgets
Animierte Zahlen dekorieren nicht nur die Seite – sie helfen, Aufmerksamkeit zu erzeugen und sofort Glaubwürdigkeit zu vermitteln. Gründe, warum dieses Widget so wirkungsvoll ist:
Mehrere Counter: Zeige viele Kennzahlen in einem einzigen Element, um deine wichtigsten Metriken visuell hervorzuheben
Intelligente Zahlenformatierung: Große Zahlen werden automatisch mit K, M, B oder T abgekürzt, um sofortige Übersicht zu gewährleisten
Prefix- & Suffix-Felder: Füge $, €, %, + oder beliebigen eigenen Text vor oder nach den Werten hinzu
Counter-spezifische Bilder: Kombiniere jede Zahl mit einem Icon, Abzeichen oder Logo, um die Aussagekraft zu verstärken
Layout-Präzision: Steuere das Layout der Spalten und justiere Abstände für pixelgenaue Ausrichtung auf allen Geräten
Vollständige Styling-Steuerung: Passe Farben, Ränder, Schatten und Typografie an, um jede Marke zu repräsentieren
Wie man das Number Counter Widget zu einer Website oder einem Funnel hinzufügt
Füge das Widget schnell zu jeder Funnel- oder Website-Seite hinzu:
Navigiere zu Sites → Funnels oder Sites → Websites
Klicke auf den blauen Edit-Button der gewünschten Seite oder des Schrittes
Wähle + Add Element in der Sidebar und finde das Number Counter-Element
Ziehe den Number Counter an die gewünschte Position im Layout
Konfiguration jeder Kennzahl (Einstellungswerte)
Nachdem das Widget auf deiner Seite ist, kannst du jede Kennzahl anpassen:
Counter hinzufügen/entfernen: Klicke auf Add Counter, um neue Kennzahlen zu erstellen, oder auf das Mülltonnen-Symbol, um eine zu löschen
Beschriftung (Caption): Füge ein Label wie „Total Sales“ hinzu, damit Besucher verstehen, was die Zahl darstellt
Bild: Lade ein PNG, JPEG oder SVG-Icon hoch und passe die Größe über den Slider an
Start- & Endwerte: Definiere, bei welchem Wert die Animation beginnt (z. B. 0) und endet (z. B. 10 000)
Prefix/Suffix: Füge Kontext mit $, €, %, + oder eigenem Text vor oder nach dem Wert hinzu
Styling des Number Counter Widgets (Layout anpassen)
Nach der Konfiguration kannst du unter Counter Layout Abstände, Farben, Animationsgeschwindigkeit und das Gesamtlayout anpassen:
Bildgröße: Icon-Dimensionen einstellen
Abstand zwischen Countern: Horizontalen Abstand feinjustieren
Anzahl der Spalten: Anzahl der Counters pro Reihe (1–5)
Animationsoptionen: Animationsdauer (1 s–15 s) definieren; Viewport-Trigger, sodass Zahlen erst beim Scrollen animiert werden
Farben: Einzelne Swatches für Zahl, Beschriftung, Hintergrund und Container-Hintergrund; Ränder und Schatten hinzufügen
Wichtige Hinweise
Performance: Halte die Anzahl der Counter ≤ 20 pro Widget für optimale Ladezeiten
Bildformate: Unterstützt PNG, JPEG und SVG
Intelligente Formatierung: Zahlen werden automatisch formatiert (z. B. „2500000“ → „2,5 M“)
Bilder: Optional, pro Counter ein-/ausschaltbar
Animation: Wird nur einmal pro Seitenladevorgang ausgelöst
Häufig gestellte Fragen
F: Kann ich jedem Counter eine andere Farbe geben?
A: Aktuell gelten globale Styles für alle Counter; Hintergrund oder Containerfarbe kann global angepasst werden.
F: Können Counter Dezimalstellen enthalten?
A: Ja, Start- und Endwerte können Dezimalstellen enthalten.
F: Startet die Animation erneut, wenn ich zurück nach oben scrolle?
A: Nein, die Counters animieren einmalig beim ersten Eintritt in den Viewport.
F: Muss ich für jeden Counter ein Bild verwenden?
A: Nein, Bilder sind optional und können nur bei Bedarf hinzugefügt werden.
F: Wie viele Counters kann ich in einem Widget hinzufügen?
A: Technisch unbegrenzt, für beste Performance ≤ 20; mehr kann auf leistungsschwachen Geräten ruckeln.
F: Passen sich die Counters automatisch auf Mobilgeräte an?
A: Ja, Spalteneinstellungen und Abstände reagieren auf Bildschirmgröße, sodass die Counters auf allen Geräten lesbar bleiben.
F: Wie kann ich die Animation während der Bearbeitung erneut abspielen?
A: Im Number Counter-Einstellungsbereich auf Preview Animation klicken, um das Hochzählen erneut zu sehen.
Verwandte Artikel
Sites Overview
Getting Started – Launch A Funnel
Animation Customizations in Funnels & Websites
Wie man Countdown Timers in Funnels verwendet