Siteye WhatsApp İletişim Butonu Ekleme

29 Kasım 2020 0 Yorum

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, belirtilen kodu uygun şekilde sitenize eklediğinizde hemen kullanabilirsiniz.


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

Bu işlem için bir eklenti kullanmaya gerek yoktur. 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ğıda bulabilirsiniz.

Kod Düzenleme

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


<!-- Pazaryeridestek.com 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>
<!-- Pazaryeridestek.com 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.

Hazırlanan Kodu Siteye Ekleme

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.