Bouton WHATSAPP
Sun Mar 30 2025 09:28:15 GMT+0000 (Coordinated Universal Time)
Saved by @Etiennette
<!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Bouton WhatsApp</title> <style> /* Style du bouton rectangulaire */ .whatsapp-button { position: fixed; bottom: 20px; /* Position en bas */ right: 20px; /* Position à droite */ background-color: #25D366; /* Couleur officielle de WhatsApp */ color: white; /* Couleur du texte */ border: none; border-radius: 5px; /* Coins légèrement arrondis */ display: flex; align-items: center; justify-content: center; padding: 10px 15px; /* Espacement intérieur */ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); /* Ombre légère */ cursor: pointer; font-size: 14px; /* Taille du texte */ font-family: Arial, sans-serif; /* Police du texte */ transition: transform 0.3s ease, background-color 0.3s ease; /* Animation au survol */ } /* Icône WhatsApp dans le bouton */ .whatsapp-button i { margin-right: 10px; /* Espace entre l'icône et le texte */ font-size: 18px; /* Taille de l'icône */ } /* Effet au survol */ .whatsapp-button:hover { background-color: #1ebe57; /* Couleur légèrement plus foncée au survol */ transform: scale(1.05); /* Légère augmentation de taille */ } </style> <!-- FontAwesome pour l'icône WhatsApp --> <script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script> </head> <body> <!-- Bouton WhatsApp --> <button class="whatsapp-button" id="whatsappBtn"> <i class="fab fa-whatsapp"></i> Posez des questions </button> <script> // Fonction pour ouvrir WhatsApp document.getElementById('whatsappBtn').addEventListener('click', function() { const phoneNumber = "23058009839"; // Numéro WhatsApp sans "+" ni espaces const message = "Bonjour, j'ai une question à propos de ."; // Message par défaut const whatsappURL = `https://wa.me/${phoneNumber}?text=${encodeURIComponent(message)}`; window.open(whatsappURL, "_blank"); // Ouvrir dans un nouvel onglet }); </script> </body> </html>
Comments