This page is about version 3.119.6 of the app, which is not the most recent version. The latest stable version is 3.178.1.

Newsletter is a VTEX component that displays a newsletter form. This component can be imported and used by any VTEX app.

:loudspeaker: Disclaimer: Don't fork this project; use, contribute, or open issue with your feature request.

• Usage
  • Blocks API
    • Configuration
  • Styles API
    • CSS Namespaces

You should follow the usage instruction in the main README.

Then, add newsletter block into your app theme.

Example:

Configuration

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.

CSS Namespaces

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 message	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