Sitenizi ziyaret edenlere bu iletişim kanalından ulaşmak istiyor musunuz? WhatsApp iletişim özelliğini sitemize nasıl ekleriz? Siteye WhatsApp iletişim butonu ekleme işlemi zor değil, bu yazımda yine basit bir şekilde anlatmaya çalıştım.

WhatsApp kullanımı artık can sıkıcı bir biçimde arttı ve bu uygulamanın yüklü olmadığı telefon yok sanırım. Böyle olunca uygulama canımızdan bezdirse de sitemize bu iletişim yöntemini eklemek istiyoruz. Geçenlerde bir ziyaretçimin bunu nasıl yaptığımı sorması üzerine bu yazıyı yazmaya karar verdim.

Ne kullanacağız, nasıl yapacağız?

Bu işlem için bir eklenti kullanmadım. Hazır bir kod var ve bu kodu düzenleyip sitemize ekleyeceğiz. Bahsettiğim kod Getbutton.io adlı bir site içerisinden oluşturuldu. Altyapısını da bu site sağlıyor. Sitenizde kullanabileceğiniz kodu aşağıya ekledim.

Kod düzenleme

Sitenize WhatsApp iletişim butonu ekleyebilmek için aşağıdaki kodu kullanabilirsiniz.

<!-- WhatsApp ekleme -->
<script type="text/javascript">
    (function () {
        var options = {
            whatsapp: "905320000000", // WhatsApp numarası
            call_to_action: "Merhaba, nasıl yardımcı olabilirim?", // Görüntülenecek yazı
            position: "left", // Sağ taraf için 'right' sol taraf için 'left'
        };
        var proto = document.location.protocol, host = "getbutton.io", url = proto + "//static." + host;
        var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = url + '/widget-send-button/js/init.js';
        s.onload = function () { WhWidgetSendButton.init(host, proto, options); };
        var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
    })();
</script>
<!-- WhatsApp ekleme -->

Yukarıda 3 kısımda düzenleme yapabilirsiniz, diğer kısımlarda bir değişiklik yapmayın. Birincisi ve mutlaka yapılması gereken whatsapp: ile başlayan satır. Buradaki numarayı kendi numaranız ile değiştirin.

İkinci kısım siteye eklenecek butonun yanında çıkacak yazı (“Merhaba, nasıl yardımcı olabilirim?“), bunu kendi istediğiniz bir cümleyle değiştirebilirsiniz.

Son olarak position: şeklinde başlayan satır var, butonun sitede duracağı yerin ayarı. Sitenizde iletişim butonunu sayfanın sağ alt köşesinde göstermek için “right”, sol alt köşesinde göstermek için “left” şeklinde ayarlayabilirsiniz.

Hazırlanan kodu siteye ekleme (Manuel Yöntem)

Düzenlediğiniz kodu sitede header.php dosyasına ekleyeceğiz. Bunun için sitenizin Yönetici Paneline giriş yapın ve Görünüm menüsünde en altta bulunan Düzenleyici sekmesini tıklayarak sayfayı açın. Sağ tarafa tema php sayfaları gelecek. Bunlardan header.php yazan dosyayı seçin.

Düzenlemesini yaptığınız kodu </head> ile biten satırın üzerine yapıştırın ve kaydedin.

Hazırlanan kodu siteye ekleme (Eklenti ile)

Ben fazla eklenti kullanma taraftarı olmadığımdan manuel olarak ekleme yaptım. Eğer bu yöntem zor gelecekse WhatsHelp Chat Button eklentisi yardımıyla kodu sitenize ekleyebilirsiniz. Kullanımı çok basit ve eklentinin sayfasında anlatılıyor.

Artık sitenizin sağ veya sol alt köşesine iletişim butonu eklenecek. Mobil kullanıcılarınız butonu tıkladığında WhatsApp açılacak ve size direkt mesaj yazabilecekler. Masaüstü bilgisayar veya notebook gibi bir cihazda buton tıklanırsa WhatsApp Web uygulama sayfası açılacak ve buradan size yazabilecekler.

Sanırım sade ve kısa bir anlatım oldu. Herkese iyi bloglamalar…