Newsletter Input

Animated newsletter form.

How to

The Newsletter Input component is an animated newsletter form.

The submit button becomes active when the user submits a valid email format. Clicking the button triggers the icon animation and the visibility of the feedback message.

You can initialize the component using the NewsInput object:

var newsInput = document.getElementsByClassName('js-news-form')[0];
new NewsInput({
  element: newsInput,
  submit: function(email, cb) {
    // API call here
    cb(response); // response should be either 'success' or 'error'
  }
});

⚠️ Note that in the newsletter-input.js, we do not initialize the NewsInput object. 

You can use the submit option to implement your subscription function (e.g., an API call to the third party service you use to manage your subscription list).

Once the API call is complete, make sure to call the cb callback function, passing, as argument, either the string 'success' or 'error' so that the proper feedback message can be shown.

Categories

• Forms > Form Elements

Bug report & feedback

Component Github page ↗