This page is about version 3.174.0 of the app, which is not the most recent version. The latest stable version is 3.175.0.
Warning
The Newsletter block has been deprecated in favor of the Newsletter app. Although support for this block is still granted, we strongly recommend you to update your store theme with the Product Specification's blocks in order to keep up with the component's evolution.
The newsletter
block displays a newsletter form.
Configuration
- Import the
vtex.store-components
app to your theme's dependencies in themanifest.json
file as in the following example:
_10 "dependencies": {_10 "vtex.store-components": "3.x"_10 }
- Add the
newsletter
block to any template of your choice. For example:
_10 "store.home": {_10 "children": [_10+ "newsletter",_10 ]_10 },
- Then, declare the
newsletter
block using the props stated in the Props table.
Props
Prop name | Type | Description | Default value |
---|---|---|---|
hideLabel | Boolean | Hide label. | false |
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) |
Customization
To apply CSS customizations in this and other blocks, follow the Using CSS handles for store customization guide.
CSS Handles |
---|
buttonContainer |
confirmation |
confirmationText |
confirmationTitle |
container |
error |
form |
inputGroup |
label |
newsletter |