Msender – The L214 email interpellator

Example of use

<div data-widget-host="habitat" class="preview">
  <script type="text/props">
  {
      "to": [
        {
          "first_name": "John",
          "last_name": "Appleseed"
          "organization": "Apple Inc.",
          "email": "john@apple.com",
          "gender": "m",
          "format": "titlefull",
          "department_code": null
        }
      ],
      "bcc": [
        {
          "email": "cyberaction-copie@l214.com"
        }
      ],
      "subject": "Hi Apple",
      "message": "Bonjour,\n\nApple\n\n{{name}}",
      "select_department": "metropolitan",
      "filter_recipient": "manual",
      "filter_recipient_randomize": true,
      "step_two_title": "Mes magasins"
  }
  </script>
</div>
<script async src="msender/bundle.js"></script>

Parameters

to

A list of Recepient objects to list the available email recepients. See below for a full spec of the Recepient object. For example:

[
  {
    "first_name": "John",
    "last_name": "Appleseed"
    "organization": "Apple Inc.",
    "email": "john@apple.com",
    "gender": "m",
    "format": "titlefull",
    "department_code": null
  }
]

cc

A list of Recepient objects to list the available email cc targets.

bcc

A list of Recepient objects to list the available email bcc targets. For example:

[
  {
    "email": "cyberaction-copie@l214.com"
  }
]

subject

The email subject.

message

The email message. Can be templated with the following tags:

filter_recipient

How the recipient list (the to parameter described above) should be filtered. The possible values are:

select_department

What departments to show in the list. Possible values are:

step_two_title

The title to be displayed on step two (by default will display Destinataires).

enable_mailchimp

Enable newsletter subscription via MailChimp (boolean, default is false). If enabled, a checkbox will ask user consent to subscribe to the newsletter (initial state of the checkbox is controlled by send_mailchimp).

send_mailchimp

Initial state of the MailChimp subscription checkbox.

mailchimp_source

MailChimp source (by default msender).

Recepient object

Possible gender values:

Possible format values:

Development

Prerequisites

• nvm (or npm > 8.10.0)
• Yarn

Install

nvm use
yarn install

Run

To start the development server:

yarn run start

Storybook

A React Storybook is available:

yarn run storybook

Test

Unit tests can be run with:

yarn run test

Build

To build a production ready bundle (in ./build/):

yarn run build

Email client specificities (2015 research)

Webmails specificities

• Hotmail : BCC can't be autocompleted with URL parameter
• Yahoo : subject can't be autocompleted with URL parameter; only one email adress per field can be passed with the URL parameters (emails seperation is done with JS so semicolons won't work)
• Free : body can't be autocompleted with URL parameter
• Orange, SFR, Laposte won't take any URL parameter

Misc info

• Get requests characters limitations by webmail :

• Windows Live Hotmail : ~1750 chars

• Gmail : ~1900 chars

• Yahoo Mail : ~7000 chars

• Client : ~1500 chars

• (limitations are after url encoding)

• Mail clients statistics for France pop :

• 1 - Orange => ~27%

• 2 - Hotmail/Outlook => ~19%

• 3 - Gmail => ~19%

• 4 - SFR => ~11%

• 5 - Yahoo => ~11%

Source : http://www.journaldunet.com/ebusiness/le-net/classement-services-mail/

• For mobile supports, only the client link will be displayed.

License

MIT License