Wettbewerb: Erstellen Sie zwischen dem 29. Mai und dem 14. Juni eine SaaS-Anwendung und gewinnen Sie Geldpreise, kostenlose Pläne und mehr!
Komponente laden...
Laden
Ich danke Ihnen! Ich werde
dieses Projekt so schnell wie möglich aktualisieren.
dieses Projekt so schnell wie möglich aktualisieren.
Huch! Beim Absenden des Formulars ist etwas schief gelaufen.
So aktivieren Sie die Google-Authentifizierung
So aktivieren Sie die Facebook-Authentifizierung
So aktivieren Sie die Spotify-Authentifizierung
Wie man die Dribbble-Authentifizierung aktiviert
Wie man die Github-Authentifizierung aktiviert
So aktivieren Sie die LinkedIn-Authentifizierung
So aktivieren Sie passwortlose Anmeldungen
So konfigurieren Sie die Kennwortüberprüfung
Passwort ein-/ausblenden
Wie man mit Profilbildern arbeitet
So fügen Sie einen Fluss für vergessene Passwörter hinzu
Wie man mit Kontrollkästchen arbeitet
Wie man Preistabellen konfiguriert
Über das Stripe-Kundenportal
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"013841d4-ac37-3b17-3250-b6afd1b7855d","type":"FormWrapper","tag":"div","classes":["2731da6f-6804-1731-9645-419c9afe7756"],"children":["013841d4-ac37-3b17-3250-b6afd1b7855e","013841d4-ac37-3b17-3250-b6afd1b78560","013841d4-ac37-3b17-3250-b6afd1b78563"],"data":{"form":{"type":"wrapper"},"search":{"exclude":true},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b7855e","type":"FormForm","tag":"form","classes":[],"children":["013841d4-ac37-3b17-3250-b6afd1b7855f"],"data":{"form":{"type":"form","name":"Email Form"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":"email-form","name":"email-form","data-name":"Email Form","redirect":"","data-redirect":"","action":"","method":"get"},"visibility":{"conditions":[]},"Source":{"tag":"Default form","val":{}}}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b7855f","type":"FormSelect","tag":"select","classes":["f4f4c4e8-7af9-7ea2-1795-ec8b63cbfe36"],"children":[],"data":{"attr":{"id":"field-3","name":"field-3","data-name":"Field 3","required":false,"multiple":false},"form":{"type":"select","opts":[{"t":"✖️ Unsubscribed","v":"NONE"},{"t":"🔔 Notifications On","v":"THREADS_ONLY"}],"name":"Field 3"},"xattr":[{"name":"data-ms-channel-notifications","value":""}],"devlink":{"runtimeProps":{},"slot":""},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b78560","type":"FormSuccessMessage","tag":"div","classes":["1973b4f7-c1d1-3bdb-4eda-4686353dd483"],"children":["013841d4-ac37-3b17-3250-b6afd1b78561"],"data":{"form":{"type":"msg-done"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b78561","type":"Block","tag":"div","classes":[],"children":["013841d4-ac37-3b17-3250-b6afd1b78562"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b78562","text":true,"v":"Thank you! Your submission has been received!"},{"_id":"013841d4-ac37-3b17-3250-b6afd1b78563","type":"FormErrorMessage","tag":"div","classes":["1973b4f7-c1d1-3bdb-4eda-4686353dd483"],"children":["013841d4-ac37-3b17-3250-b6afd1b78564"],"data":{"form":{"type":"msg-fail"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b78564","type":"Block","tag":"div","classes":[],"children":["013841d4-ac37-3b17-3250-b6afd1b78565"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b78565","text":true,"v":"Oops! Something went wrong while submitting the form."}],"styles":[{"_id":"2731da6f-6804-1731-9645-419c9afe7756","fake":false,"type":"class","name":"comment-no-margin","namespace":"","comb":"","styleLess":"margin-bottom: 0px;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","origin":null,"selector":null},{"_id":"f4f4c4e8-7af9-7ea2-1795-ec8b63cbfe36","fake":false,"type":"class","name":"comment-subscribe","namespace":"","comb":"","styleLess":"height: 37px; margin-bottom: 0px; padding-top: 5px; padding-bottom: 5px; padding-left: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(240, 15.31%, 88.19%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(240, 15.31%, 88.19%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(240, 15.31%, 88.19%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(240, 15.31%, 88.19%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-color: white; box-shadow: 0 1px 2px 0 hsla(240, 15.31%, 88.19%, 0.50); transition-property: border-color, box-shadow; transition-duration: 200ms, 200ms; transition-timing-function: ease, ease; color: hsla(0, 0.00%, 0.00%, 1.00); font-size: 15px; font-weight: 300;","variants":{"main_focus":{"styleLess":"border-top-style: solid; border-top-width: 1px; border-top-color: black; border-right-style: solid; border-right-width: 1px; border-right-color: black; border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: black; border-left-style: solid; border-left-width: 1px; border-left-color: black;"},"main_placeholder":{"styleLess":"color: hsla(0, 0.00%, 43.33%, 1.00);"},"main_hover":{"styleLess":"border-top-color: #374252; border-right-color: #374252; border-bottom-color: #374252; border-left-color: #374252; box-shadow: 0 1px 4px 0 rgba(220, 220, 229, 0.9);"}},"children":["501362e1-7f72-de67-c7b5-ed9c24bd79ec","44c08e1a-0dd9-cc23-f7e8-5fa38abb8592","f593b152-db7f-cf39-c374-b83816f4a5d3","e19a45c8-020a-243f-bd96-6ff1ec4d7021","df2068c8-a038-d771-5a39-4f7236c62aa2","310f3820-383f-f82b-d15e-fadf6c46181a"],"createdBy":"572e16b6f586648f39f82496","origin":null,"selector":null},{"_id":"1973b4f7-c1d1-3bdb-4eda-4686353dd483","fake":false,"type":"class","name":"hide","namespace":"","comb":"","styleLess":"display: none;","variants":{},"children":[],"origin":null,"selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0,"universalBindingsRemovedCount":0}}
Klonen in Webflow
Komponente kopieren
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"013841d4-ac37-3b17-3250-b6afd1b7855d","type":"FormWrapper","tag":"div","classes":["2731da6f-6804-1731-9645-419c9afe7756"],"children":["013841d4-ac37-3b17-3250-b6afd1b7855e","013841d4-ac37-3b17-3250-b6afd1b78560","013841d4-ac37-3b17-3250-b6afd1b78563"],"data":{"form":{"type":"wrapper"},"search":{"exclude":true},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b7855e","type":"FormForm","tag":"form","classes":[],"children":["013841d4-ac37-3b17-3250-b6afd1b7855f"],"data":{"form":{"type":"form","name":"Email Form"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":"email-form","name":"email-form","data-name":"Email Form","redirect":"","data-redirect":"","action":"","method":"get"},"visibility":{"conditions":[]},"Source":{"tag":"Default form","val":{}}}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b7855f","type":"FormSelect","tag":"select","classes":["f4f4c4e8-7af9-7ea2-1795-ec8b63cbfe36"],"children":[],"data":{"attr":{"id":"field-3","name":"field-3","data-name":"Field 3","required":false,"multiple":false},"form":{"type":"select","opts":[{"t":"✖️ Unsubscribed","v":"NONE"},{"t":"🔔 Notifications On","v":"THREADS_ONLY"}],"name":"Field 3"},"xattr":[{"name":"data-ms-channel-notifications","value":""}],"devlink":{"runtimeProps":{},"slot":""},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b78560","type":"FormSuccessMessage","tag":"div","classes":["1973b4f7-c1d1-3bdb-4eda-4686353dd483"],"children":["013841d4-ac37-3b17-3250-b6afd1b78561"],"data":{"form":{"type":"msg-done"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b78561","type":"Block","tag":"div","classes":[],"children":["013841d4-ac37-3b17-3250-b6afd1b78562"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b78562","text":true,"v":"Thank you! Your submission has been received!"},{"_id":"013841d4-ac37-3b17-3250-b6afd1b78563","type":"FormErrorMessage","tag":"div","classes":["1973b4f7-c1d1-3bdb-4eda-4686353dd483"],"children":["013841d4-ac37-3b17-3250-b6afd1b78564"],"data":{"form":{"type":"msg-fail"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b78564","type":"Block","tag":"div","classes":[],"children":["013841d4-ac37-3b17-3250-b6afd1b78565"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"013841d4-ac37-3b17-3250-b6afd1b78565","text":true,"v":"Oops! Something went wrong while submitting the form."}],"styles":[{"_id":"2731da6f-6804-1731-9645-419c9afe7756","fake":false,"type":"class","name":"comment-no-margin","namespace":"","comb":"","styleLess":"margin-bottom: 0px;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","origin":null,"selector":null},{"_id":"f4f4c4e8-7af9-7ea2-1795-ec8b63cbfe36","fake":false,"type":"class","name":"comment-subscribe","namespace":"","comb":"","styleLess":"height: 37px; margin-bottom: 0px; padding-top: 5px; padding-bottom: 5px; padding-left: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(240, 15.31%, 88.19%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(240, 15.31%, 88.19%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(240, 15.31%, 88.19%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(240, 15.31%, 88.19%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-color: white; box-shadow: 0 1px 2px 0 hsla(240, 15.31%, 88.19%, 0.50); transition-property: border-color, box-shadow; transition-duration: 200ms, 200ms; transition-timing-function: ease, ease; color: hsla(0, 0.00%, 0.00%, 1.00); font-size: 15px; font-weight: 300;","variants":{"main_focus":{"styleLess":"border-top-style: solid; border-top-width: 1px; border-top-color: black; border-right-style: solid; border-right-width: 1px; border-right-color: black; border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: black; border-left-style: solid; border-left-width: 1px; border-left-color: black;"},"main_placeholder":{"styleLess":"color: hsla(0, 0.00%, 43.33%, 1.00);"},"main_hover":{"styleLess":"border-top-color: #374252; border-right-color: #374252; border-bottom-color: #374252; border-left-color: #374252; box-shadow: 0 1px 4px 0 rgba(220, 220, 229, 0.9);"}},"children":["501362e1-7f72-de67-c7b5-ed9c24bd79ec","44c08e1a-0dd9-cc23-f7e8-5fa38abb8592","f593b152-db7f-cf39-c374-b83816f4a5d3","e19a45c8-020a-243f-bd96-6ff1ec4d7021","df2068c8-a038-d771-5a39-4f7236c62aa2","310f3820-383f-f82b-d15e-fadf6c46181a"],"createdBy":"572e16b6f586648f39f82496","origin":null,"selector":null},{"_id":"1973b4f7-c1d1-3bdb-4eda-4686353dd483","fake":false,"type":"class","name":"hide","namespace":"","comb":"","styleLess":"display: none;","variants":{},"children":[],"origin":null,"selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0,"universalBindingsRemovedCount":0}}
Browser nicht unterstützt. Verwenden Sie
Chrome oder Safari.
Chrome oder Safari.
Über diese Komponente
AI-generiert
Komponentenbeschreibung (von AI generiert)
The Comment Notification Selector is a user-friendly form component designed to allow users to manage their notification preferences for comments. It features options for subscribing or unsubscribing from notifications.
Wesentliche Merkmale:
- Dropdown selection for notification preferences: Unsubscribed or Notifications On
- Success and error messages for form submission feedback
- Customizable form attributes for integration with various backends
- Responsive Design für verschiedene Geräte geeignet
Gestaltungselemente:
- Clean and modern aesthetic with a white background
- Rounded corners and subtle box shadows for a polished look
- Consistent use of color for borders and text to enhance readability
- Minimalistic design that avoids clutter
Potenzielle Anwendungsfälle:
- Blogs and content websites looking to engage users with comment notifications
- E-commerce platforms wanting to keep customers informed about product reviews
- Community forums that require user interaction and feedback management
- Educational websites where students can subscribe to updates on discussions
Conclusion: The Comment Notification Selector is a versatile and visually appealing component that enhances user engagement by allowing customizable notification preferences, making it an excellent addition for various web applications.
Mit dem Bau beginnen
Bauen Sie Ihre Träume
Memberstack ist 100% kostenlos, bis Sie bereit sind, zu starten - worauf warten Sie also noch? Erstellen Sie Ihre erste App und beginnen Sie noch heute mit der Entwicklung.
.png)
