---
url: 'https://dxpr.com/de/hc/dokumentation/dxpr-builder-lernen/elemente/number-counter'
title: 'Einen Number Counter hinzufügen | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-23T23:54:56+00:00'
updated: '2026-10-24T17:19:22+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: 'Sie erhalten eine Zahl, die hochzählt, wenn Besucher zu ihr scrollen, auf Wunsch mit Präfix, Suffix und Trennzeichen. Nutzen Sie sie, um eine Kennzahl hervorzuheben, zum Beispiel versorgte Patienten oder gelieferte Projekte.'
tags:
  - 'Data and motion'
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T17:19:22+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'Einen Number Counter hinzufügen'
      description: 'Sie erhalten eine Zahl, die hochzählt, wenn Besucher zu ihr scrollen, auf Wunsch mit Präfix, Suffix und Trennzeichen. Nutzen Sie sie, um eine Kennzahl hervorzuheben, zum Beispiel versorgte Patienten oder gelieferte Projekte.'
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-23T23:54:56+0000'
      dateModified: '2026-10-24T17:19:22+0000'
      author:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      mainEntityOfPage: 'https://dxpr.com/de/hc/dokumentation/dxpr-builder-lernen/elemente/number-counter'
      articleSection: 'Daten und Animation'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/de/hc/dokumentation/dxpr-builder-lernen/elemente/number-counter'
      description: 'Sie erhalten eine Zahl, die hochzählt, wenn Besucher zu ihr scrollen, auf Wunsch mit Präfix, Suffix und Trennzeichen. Nutzen Sie sie, um eine Kennzahl hervorzuheben, zum Beispiel versorgte Patienten oder gelieferte Projekte.'
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: Startseite
            item: 'https://dxpr.com/de'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: de
---
[Hilfe-Center](/de/hc)/[Dokumentation](/de/hc/dokumentation) /[DXPR Builder lernen](/de/hc/documentation/learn-dxpr-builder) /[Seiten erstellen](/de/hc/documentation/learn-dxpr-builder/build) /[Inhalte hinzufügen](/de/hc/documentation/learn-dxpr-builder/elements) /[Daten und Animation](/de/hc/documentation/learn-dxpr-builder/elements/data-and-motion) # Einen Number Counter hinzufügen.

 DXPR Builder lernenSeiten erstellenInhalte hinzufügenDaten und Animation

   ## In diesem Leitfaden

 Verwandte Leitfäden

- [Das Aussehen eines Elements im Style-Tab ändern](/de/hc/dokumentation/dxpr-builder-lernen/element-einstellungen/style-tab)

Sie erhalten eine Zahl, die hochzählt, wenn Besucher zu ihr scrollen, auf Wunsch mit Präfix, Suffix und Trennzeichen. Nutzen Sie sie, um eine Kennzahl hervorzuheben, zum Beispiel versorgte Patienten oder gelieferte Projekte.

## Einen Number Counter hinzufügen

Öffnen Sie Ihre Seite im angemeldeten Zustand: Wenn Sie mit der Maus über den Inhaltsbereich fahren, erscheinen die Steuerelemente des Builders. [Ihre erste Seite](/de/hc/dokumentation/dxpr-builder-lernen/erste-schritte/erste-seite) zeigt die Grundlagen.

1. Fahren Sie mit der Maus über die Spalte und klicken Sie in ihrer Steuerleiste auf **+**; klicken Sie auf einer leeren Seite auf **Add Elements**. Öffnen Sie den **Content**-Tab und klicken Sie auf **Number counter**. Der Number Counter landet oben in der Spalte und sein Einstellungsdialog öffnet sich.
2. Geben Sie die **End**-Zahl ein, bis zu der hochgezählt wird, nur in Ziffern. Hier verwenden wir 250000.
3. Fügen Sie ein **Suffix** hinzu, zum Beispiel ein Pluszeichen.
4. Wählen Sie einen **Thousands separator**. Hier wählen wir **Comma**.
5. Stellen Sie die **Speed** in Millisekunden ein. Höhere Werte zählen langsamer. Hier ziehen wir ihn auf etwa 3000, also 3 Sekunden.
6. Klicken Sie im Dialog auf **Speichern**. Klicken Sie dann in der Symbolleiste oben im Inhaltsbereich auf **Speichern**, um die Seite zu speichern.

  ## Was Sie sehen

Die Zahl zählt bis zu der von Ihnen eingegebenen Endzahl hoch, mit Ihrem Suffix und Trennzeichen. Im Video zählt sie in 3 Sekunden bis 250,000+.

Der Zähler läuft einmal, wenn der Counter ins Sichtfeld kommt. Im Editor läuft er direkt nach dem Schließen des Dialogs. Um ihn erneut zu sehen, platzieren Sie den Counter unterhalb des ersten Bildschirms, öffnen Sie die gespeicherte Seite und scrollen Sie zu ihm hinunter. Besucher sehen ihn, sobald Sie die Seite speichern und sie veröffentlicht ist.

## Ihren Number Counter einrichten

Fahren Sie mit der Maus über das Element und öffnen Sie in seiner Steuerleiste **More &gt; Settings**. Optionen:

- **Start:** die Zahl, bei der der Zähler beginnt. Die Vorgabe ist 0.
- **End:** die Zahl, bei der der Zähler stoppt. Die Vorgabe ist 100.
- **Font size:** die Größe der Zahl in Pixeln. Die Vorgabe ist 30.
- **Speed:** wie lange der Zähler braucht, in Millisekunden. Die Vorgabe ist 2000.
- **Thousands separator:** None, Comma, Dot oder Space zwischen Tausendergruppen.
- **Prefix:** Text vor der Zahl, zum Beispiel `$` oder `€`.
- **Suffix:** Text nach der Zahl, zum Beispiel `%` oder `+`.

## Wenn Sie es nicht sehen

- **Der Number Counter ist nicht im Content-Tab.** Ihr Benutzerprofil blendet ihn aus. Bitten Sie die Administration, **Counter** unter **Elements** in [User Profiles](/de/hc/dokumentation/dxpr-builder-lernen/verwaltung/benutzerprofile-verwaltung) anzukreuzen.
- **Es ist nach dem Neuladen verschwunden.** Die Seite wurde nicht gespeichert. Fügen Sie es erneut hinzu und klicken Sie in der Symbolleiste oben im Inhaltsbereich auf **Speichern**.
- **Die Zahl stoppt bei 100.** **End** hat noch den Vorgabewert. Fahren Sie mit der Maus über das Element und öffnen Sie **More &gt; Settings**, und geben Sie dann Ihre eigene Zahl ein.
- **Die Zahl erscheint, aber zählt nicht.** Sie hat bereits gezählt, während sie im Sichtfeld war, vielleicht direkt nach dem Laden der Seite. Preview startet sie nicht erneut. Platzieren Sie den Counter unterhalb des ersten Bildschirms, laden Sie die gespeicherte Seite neu und scrollen Sie zu ihm hinunter.
- **Die Seite zeigt noch die alte Zahl.** Die Änderung wurde nicht gespeichert. Klicken Sie in der Symbolleiste oben im Inhaltsbereich auf **Speichern** und laden Sie dann neu.

## Wie geht es weiter?

[Style-Tab](/de/hc/dokumentation/dxpr-builder-lernen/element-einstellungen/style-tab), um Abstände und Hintergrund Ihres Number Counters zu ändern.