Obtenir un rendez-vous

Nous avons reçu votre message et vous contacterons bientôt.

Merci d'avoir choisi prositeweb, votre agence de développement web à Montréal. Veuillez nous appeler au +1 (514) 548-2165 si vous avez besoin d'un soutien immédiat.

Envoyez des SMS depuis votre site web avec cette astuce. (guide détaillé)

Souhaitez-vous envoyer des SMS à vos clients depuis votre site web ? Ce petit tutoriel vous montrera comment y parvenir. En trois étapes seulement, nous allons voir comment créer un compte Twilio, ajouter un SDK sur un projet et créer un formulaire pour envoyer des SMS.

Envoyer des SMS depuis votre site web avec Twilio peut être facile, selon le langage de programmation que vous utilisez. Le marketing par courriel et les appels téléphoniques sont devenus relativement compliqués. En effet, une étude a pu démontrer que le taux d’ouverture des courriels a relativement baissé les dernières années. Si vous avez un site web et que vous avez l’intention d’essayer le marketing par SMS comme moyen supplémentaire de cibler les clients, cet article est pour vous.

Dans le présent article, nous regardons comment vous pouvez envoyer des SMS depuis votre site web avec Twilio. À la fin de l’article, vous pourrez ajouter le SDK Twilio à votre projet et ajouter un formulaire pour envoyer des SMS. Vous verrez également comment obtenir un numéro Twilio et une API pour votre projet.

Condition préalable au tutoriel

Notre article est destiné à trois types de profils:

  • Les développeurs — qui souhaitent apprendre comment le faire par eux-mêmes (suivre les étapes).
  • Un propriétaire d’entreprise — qui n’a pas assez de temps et veut une solution utilisable (Télécharger le code).
  • Un individu quelconque — qui est curieux et désirerait apprendre.

Requis pour les développeurs

Pour suivre ce tutoriel et l’appliquer facilement à votre projet, vous devez avoir les bases suivantes :

  • Des compétences de base en PHP.
  • Comprendre le fonctionnement des balises HTML.
  • Quelques compétences en matière de programmation web.

Pour un propriétaire d’entreprise

Vous pouvez lire l’article pour comprendre comment ça fonctionne. Cependant, nous avons prévu deux options qui peuvent vous aider:

Veuillez nous contacter si vous avez des questions.

[the_call_to_action title= »Obtenez une copie du code d’envoi des SMS à partir de votre site. Le code est prêt à l’usage et documenté » action_text= »Téléchargez » action_type= »modal »  action_link= »exampleModal » data_title= »Obtenez le lien de téléchargement l’extension directement dans votre courriel » data_action = »telechargement » data_link= »prositeweb_paiement »]

Une approche pour développeurs permettant d’intégrer l’envoie des SMS

Pour configurer être en mesure d’envoyer des SMS depuis votre site, vous devez suivre les étapes ci-dessous.

Étape 1 – Créer un compte Twilio et obtenir les paramètres

Pour commencer, vous devrez créer un compte Twilio et acquérir certains paramètres tels que : sid API, le code d’authentification API et le numéro de téléphone. Par exemple, dans votre tableau de bord, vous pouvez créer des informations d’authentification API pour votre projet. Lorsque vous vous inscrivez, vous acquérez un numéro de téléphone personnalisé que vous pouvez utiliser pour automatiser l’envoi de SMS.

Comment créer un compte Twilio

Pour créer un compte Twilio, rendez-vous sur le site twilio.com et cliquez sur « s’inscrire ». De là, vous verrez un formulaire d’inscription qui vous donne la possibilité d’essayer gratuitement. L’étape suivante consistera à saisir l’adresse électronique, ensuite le mot de passe dont vous avez besoin. Ensuite, le logiciel vous enverra une confirmation par courriel, à partir de laquelle vous pourrez approuver votre compte et lui accéder. Dans un premier temps, vous disposerez d’un crédit gratuit que vous pourrez utiliser pour envoyer des SMS depuis votre site ou bénéficier d’autres services Twilio.

Formulaire de création de compte Twilio

Remarques

La procédure de création d’un compte sur Twilio peut changer en fonction de leurs conditions générales. Je vous conseille de suivre et de lire les étapes de la procédure d’inscription.

Obtenir le SID de l’API et le code d’authentification

Après avoir créé votre compte puis vous être connecté à votre tableau de bord, vous trouverez votre Compte SID ensuite votre code d’authentification sous l’onglet Tableau de bord ⇒Général (le lien est console/project/settings). Vous pouvez alors copier ces deux informations pour votre projet.

Obtenez votre numéro de compte Twilio

Pour avoir votre numéro de téléphone Twilio, cliquez sur le panneau à trois points du menu en bas à gauche, puis un onglet de menu affichera le lien du menu. À partir de là, vous verrez un relevé des numéros de téléphone sous la rubrique super réseau.

Étape 2 – Les classes PHP de Twilio

Grâce aux classes PHP ou au SDK, vous pourrez interagir facilement avec les API. Vous pouvez soit utiliser le compositeur pour télécharger, soit le faire manuellement. Alors, nous recommandons généralement le Compositeur, car il se télécharge avec toutes les mises à jour. Une mise à jour manuelle peut être obsolète ou manquer de dépendance. Par ailleurs, nous allons voir comment utiliser les deux approches :

Télécharger en utilisant le Compositeur et générer le fichier « Composer.phar ».

Par ailleurs, vous trouverez plus d’informations sur l’utilisation du compositeur sur le site getcomposer.org. Ainsi, vous y repèrerez des instructions ainsi qu’une documentation détaillée sur la manière d’utiliser le compositeur dans le cadre d’un projet.

Notez que vous devez avoir accès à la ligne de commande pour utiliser et télécharger le compositeur.

Vous trouverez ci-dessous les étapes générales :

  • Sur le site web getcomposer.org, cliquez sur le bouton « Getting Started ». Vous verrez la documentation pour créer le fichier composer.phar.

En utilisant la ligne de commande, vous pouvez exécuter le code ci-dessous.


php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"
php -r "if (hash_file('sha384', 'composer-setup.php') === 'e0012edf3e80b6978849f5eff0d4b4e4c79ff1609dd1e613307e16318854d24ae64f26d17af3ef0bf7cfb710ca74755a') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"
php composer-setup.php
php -r "unlink('composer-setup.php');"

Notez que vous devrez peut-être changer la version du sha256 en fonction de la version actuelle. Consultez l’article sur le site getcomposer.org pour plus de détails.

L’exécution du code ci-dessus générera le fichier composer.phar. Pour obtenir le fichier composer.json, vous pouvez procéder comme suit :

Générer le fichier composer.json pour télécharger le SDK Twilio

Si vous souhaitez avoir plus d’informations sur la façon de créer le fichier composer.json, vous pouvez vous référer à la documentation officielle. Pour ce tutoriel, il vous suffit de créer le fichier composer.json et de coller le code suivant.


{
    "require": {
        "twilio/sdk": "^6.5"
    }
}

Ensuite, à partir de la ligne de commande, vous pouvez exécuter le code

composer require twilio/sdk

Si vous suivez attentivement les instructions, vous verrez un nouveau dossier appelé vendor dans votre répertoire principal avec quelques fichiers PHP pour vos projets.

Inclure le Twilio SDK dans votre projet

Si vous avez suivi attentivement les étapes ci-dessus, vous pouvez maintenant inclure le SDK et commencer d’envoyer des SMS depuis votre site web. Le code ci-dessous vous aidera à envoyer des SMS à n’importe qui depuis votre site web.


<?php
// Required if your environment does not handle autoloading
require __DIR__ . '/vendor/autoload.php';

// Use the REST API Client to make requests to the Twilio REST API
use Twilio\Rest\Client;

// Your Account SID and Auth Token from twilio.com/console
$sid = 'ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX';
$token = 'your_auth_token';
$client = new Client($sid, $token);

// Use the client to do fun stuff like send text messages!
$client->messages->create(
    // the number you'd like to send the message to
    '+15558675309',
    [
        // A Twilio phone number you purchased at twilio.com/console
        'from' => '+15017250604',
        // the body of the text message you'd like to send
        'body' => 'Hey Jenny! Good luck on the bar exam!'
    ]
);
?>
Instructions pour l’utilisation du code
  • Remplacez-le sid (ligne 9) ainsi que le code (ligne 10) par l’identification que vous avez obtenue à l’étape 1.
  • Vous pouvez ensuite remplacer le numéro de téléphone de la ligne 16 par le numéro de téléphone du destinataire (la personne à qui vous souhaitez envoyer un SMS).
  • Enfin, à la ligne 19, vous remplacerez le numéro de téléphone par votre numéro de téléphone Twilio.

Étape 3 – Créer un formulaire pour envoyer des SMS à partir de votre site web

Présentement que vous avez le code pour envoyer un SMS, vous pouvez créer un formulaire qui vous évitera de le faire manuellement. Par exemple, avec le code ci-dessus, vous pouvez modifier le message, le numéro de téléphone du destinataire pour envoyer le SMS. Toutefois, si vous souhaitez automatiser le processus, vous pouvez créer un formulaire à partir de votre tableau de bord pour y parvenir. Vous trouverez ci-dessous un exemple de formulaire que vous pouvez utiliser.

Exemple de code HTML-index.html

Le code HTML correspondant au formulaire ci-dessus est le suivant.


<!DOCTYPE html>
<html lang="en">
<head>
  <title>Send SMS</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <h2>Send an SMS</h2>
  <form action="sendsms.php" method="POST">
    <div class="form-group">
      <label for="email">Send SMS to (Phone number)</label>
      <input type="tel" class="form-control"  placeholder="Enter the phone number" name="phonenumber">
    </div>
    <div class="form-group">
      <label for="pwd">Send SMS to (Name)</label>
      <input type="text" class="form-control"  placeholder="Enter the name" name="receiverrname">
    </div>
    <div class="form-group">
      <label>
         Message to send
      </label>
      <textarea  class="form-control" placeholder="your message" name="receivermsg"></textarea>
    </div>
    <button type="submit" class="btn btn-primary form-control">Submit</button>
  </form>
</div>

</body>
</html>

Exemple de code de fichier d’action PHP-sendms.php

En plus du code HTML, nous aurons besoin d’un fichier d’action (PHP) qui recevra une variable et l’enverra au destinataire du SMS. Le PHP d’action peut ressembler au code ci-dessous :


<?php
function removespecials($data) {
   $data =  strip_tags($data);
  $data = trim($data);
  $data = stripslashes($data);
  $data = htmlspecialchars($data);
  return $data;
}
$receiverNumber=removespecials($_POST['phonenumber']);
$receiverName=removespecials($_POST['receiverrname']);
$receivermsg=removespecials($_POST['receivermsg']);
$message="Hello ".$receiverName." \n  ".$receivermsg;
// Required if your environment does not handle autoloading
require __DIR__ . '/vendor/autoload.php';

// Use the REST API Client to make requests to the Twilio REST API
use Twilio\Rest\Client;

// Your Account SID and Auth Token from twilio.com/console
$sid = 'ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX';
$token = 'your_auth_token';
$client = new Client($sid, $token);

// Use the client to do fun stuff like send text messages!
$client->messages->create(
    // the number you'd like to send the message to
    $receiverNumber,
    [
        // A Twilio phone number you purchased at twilio.com/console
        'from' => '+15017250604',
        // the body of the text message you'd like to send
        'body' => $message
    ]
);
?>

Conclusion

Le processus d’envoi de SMS depuis votre site web est assez simple avec Twilio. Vous pouvez utiliser différents langages de programmation. Aussi, si vous avez des compétences dans le développement de plugins ou d’extensions, il pourrait être une bonne idée de le convertir en une extension CMS. En cas de questions, Veuillez nous contacter ; nous serons heureux de vous aider.

Partager :

npgilblas

Agence de création de site web à Montréal

Comment importer Automatiquement les données de Centris à Votre site web
12 juillet 2022
Comment Intégrer le module de paiement Stripe sur son site WooCommerce?
06 juillet 2020

Avez-vous un projet en tête? Contactez notre Agence web pour une évaluation gratuite.

Si vous recherchez une agence web basée à Montréal capable de vous accompagner en développement Backend et Frontend, Contactez-nous.