Merhabalar,
Bu yazımda web sitesine WhatsApp sohbet butonu nasıl ekleyebiliriz bundan bahsedeceğim. Ekleyeceğimiz buton masaüstü için web sürümüne, mobil için ise WhatsApp’ın kendi uygulamasına yönlenecek şekilde olacaktır.
WhatsApp kendi web sitesinde de bu işlemi tek bir linke bağladı. Bize sadece telefon numarasını eklemek ve hazırda bir mesaj göndermek istiyorsak mesajı yazmak kalmaktadır.
Aşağıya basit bir şekilde “/” işaretinden sonra girdiğiniz telefon numarasına yönlenecek bir WhatsApp bağlantısı ekledim.
<a href="https://wa.me/905XXXXXXXXX" target="_blank">Tıkla Sohbet et</a>
Yukarıda görmüş olduğunuz basit bir WhatsApp yönlendirme butonudur. Yeni Sekmede Link açmak için ise target niteliğini kullandık.
Dikkat etmeniz gerekenler;
- Ülke kodunun başında (+) gibi işaretler kullanmamanız.
- (555) gibi numaranın ilk 3 rakamını parantez içine almamanız ve direkt yazmanız.
Özetle href içine yazdığınız linkte herhangi bir özel karakter kullanmayın.
Girdiğiniz numaraya yönlendirirken bir hazır metin mesajı ile yönlendirmek isterseniz bunu numaranın sonuna ?text= parametresini ekleyerek yapabilirsiniz.
Tabii ki URL ile metin yazmanın bazı sınırları ve kuralları olacaktır. Çok uzun bir metin girmenizi önermem sadece bilmeniz gereken mesajınızda eğer boşluk varsa bunu “%20” değeri ile değiştirmelisiniz.
Sanırım bir örnek görmek istiyorsunuz 🙂 Aşağıda hazır metin mesajı ile bir WhatsApp bağlantısı bırakıyorum;
<a href="https://wa.me/905XXXXXXXXX?text=Merhaba,%20web%20sitenizden%20ulaşıyorum;%20">Tıkla Sohbet et</a>
Mesajın içinde boşluk yerine söylediğim gibi “%20” kullanıyorsunuz olay bu kadar basit.
WhatsApp’ın kendi web sitesinden de örnekleri inceleyebilirsiniz: Tıkla sohbet et özelliği nasıl kullanılır ?
Bu bağlantı mobilde de masaüstünde de işinizi görecektir.
Buton şeklinde görünümü için videomu izleyebilirsiniz. İkon seçimi ve konumlandırmasına kadar detaylı olarak videomda anlattım. CSS tarafı için yazılarıma göz atabilirsiniz.
Umarım işinize yarar.
Mutlu Kodlamalar 🙂