Configurer le formulaire Web to Lead

La fonction Perfex CRM Web to Lead vous permet de créer un formulaire Web basé sur des champs de leads et des champs personnalisés pour le placer sur votre site Web, votre page de destination, etc. en tant qu'iframe.

Les visiteurs peuvent ensuite saisir leurs noms, adresses e-mail, télécharger une pièce jointe et d'autres informations de base pour créer un prospect directement dans Perfex CRM.

Pour créer un nouveau formulaire Web to lead, à partir du menu d'administration principal, accédez à Configuration-> Leads-> Web To Lead

Cliquez sur le bouton en haut à gauche Nouveau formulaire

REMARQUE : Vous pourrez créer le formulaire après avoir créé le formulaire initial, y compris tous les paramètres.

1. Nom du formulaire – Donnez un nom à votre formulaire, il est à usage personnel et sera également affiché dans le profil du prospect lorsque vous ouvrez le prospect.
2. Langue – La langue est actuellement utilisée uniquement pour les messages de validation.
3. Soumettre le texte du bouton - En bas où l'utilisateur devra cliquer pour soumettre le formulaire Eq Demander un devis ou nous contacter, n'hésitez pas à ajuster pour répondre à vos besoins.
4. Message à afficher après la soumission du formulaire avec succès – Ce message s'affichera après utilisation réussie de la soumission du formulaire.
5. Autoriser l'insertion de leads en double dans une base de données ? – Souvent, dans les formulaires Web to lead, des leads en double sont insérés dans la base de données. Perfex CRM a la capacité d'empêcher que cela se produise en créant automatiquement le prospect en tant que tâche, y compris toutes les données du formulaire en tant que description au lieu de les insérer directement dans la base de données des prospects. Dans ce cas, le membre du personnel responsable devra analyser les données du prospect et prendre actions supplémentaires.
6. Source - Source de plomb par défaut
7. Statut – Le prospect devra être en statut après avoir été importé avec succès dans la base de données Perfex CRM.
8. Responsable – Attribuez automatiquement le lead à un membre du personnel spécifique.
9. Paramètres de notification - Tous les utilisateurs basés sur le type de notification seront notifiés via une notification intégrée dans Perfex CRM et en outre, le membre du personnel responsable recevra une notification par e-mail si dans Configuration-> Modèles d'e-mail -> Nouveau responsable affecté au membre du personnel n'est pas coché. comme désactivé.
10. Recaptcha – Vous pouvez utiliser Google Recaptcha pour empêcher le spam. Le champ pour Google Recaptcha ne s'affichera que si vous avez préalablement configuré les clés de recaptcha .

Après avoir créé le formulaire, 2 nouveaux onglets s'afficheront dans la zone du formulaire Générateur de formulaires et Code d'intégration.

• Form Builder – L'endroit où vous créez le formulaire et ajustez tous les champs dont vous avez besoin.
• Le code d'intégration est le code dont vous aurez besoin pour placer dans votre site Web le formulaire à afficher, notez qu'à partir du lien, vous pourrez voir que chacun pour avoir une clé unique.

Construire la forme

Lorsque vous enregistrez les paramètres de formulaire initiaux, vous serez automatiquement dirigé vers l'onglet Form Builder et sur le côté gauche, vous pourrez voir tous les champs de formulaire disponibles tirés du profil de prospect. Notez que si vous avez des champs personnalisés pour les prospects, vous pourrez facilement inclure vos champs personnalisés dans le formulaire par glisser-déposer.

Il n'y a qu'une exception où les champs personnalisés de type Lien hypertexte n'ont pas de prise en charge pour être inclus dans le formulaire Web to lead.

Pour ajouter un champ au formulaire, faites simplement glisser le champ vers la droite dans la zone de formulaire. 

Après avoir fait glisser le champ, vous pourrez voir sur le côté gauche la possibilité de faire glisser vers ce champ sera désactivée. Vous ne pouvez ajouter le champ dans le formulaire qu'une seule fois pour éviter toute confusion avec les données du formulaire.

Personnalisation des champs

Si les champs ne correspondent pas exactement à vos besoins, vous pouvez personnaliser les étiquettes, ajouter du texte d'aide, des espaces réservés et les rendre obligatoires. Lorsque vous faites glisser le champ dans la zone de formulaire, survolez simplement le champ en haut à droite, vous pourrez voir 2 boutons (modifier et supprimer)

Après avoir personnalisé le formulaire, cliquez sur le bouton en bas à gauche ENREGISTRER et cliquez sur l'onglet Code d'intégration pour obtenir le code que vous devez ajouter à votre site Web . Le code sera placé comme iframe et vous pouvez ajuster la largeur et la hauteur directement à l'extrait de code fourni par Perfex CRM.

Coiffant

Si vous avez besoin d'adapter la couleur des champs de saisie à votre site Web, vous pouvez créer un fichier custom.css dans assets/css et appliquer les styles nécessaires.

Exemple de modification de la couleur de la bordure des entrées :

body.web-to-lead input {
	border-color:red;
}

Exemple de modification de la  couleur d'arrière-plan du bouton d' envoi :

body.web-to-lead #form_submit {
	background:red;
}

body.web-to-lead #form_submit:hover,
body.web-to-lead #form_submit:active {
	background:green;
}

Rediriger l'utilisateur vers l'URL personnalisée après la soumission du formulaire

Via FTP/cPanel, allez dans application/helpers/ et créez (s'il n'existe pas) le fichier my_functions_helper.php et ajoutez l'extrait de code suivant :

hooks()->add_action('web_to_lead_form_submitted','my_web_to_lead_form_submitted_redirect_to_custom_url');

function my_web_to_lead_form_submitted_redirect_to_custom_url($data){
    echo json_encode(array(
      'success'=>true,
      'redirect_url'=>'http://yourcustomurl.com'
    ));
    die;
}

N'oubliez pas d'inclure le <? balise d'ouverture php en haut du fichier si elle n'est pas déjà ajoutée.

Inclure le logo dans le formulaire

Pour inclure le logo de votre entreprise dans le formulaire, vous pouvez partager ou intégrer l'URL avec le paramètre de chaîne de requête comme indiqué ci-dessous :

https://your-perfexcrm-installation.com/forms/wtl/715d3e13cea500fc168faa4e3dcb8e24?with_logo=1

Partage de lien direct

Les formulaires peuvent être partagés directement avec vos clients sans réellement intégrer le formulaire sur votre site web, cette fonctionnalité est utile par exemple si vous souhaitez inclure un lien dans les emails, SMS etc…

Pour que Perfex CRM puisse savoir que le lien du formulaire est partagé directement et non intégré dans un iframe, vous devez spécifier la chaîne de requête URL, dans ce cas, Perfex CRM fournira un meilleur style au formulaire.

https://your-perfexcrm-installation.com/forms/wtl/715d3e13cea500fc168faa4e3dcb8e24?with_logo=1&styled=1

Créer des mises en page de formulaires multi-colonnes dans le formulaire Web To Lead (disponible à partir de la v1.9.0)

Par défaut, les champs du formulaire seront ajoutés dans une seule colonne sur toute la largeur du document si vous souhaitez personnaliser le formulaire et afficher les champs dans plusieurs colonnes, nous avons ajouté la possibilité d'y parvenir avec des classes personnalisées appliquées au champ, vous peut ajouter jusqu'à 12 colonnes sur 1 ligne.

Dans l'exemple suivant, nous allons créer 2 champs sur 2 colonnes et 1 ligne.

Gardez à l'esprit que les colonnes ne seront pas appliquées dans le générateur de formulaire, uniquement lorsque le formulaire est affiché en accédant au lien d'intégration ou dans un iframe.

Voici un exemple rapide :

Résultat final:

Supposons que dans votre générateur de formulaires, vous avez 4 champs, comme dans l'ordre Nom, Adresse e-mail, Société, Adresse.

Pour les 2 premiers champs, cliquez sur le bouton MODIFIER en haut à droite de l'enveloppe de champ pour faire glisser la zone d'édition vers le bas, dans l'entrée de classe, ajoutez une classe supplémentaire pour les deux champs form-col-6, comme indiqué dans l'image ci-dessous.

Enregistrez le formulaire en cliquant sur le bouton Enregistrer et prévisualisez le formulaire à partir du lien d'intégration pour voir le résultat final.

Comme mentionné précédemment, vous pouvez ajouter jusqu'à 12 colonnes, dans ce cas, form-col-6 + form-col-6 = 12, au cas où vous voudriez ajouter 3 colonnes, appliquez la classe form-col-4 sur 3 champs (formulaire -col-4*3 champs seront 12 et les champs s'adapteront au document) qui sont un par un dans l'ordre.

Peu de choses à considérer

1. Ne laissez jamais le formulaire sans champs obligatoires . Par défaut, le champ du nom sera obligatoire et il n'est pas recommandé de le décocher si nécessaire.
2. Lorsque vous placez l'extrait de code iframe, vous devez tenir compte de quelques éléments.
   1. Si le protocole de votre installation Perfex CRM est HTTP, utilisez une page HTTP à l'intérieur de l'iframe.
   2. Si le protocole de votre installation Perfex CRM est https, utilisez une page https à l'intérieur de l'iframe.
   3. En résumé, aucune installation SSL Perfex CRM n'aura besoin de placer le lien dans la page de destination sans eq SSL et en arrière, les sites Web SSL avec installation SSL Perfex CRM et aucun site Web SSL avec aucune installation SSL Perfex CRM. Vous pouvez en savoir plus à ce sujet  ici