Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Info
titleSommaire

Table of Contents
maxLevel2

Warning

Si vous utilisez un gestionnaire de tag type Google Tag Manager pour intégrer SPREAD, passez par cette documentation.

Fonctionnalités de l'intégration en JavaScript

Le JavaScript de SPREAD permet :

  •  d'afficher les widgets sur votre site web (JavaScript 1),

  •  de remonter les créations de compte dans SPREAD (JavaScript 2),

  •  de remonter les commandes dans SPREAD (JavaScript 3).

Le JavaScript de SPREAD a été conçu pour ne pas ralentir le temps d’affichage de vos pages (fonctionnement asynchrone) et ainsi vous garantir un fonctionnement transparent.

JAVASCRIPT 1 - Widgets

Image Added Pour être informés de toutes les mises à jour concernant l’API de SPREAD, inscrivez-vous ici : https://social-sb.com/z/newsletter-api-v1-v2


Info
titleSommaire

Table of Contents
maxLevel2




Warning

Si vous utilisez un gestionnaire de tag type Google Tag Manager pour intégrer SPREAD, passez par cette documentation.

Fonctionnalités de l'intégration en JavaScript

Le JavaScript de SPREAD permet :

  •  d'afficher les widgets sur votre site web

  •  de remonter les créations de compte dans SPREAD

  •  de remonter les commandes dans SPREAD

Le JavaScript de SPREAD a été conçu pour ne pas ralentir le temps d’affichage de vos pages (fonctionnement asynchrone) et ainsi vous garantir un fonctionnement transparent.

Warning
titleAvertissement

L'intégration de SPREAD demandant du temps, pour utiliser SPREAD en attendant, nous vous recommandons d'importer votre CRM et de la mettre à jour toutes les semaines !

Voir les documentations sur l'import


Il n'est pas nécessaire d'attendre la fin de l'intégration pour communiquer auprès de vos contacts ou mettre en place des opérations marketing.

JAVASCRIPT 1 - Affichage des widgets

Ce JavaScript est à insérer sur toutes les pages du site, dans le footer juste avant la balise </body>.

Sa fonction principale est de permettre de piloter les widgets depuis le back office SPREAD.

Associé aux scripts de remontée de création de compte (JavaScript 2) et à la remontée des commandes (JavaScript 3), il permet également de faire remonter des informations dans la CRM SPREAD.

Cliquez ici pour accéder aux exemples de code et intégrez le code JAVASCRIPT avec entre les commentaires suivants :

Début : //

Configuration du tracker SPREAD
  • // Procédure de chargement du tracker JS SPREAD

  • // Appel du chargement du tracker JS SPREAD

    JAVASCRIPT 1 - Affichage des widgets

    Fin : // Fin JAVASCRIPT 1

    Dans ce script, modifiez <PUBLIC_KEY> par votre clé d'API publique que vous trouverez dans votre back office (onglet Paramétrage > Tracker)


    Note
    titleAttention

    N'intégrez pas directement le fichier sb-tracker.js sur votre site !

    Si vous le faites, vous ne pourrez pas bénéficier des mises à jour que nous réalisons régulièrement.

    Détail des variables

    Variables

    Description

    Type

    public_key

    Clé API publique SPREAD (à trouver dans Paramètrage > Tracker)

    chaîne

    obligatoire

    debug

    "True", permet d'afficher les logs dans la console

    boolean

    true ou false

    set_cookie

    "True", True permet d'attribuer le cookie aux clients

    Important pour le parrainage et les widgets sur segment par exemple

    boolean

    true ou false

    track_order_enabled

    "True" permet aux remontées de commandes et de créations de compte de se faire dans le JavaScript et en GET

    boolean

    true ou false

    La fonction loadSpreadTracker

    Cette fonction doit être placée sur toutes les pages de votre site.

    Elle est essentielle au bon fonctionnement de nos scripts et doit être placée après ces derniersle script spconfig. 

    JAVASCRIPT 2 - Remontée des créations de compte

    Ce JavaScript permet d’intégrer automatiquement les visiteurs dans la Customer Family CRM de SPREAD lorsqu'ils créent un compte sur votre site.

    Le code suivant est à insérer sur la page de confirmation de création du compte dans le footer,en plus du tag sur toutes les pages et avant la fonction loadSpreadTracker.

    Note

    L'optin est toujours récolté au nom d'optin, mais pour répondre au RGPD nous réattribuons cela dans un consentement dans SPREAD. Pour que cela soit fonctionnel, pensez à configurer "Paramètrage > Tracker > RGPD"


    Cliquez ici pour accéder aux exemples de code et intégrez le code JAVASCRIPT en dessous du commentaire suivant :// -------------------------- PROFIL ---------------------------entre les commentaires suivants :

    Début : // JAVASCRIPT 2 - Remontée des créations de compte

    Fin : // Fin JAVASCRIPT 2


    Informations obligatoires

    Pour remonter les nouveaux clients, seulement certaines données doivent impérativement être présentes dans le script. Il s'agit de :

    •  «email» l’email du client.
    •  «action : "signup" » permet de détecter qu'il s'agit d'une création de compte.


    Détail des variables

    VariablesDescriptionType

    email

    Adresse email du client 

    chaîne

    obligatoire

    name

    Nom du client.

    (Si le prénom n’est pas dissocié, ne pas mettre firstname et mettre le nom ET le prénom dans name)

    chaîne 

    firstname

    Prénom du client 

    chaîne 

    optinEtat de l'abonnement à la newsletter

    boolean

    1 ou 0 (ou -1)

    countryPayschaîne
    birthdayAnniversaire

    date

    yyyy-mm-dd

    genderCivilité

    chaîne

    male ou female

    addressAdresse (Numéro et rue)chaîne
    cpCode postalchaîne
    cityVillechaîne
    telNuméro de téléphonechaîne
    mobileNuméro de téléphone mobilechaîne
    tel_optinLe numéro de téléphone est il disposé à recevoir des appels de votre part

    boolean

    1 ou 0

    mobile_optinLe numéro de téléphone mobile est il disposé à recevoir des sms de votre part

    boolean

    1 ou 0

    fonctionPoste dans l'entreprisechaîne
    companyNom de l'entreprisechaîne
    action

    "signup"

    Permet de détecter qu'il s'agit d'une création de compte dans le BackOffice back office SPREAD

    chaîne

    obligatoire

    add_tag

    Indique un ou plusieurs tag dans la fiche du client

    chaîne

    del_tag

    Supprime un ou plusieurs tag dans la fiche du client

    chaîne 

    custom_fields

    Champs personnalisés

    Multiple


    JAVASCRIPT 3 - Remontée de commandes

    Ce JavaScript permet de remonter automatiquement les commandes et les informations clients dans la Customer Family CRM de SPREAD lorsqu'ils passent commande sur votre site.

    Le code suivant est à insérer sur la page de confirmation de commande dans le footer, en plus du tag sur toutes les pages et avant la fonction loadSpreadTracker.

    Note

    L'optin est toujours récolté au nom d'optin, mais pour répondre au RGPD nous ré-attribuons cela dans un consentement dans SPREAD. Pour que cela soit fonctionnel, pensez à configurer "Paramètrage > Tracker > RGPD"


    Cliquez ici pour accéder aux exemples de code et intégrez le code JAVASCRIPT en dessous du commentaire suivant : // -------------------------- COMMANDE --------------------------aux exemples de code et intégrez le code JAVASCRIPT entre les commentaires suivants :

    Début : // JAVASCRIPT 3 - Remontée de commandes

    Fin : // Fin JAVASCRIPT 3


    Tip
    titleAstuce de l'équipe

    Si vous souhaitez faire remonter des champs qui sont propres à votre secteur d'activité, vous pouvez utiliser les champs personnalisés.


    Informations obligatoires

    Pour la remontée de commandes, seulement certaines données doivent impérativement être présentes dans le script. Il s'agit de :

    •  «email» l’email du client,
    • «idorder» la référence commande,
    • «amount» le montant,
    • «state» le statut de la commande,
    • «date» la date de la commande,
    •  «action : "order" » permet de détecter qu'il s'agit d'une commande vous pourrez alors vérifier votre remontée de commandes

    Détail des variables

    VariablesDescriptionType

    email

    Adresse email du client 

    chaîne

    obligatoire

    amountMontant de la commande

    numérique

    obligatoire - Point en séparateur de décimale

    idorderRéférence de la commande

    chaîne

    obligatoire

    dateDate de la commande

    date

    obligatoire (yyyy-mm-dd hh:mm:ss UTC)

    stateStatut de la commande

    0 : annulée

    10 : enregistrée

    20 : payée

    50 : envoyée

    100 : reçue

    obligatoire

    name

    Nom du client.

    (Si le prénom n’est pas dissocié, ne pas mettre firstname et mettre le nom ET le prénom dans name)

    chaîne 

    firstname

    Prénom du client 

    chaîne 

    optinEtat de l'abonnement à la newsletter

    boolean

    1 ou 0

    countryPayschaîne
    birthdayAnniversaire

    date

    yyyy-mm-dd

    genderCivilité

    chaîne

    male ou female

    addressAdresse (Numéro et rue)chaîne
    cpCode postalchaîne
    cityVillechaîne
    telNuméro de téléphonechaîne
    mobileNuméro de téléphone mobilechaîne
    tel_optinLe numéro de téléphone est il disposé à recevoir des appels de votre part

    boolean

    1 ou 0

    mobile_optinLe numéro de téléphone mobile est il disposé à recevoir des sms de votre part

    boolean

    1 ou 0

    fonctionPoste dans l'entreprisechaîne
    companyNom de l'entreprisechaîne
    action

    "order"

    Permet de détecter qu'il s'agit d'une commande dans le BackOffice SPREAD, vous permet ainsi de les retrouver dans "Paramétrage > Tracker > Vérifier la remontée de commandes"

    chaîne

    obligatoire

    add_tag

    Indique un ou plusieurs tag dans la fiche du client

    chaîne

    del_tag

    Supprime un ou plusieurs tag dans la fiche du client

    chaîne 

    add_order_tagIndique un ou plusieurs tag sur les commandeschaîne
    del_order_tagSupprime un ou plusieurs tag sur les commandeschaîne

    custom_fields

    Champs personnalisés

    Multiple

    Vous pouvez également ajouter davantage de détails à vos commandes avec les attributs produits


    Gestion de l'idorder

    La valeur «idorder» est l’identifiant unique de la commande sur la boutique.

    La première fois que cet identifiant est utilisé, la commande est enregistrée dans la CRM. Si l’identifiant de commande est présenté une deuxième fois, les données sont mises à jour.

    Cet identifiant est particulièrement utile pour changer l’état de la commande (l’annuler ou la mettre à expédier).


    Gestion de l’état de la commande (state)

    Grâce à l’«idorder» vous allez pouvoir faire évoluer l’état de la commande au fur et à mesure avec la variable state :

    • 10     :    EnregistréeEnregistré
    • 20     :    PayéePayé
    • 50     :    ExpédiéeExpédié
    • 100   :    ReçueReçu
    • 0       :    Annulée
    Note
    titleRemarque
    Dans la timeline du profil, vous observerez le statut Annulé, mais le montant ne sera pas remonté dans le chiffre d'affaires.
    • Annulé



    Tip
    titleAstuce de l'équipe

    L'intégration de SPREAD demandant du temps, pour utiliser SPREAD en attendant, nous vous recommandons d'importer votre CRM et de la mettre à jour toutes les semaines !

    Voir les documentations sur l'import


    Il n'est pas nécessaire d'attendre la fin de l'intégration pour communiquer auprès de vos contacts ou mettre en place des opérations marketing.


    Note
    titleRemarque

    Une fois l'intégration de SPREAD terminée, vous devez réaliser un import de l'historique de vos commandes !

    Cliquez ici pour consulter la documentation sur l'import de fichier CSV