Newsletter is a VTEX component that displays a newsletter form.
This component can be imported and used by any VTEX app.
📢 Disclaimer: Don't fork this project; use, contribute, or open issue with your feature request.
You should follow the usage instruction in the main README.
Then, add newsletter block into your app theme.
Example:
"store.home": {
"blocks": [
"carousel#home",
"shelf#home",
"newsletter"
]
},Through the Storefront, you can change the Newsletter's behavior and interface. However, you also can make in your theme app.
| Prop name | Type | Description | Default value |
|---|---|---|---|
label |
String |
Label of the form used by the component | Subscribe to our newsletter (translated text) |
placeholder |
String |
Placeholder of the email input | Enter your email address (translated text) |
submit |
String |
Label of the submit button | Sign up (translated text) |
hideLabel |
Boolean |
Hide label | false |
You should follow the Styles API instruction in the main README.
Below, we describe the namespace that are defined in the Newsletter.
| Class name | Description | Component Source |
|---|---|---|
newsletter |
Outmost element | index |
container |
Container element | index |
form |
Form element | index |
inputGroup |
Element that wraps input | index |
buttonContainer |
Element that wraps the button | index |
label |
Label of the input | index |
error |
Error messsage | index |
confirmation |
Class added to newsletter when user submit email |
index |
confirmationTitle |
Title showed when user submit email | index |
confirmationText |
Text showed when user submit email | index |