Css Kısmı
<style>
#whatsappButton {
position: fixed;
bottom: 20px;
left: 20px;
background-color: #25d366;
color: #fff;
padding: 10px;
border: none;
border-radius: 50%;
cursor: pointer;
font-size: 16px;
z-index: 9999; /* Yüksek bir z-index değeri belirleyerek en üstte olmasını sağlar */
}
#whatsappButton img {
width: 32px; /* Resmin genişliğini ve yüksekliğini ihtiyaca göre ayarlayabilirsiniz */
height: auto; /* Otomatik yükseklik ayarı */
}
#whatsappButton:hover{
background-color: #98e794;
}
</style>
Js Kısmı
<script>
// WhatsApp numarasını aşağıdaki gibi güncelleyin
var whatsappNumarasi = "+90123456789";
var message = "Merhaba! Ürünleriniz Hakkında Bilgi Almak İstiyorum.";
// WhatsApp butonu oluşturuluyor
var whatsappButton = document.createElement("button");
// Resmin yolunu ve adını aşağıdaki gibi güncelleyin
var imagePath = "https://cdn-icons-png.flaticon.com/64/1384/1384023.png";
var imageAlt = "WhatsApp";
// Resmi butona ekleyin
whatsappButton.innerHTML = '<img src="' + imagePath + '" alt="' + imageAlt + '">';
whatsappButton.id = "whatsappButton";
// WhatsApp butonu tıklandığında yönlendirme gerçekleşiyor
whatsappButton.addEventListener("click", function () {
window.location.href = "https://api.whatsapp.com/send?phone=" + whatsappNumarasi+ "&text=" + encodeURIComponent(message);
});
// Sayfanın en üst katmanına WhatsApp butonunu ekliyor
document.body.insertBefore(whatsappButton, document.body.firstChild);
</script>