Bubble.io Tutorial - Passwort sichtbar machen bei Inputfeldern

Kostenloses Bubble.io Video Tutorial - Passwörter sichtbar machen bei Input Feldern

Chris Strobl
Chris Strobl

In diesem Schritt-für-Schritt Video zeigen wir euch, wie man auf zwei unterschiedliche Wege Passwörter in Bubble sichtbar machen kann. Einerseits nativ mit einem Textfeld, welches unter dem Inputfeld angezeigit wird udn den Input anzeigt, falls man ein Icon klickt. Und andererseits mit dem kostenlosen Plugin Reveal & Hide Password von Zeroqode (https://bubble.io/plugin/reveal--hide-password-1531310660066x700901076712292400). Bei diesem Weg wird das Passwort im Inputfeld selbst angezeigt, sobald man auf das Icon klickt.

Bubble.io Video Tutorial - Passwörter sichtbar machen bei Input Feldern

Video Transkript:

Hallo, mein Name ist Chris Strobl und ich zeige euch heute, wie wir im Bubble Passwörter sichtbar machen.

Ihr kennt das sicherlich von vielen Webseiten. Wenn man ein Passwort eingibt, dann ist es erst mal nicht sichtbar.

Und wenn ich auf das Auge klicke, kann ich als User selber nochmal sichtbar machen und mir dann auch sicher zu sein, ob ich es richtig eingegeben habe. Wenn ich es wieder weg mache, ist es wieder weg. Ich zeige euch heute zwei Wege, wie wir das Ganze machen und wir legen direkt mal los mit dem ersten Weg. Ich habe einmal vorbereitet, dass wir hier unser Feld haben und als erstes erstellen wir jetzt ein Icon. Und nehmen das Icon. F a Icon.

Darunter verstehen wir einen Text in Search Dynamic data. Input A's value jedes Input Field input forms Hort von dem hier input A's value und dieses Element ist nicht visible homepage slot hier klicken jetzt auf das Icon Start/edit workflow. Element actions toll! Wir tollen Text input A's value. Und sagen im Icon Conditional wenn. Text Impuls, Passwort Value ist Lissabon, dann ändern wir das Icon. Dass es unsichtbar ist. Wir gehen jetzt einmal auf Preview, um das Ganze zu testen. Wir testen das Ganze einmal. Und sehen das Passwort ist nicht sichtbar. Wir klicken auf das Auge, um sichtbar zu machen, und ihr seht, darunter erscheinen nun das Passwort. Und wenn wir zurückblicken nicht.

Ich möchte euch jetzt aber noch einen zweiten Weg zeigen, nämlich dass nicht das Passwort darunter sichtbar ist, sondern direkt darin. Wir gehen dafür nun in Plugins und wir haben hier das kostenlose Plugin René Innenteil Passwort von Zero Code bereits installiert. Wir gehen jetzt zurück ins designte Kopieren einmal die Gruppe und als nächstes gingen Settings General. Expose the Option to add an ID Attribute wählt dieses aus, wenn es nicht bereits schon ausgewählt ist, dass wir all die Attribute haben und wir gehen hier in das input A's value zwei.

Und neben nennen, dass das all die Attribute Passwort Anschließend ziehen wir das Element Reveal auf die Oberfläche. Das könnte irgendwo hinziehen, das wird man nachher nicht sehen. Und wir sagen, wenn wir auf das Icon klicken, start/edit workflow dann die Element actions Toggle Reveal, welches wir gerade haben und nehmen das Element Rivella und fügen die Input Field Passwort hinzu. Dies ist nun die Input Field von dem Feld. Gleichzeitig ändern wir nun im Conditional. Wenn. Reveal as tool ist visible bis ist dies, dann ändern wir das Icon auf nicht sichtbar. Schließlich können wir noch das Textfeld hier löschen.

Wir gehen jetzt einmal in Preview und schauen uns das Ganze noch einmal an.. Wer mir das Passwort Wir klicken auf das Auge kann jetzt direkt können wir hier alles ändern und wieder einfügen. So habt ihr gesehen, dass wir zwei Wege haben, um quasi Passwörter im Bubble sichtbar zu machen.

Wenn euch dieses Video gefallen habt, liegt gerne auf den Like Button oder subscribed unseren Channel für die neuesten Videos? Wenn ihr Fragen habt, schreibt uns gerne Kommentare. Ich wünsche euch weiterhin viel Erfolg und auf bald.

FeaturesPlugins