Comment puis-je utiliser, modifier et intégrer un formulaire d'inscription?

Vous avez plusieurs possibilités pour intégrer un formulaire à votre site web:

  1. En lien / iFrame

ou

  1. Intégré directement
    1. comme formulaire
    2. comme Pop-up

Pour créer un formulaire, cliquez sur "Formulaire" puis sur "+Nouveau formulaire".
À la troisième étape de la création du formulaire, vous recevrez les informations nécessaires pour intégrer le formulaire à votre site. 

1. Créer un lien vers le formulaire / iFrame

Sous "URL de votre formulaire" vous trouverez l'adresse web de votre formulaire d'inscription que vous pourrez insérer en lien ou par iFrame à votre site web. 

2. Intégrer le formulaire (conseillé)

2.a Comme formulaire

Copiez le code que vous trouvez sous "Formulaire pour site web - Snippet Javascript". 
Collez le code à l'endroit désiré de votre site web. Le formulaire s'affiche maintenant normalement. 

2.b Comme Pop-up

Copiez simplement le code que vous trouverez sous  "Popup après 10s - Snippet Javascript". 

Collez le code à l'endroit désiré de votre site web. Le formulaire s'affiche maintenant automatiquement en Pop-up après 10 secondes sur le site.  

Possibilités de modifications / JavaScript API

Les fonctions subscribe:createForm comme subscribe:createPopup acceptent deux paramètres:

Dans le premier paramètre, vous pouvez configurer l'apparence du formulaire. Voici l'apparence par défaut:

var config = {
    "form": {
        "class": "",
        "style": ""
    },
    "container": {
        "type": "table",
        "class": "",
        "style": "width: 100%;"
    },
    "row": {
        "type": "tr",
        "class": "",
        "style": ""
    },
    "columnLeft": {
        "type": "td",
        "class": "",
        "style": "width: 40%; padding: 10px 5px;"
    },
    "columnRight": {
        "type": "td",
        "class": "",
        "style": ""
    },
    "checkbox": {
        "type": "input",
        "class": "",
        "style": ""
    },
    "separator": {
        "type": "br",
        "class": "",
        "style": ""
    },
    "input": {
        "class": "",
        "style": "padding: 5px 10px; border-radius: 2px; border: 1px solid #d8dee4;"
    },
    "dropdown": {
        "type": "select",
        "class": "",
        "style": "padding: 3px 5px; border-radius: 2px; border: 1px solid #d8dee4;"
    },
    "button": {
        "type": "button",
        "class": "",
        "id": "",
        "style": "background-color: #00baff; border: none; border-radius: 4px; padding: 10px 20px; color: #ffffff; margin-top: 20px; cursor: pointer;"
    },
    "label": {
        "type": "label",
        "class": "",
        "style": "padding-left: 5px"
    },
    "loader": {
        "type": "img",
        "src": "//www.newsletter2go.com/images/loader.svg",
        "class": "",
        "style": "margin: auto; display:block; width: auto;"
    },
    "message": {
        "type": "h2",
        "class": "",
        "id": "",
        "style": "text-align: center;"
    }
}

Ajoutez simplement le Call suivant à la configuration:

n2g('subscribe:createForm', config)

ou

n2g('subscribe:createPopup', config)

Ainsi, vous pouvez modifier l'apparence directement par styles ou classes CSS. 

Un autre paramètre qui peut être configuré est l'ID d'un élément HTML. Cela est pratique si vous voulez afficher le formulaire à un autre endroit que le Tag du script que vous voulez insérer: 

n2g('subscribe:createForm', config, 'targetId')

Pour le Pop-Up, vous pouvez modifier le nombre de secondes avant l'affichage ou un affichage immédiat (comme avec le code ci-dessous): 

n2g('subscribe:createPopup', config, 0)

Vous pouvez aussi choisir d'afficher le Pop-up uniquement après un clic de souris. 

Pour les codeurs

Pour mettre en place des solutions encore plus individuelles, vous pouvez utiliser des fonctions Callback qui seront lancées lors d'une connexion réussie ou échouée:

n2g('subscribe:createForm', config, 'targetId', successCallback(response, messages), errorCallback(response, messages), confirmCallback(state, messages))
n2g('subscribe:createPopup', config, 0, successCallback(response, messages), errorCallback(response, messages), confirmCallback(state, messages))

Tous les Callbacks donnent comme premier paramètre des informations sur le statut et comme deuxième paramètre le texte contenu dans le formulaire. 
response.status == 201 envoi du mailing double opt-in  (Message standard: messages.message_subscribe_doi)
response.status == 200 Destinataire déjà inscrit (Message standard: messages.message_subscribe_duplicate)
response.status != 200 && response.status != 201 une erreur est survenue (Message standard: messages.message_subscribe_error)

Le confirmCallback est appelé après confirmation du lien DOI:
state == "doi_success" Inscritption réussie (Message standard: messages.message_subscribe_success) 

state == "doi_duplicate" Destinataire déjà inscrit (Message standard: messages.message_subscribe_duplicate) 

state == "doi_error" une erreur est survenue (Message standard: messages.message_subscribe_error)

Whitelabeling

Nous pouvons vous proposer des formulaires d'inscription en marque blanche (fonctionnalité payante).  

Dans ce cas, le formulaire est hébergée sur un domaine particulier. Nous pouvons adapter le design selon votre envie. 

Pour plus d'informations, veuillez nous contacter. Notre équipe sera heureuse de vous venir en aide.