@bubbleup/stencil-newsletterform NPM

Stencil NewsletterForm

Stencil newsletter component form for sending newsletter signups to Connect Mail.

Basic Adding

To include the newsletter form to a page, include the following two <script> tags in the <head> section of your page as seen below:

Ex:

<head>
  <!-- ... -->
    <script type="module" src="https://unpkg.com/@bubbleup/stencil-newsletterform@^0.1/www/build/newsletterform.esm.js"></script>
    <script nomodule src="https://unpkg.com/@bubbleup/stencil-newsletterform@^0.1/www/build/newsletterform.js"></script>
</head>

Add the following line in the page where you would like the form to show and add your machine readable list name from Connect Mail.

<newsletter-form listname="___" gdpr="false" fields="all" available-fields="firstname*,lastname*,email,country*,state*,postalcode*,birthdate*"></newsletter-form>

Advanced Adding (attribute configurations)

`gdpr`:

false

Set this to false for a regular form with no consent collection.

true

THE SITE MUST BE ADDED IN MYDATA FOR THIS TO WORK PROPERLY.

Set this to true for consent collection which collects to https://mydata.bubbleup.com/connect. On the frontend, this adds the consenting language with required checkboxes, lists all the How We Use Your Data fields configured in MyData and the link to "Revoke consent or edit your personal data".

`available-fields`

This is only for reference and is not used by the component.

`fields`

all

When set to "all", all fields in the available-fields attribute will be used.

required

The email field is the only field required by default. If you want any other fields to be required, all requested fields need to be added (comma separated) and an asterisk added directly after the field name. The state field can ONLY be required IF these three are met: