NewsletterSignup. A provider-agnostic newsletter form connected by PostkitProvider.
- Engagement
- Interactive
- Stability · Initial
- :::postkit-newsletter-signup
Usage.
<NewsletterSignup
title="The portable publishing letter"
description="Occasional notes on content systems and the open web."
emailPlaceholder="reader@example.com"
buttonLabel="Join the list"
privacy="No tracking pixels. Unsubscribe whenever you like."
/>Props. Always in step with the code.
| Prop | Type | Default | Description |
|---|---|---|---|
| titleRequired | string | None | The newsletter signup heading. |
| description | string | None | Plain-text supporting copy. |
| list | string | None | A host-defined newsletter or audience identifier. |
| emailLabel | string | "Email address" | The accessible email field label. |
| emailPlaceholder | string | None | The email field placeholder. |
| buttonLabel | string | "Subscribe" | The submit button label. |
| privacy | string | None | A short privacy or consent note. |
| successMessage | string | "Thanks for subscribing." | The default successful-submission message. |
| errorMessage | string | "Subscription failed. Please try again." | The default failed-submission message. |
| alignment | "start" | "center" | "start" | The content and form alignment. |
| Appearance | |||
| size | "sm" | "md" | "lg" | "md" | The component density and type scale. |
| variant | "outline" | "subtle" | "plain" | "subtle" | The component visual treatment. |
Every component also takes unstyled and the part-styling props. Change a default for your whole site with defaults in createPostkit. Part styles
Anatomy. Every part is yours to restyle.
Every part
- root
- content
- title
- description
- form
- label
- fields
- input
- submit
- status
- privacy
Renderers. One component, everywhere you publish.
- Headless @postkit/reactSupported
- Chakra @postkit/chakraSupported
- Email @postkit/emailLeft out
- Astro @postkit/astroHydrated
- Web components @postkit/elementsPlanned