<html lang="de-de" dir="ltr"><head></head><body>### [So fügen Sie eine Schaltfläche zum Ein-/Ausblenden von Passwörtern hinzu](https://wpforms.com/developers/how-to-add-a-password-visibility-toggle-button/)

**Veröffentlicht:** 10. Juni 2022
**Autor:** Umair Majeed

**Auszug:** Dieses Tutorial zeigt Ihnen, wie Sie Ihren Besuchern einen Umschalter für Ihre Formulare zur Verfügung stellen können, damit sie das Passwort sehen können, das sie in das Passwort-Formularfeld eingeben.

**Inhalt:**

## Einleitung

Möchten Sie Ihren Besuchern die Möglichkeit geben, ihr Passwort ein- oder auszublenden, während sie es in Ihr Formular eingeben? Standardmäßig maskiert das Passwortfeld in WPForms die Eingabe aus Sicherheitsgründen mit Sternchen.

WPForms enthält eine integrierte Einstellung, mit der Sie mit einem Klick im Builder eine Passwortsichtbarkeits-Umschaltfunktion hinzufügen können. Wenn Sie es vorziehen, diese Funktion für mehr Kontrolle per Code hinzuzufügen, zeigt Ihnen dieses Tutorial auch, wie Sie dies mit einem Snippet tun können.

## Integrierte Option für die Passwortsichtbarkeit

Ab WPForms Version 1.9.8 können Sie eine integrierte Option aktivieren, mit der Benutzer die Passwortsichtbarkeit umschalten können, ohne benutzerdefinierten Code zu benötigen.

Um diese Funktion zu aktivieren, klicken Sie im Formular-Builder auf das **Passwort**-Feld, um dessen Feldoptionen-Panel zu öffnen. Schalten Sie dann unter der Registerkarte **Allgemein** die Einstellung **Passwortsichtbarkeit aktivieren** ein.

![](https://wpforms.com/wp-content/uploads/2024/02/enable-password-visibility-1024x732.png)Dies ist der schnellste und einfachste Weg, um Ihren Formularen eine Passwortsichtbarkeits-Umschaltfunktion hinzuzufügen.

Wenn Sie mehr Kontrolle wünschen oder das Verhalten und Styling anpassen möchten, können Sie weiterhin dem folgenden Tutorial folgen, um diese Funktionalität mit einem Code-Snippet hinzuzufügen.

## Hinzufügen des Snippets

Um manuell eine Passwortsichtbarkeits-Umschaltfunktion hinzuzufügen, müssen Sie ein kleines Code-Snippet auf Ihrer Website platzieren. Diese Methode gibt Ihnen mehr Flexibilität, um das Aussehen und die Funktionsweise des Umschalters anzupassen.

Kopieren Sie das folgende Snippet auf Ihre Website.

**Hinweis**: Stellen Sie sicher, dass Sie das Font Awesome-Plugin installiert haben, bevor Sie dieses Code-Snippet hinzufügen.

Wenn Sie Hilfe benötigen, wie und wo Sie benutzerdefinierte Code-Snippets hinzufügen können, [lesen Sie bitte dieses Tutorial](https://wpforms.com/developers/how-to-add-custom-php-or-javascript-for-wpforms/ "So fügen Sie benutzerdefiniertes PHP oder JavaScript für WPForms hinzu").

```

/**
 * Bietet einen Umschalter für die Passwortsichtbarkeit
 *
 * @link https://wpforms.com/developers/how-to-add-a-password-visibility-toggle-button/
 */
  
function wpf_dev_password_toggle() {
    ?&gt;

**Kategorien:** Tutorials

**Tags:** CSS, Javascript, JS, PHP

---</body></html>