header-logo
GrundlagenErfahre, wie du Wix für den Aufbau deiner Website und deines Unternehmens nutzen kannst
Deine Website erstellenGestalte und verwalte deine Website mit Wix.
Konto und AbrechnungVerwalte Premiumpakete, Abos und Rechnungen
Wix Mobile AppsFühre dein Unternehmen und vernetze dich mit Mitgliedern.
DomainsKaufe, verknüpfe oder übertrage eine Domain.
Dein Unternehmen verwaltenStärke dein Unternehmen und deine Webpräsenz.
Werbung für deine WebsiteSteigere deine Sichtbarkeit mit SEO und Marketing.
Studio, Partner von Wix & EnterpriseNutze erweiterte Funktionen für mehr Effizienz.
Du benötigst weitere Hilfe?Finde Lösungen oder kontaktiere uns.
placeholder-preview-image
Wix LearnVerbessere deine Kenntnisse mit unseren Tutorials.
Wix BlogErhalte Tipps für Webdesign, Marketing und mehr.
SEO Learning HubErfahre, wie du den organischen Traffic steigerst.
Website developmentErstelle eine Website mit unserer Full-Stack-Plattform.
Engagiere einen ProfiFinde einen Spezialisten, der dir hilft, deine Ziele zu erreichen.
placeholder-preview-image
  1. Start
  2. Deine Website erstellen
  3. Funktionen für Fortgeschrittene
  4. CMS (ehem. Content-Verwaltung)
  5. Eingabeelemente mit dem CMS verknüpfen
  6. CMS: Einen Fortschrittsbalken hinzufügen und einrichten

CMS: Einen Fortschrittsbalken hinzufügen und einrichten

8 Min.
Füge einen Fortschrittsbalken hinzu, um den Fortschritt beim Erreichen eines Ziels visuell darzustellen. Du kannst Velo-Codierung oder ein CMS-Sammlungsfeld verwenden, um den Fortschrittswert darzustellen. Für den Zielwert kannst du einen statischen Wert festlegen, der sich nicht ändert, oder einen dynamischen Wert mit Velo festlegen oder ein Sammlungsfeld verknüpfen.
Screenshot eines beispielhaften Fortschrittsbalkens.
Beispiele für die Verwendung von Fortschrittsbalken:
  • Anzeigen, wie viele Aufgaben auf einer To-Do-Liste als „erledigt“ markiert sind
  • Prozentsatz der Schritte anzeigen, die während eines Onboarding-Prozesses abgeschlossen wurden
  • Betrag anzeigen, der für ein Spendenziel gesammelt wurde
  • Anzahl der Personen anzeigen, die eine Petition unterzeichnet haben, für die eine bestimmte Anzahl von Stimmen erforderlich ist
Tipp:
Du kannst Velo verwenden, um den Wert des Fortschrittsbalkens zu aktualisieren, ohne eine Verbindung zum CMS herstellen zu müssen. Erfahre mehr im Artikel Mit der Fortschrittsbalken-API arbeiten (Artikel zurzeit nur auf Englisch verfügbar).
Bevor du loslegst:
Musst du deiner Website das CMS hinzufügen und eine Sammlung erstellen, die den Feldtyp „Zahl“ für deinen Fortschrittswert enthält. Wenn du einen dynamischen Wert als Zielwert verwenden möchtest, füge auch ein Zahlenfeld hinzu, das den Zielwert darstellt.

Um einen Fortschrittsbalken hinzuzufügen und einzurichten:

  1. Öffne deinen Editor.
  2. Achte darauf, dass du in deinem Editor Velo aktiviert hast:
    1. Klicke oben auf Dev-Modus.
    2. Klicke auf Dev-Modus aktivieren.
  3. Klicke auf der linken Seite des Editors auf Elemente hinzufügen .
  4. Klicke auf Interaktiv.
  5. Klicke unter Indikatoren auf Fortschrittsbalken.
  6. Klicke und ziehe den Fortschrittsbalken deiner Wahl auf die Seite.
  7. Klicke auf dem Fortschrittsbalken auf Einstellungen.
  8. Gib ein Label ein, das Besucher und Screenreader wissen lässt, was die Leiste darstellt (z. B. „Fortschritt in Richtung Ziel“).
  9. Wähle, ob du den Zielwert als dynamischen Wert oder statischen Wert festlegen möchtest:

War das hilfreich?

|

War das hilfreich?

|