İçindekiler
Siteye Hemen Ara ve Whatsapp Butonu Ekleme
Siteye Hemen Ara ve Whatsapp Butonu Ekleme “Hemen Ara” ve “WhatsApp” butonları eklemek, kullanıcı deneyimini geliştirmenin ve müşteri etkileşimini artırmanın etkili yollarından biridir. Bu butonlar, ziyaretçilere iletişim kurma ve hızlı yanıt alma fırsatı sunar. İşte bu butonları web sitenize nasıl ekleyebileceğiniz hakkında bazı bilgiler:
Hemen Ara Butonu:
- Eklenti Kullanımı: WordPress gibi içerik yönetim sistemlerinde, “Hemen Ara” butonunu eklemek için birçok ücretsiz ve premium eklenti bulunur. Bu eklentiler sayesinde butonu hızla ekleyebilir ve gerektiğinde özelleştirebilirsiniz.
- HTML ve CSS: Hemen Ara butonunu manuel olarak eklemeyi tercih edebilirsiniz, HTML ve CSS bilginiz olmalıdır. HTML ile bir düğme oluşturun ve ardından CSS ile stil verin.
- Cep Telefonu Linki: Hemen Ara butonunuza tıkladığında telefon aramasını başlatması için bir “tel” bağlantısı ekleyin. Örneğin:
<a href="tel:+1234567890">Hemen Ara</a>
Aşağıdaki Yerleri Kendi numaranız ile değiştiriniz!
WhatsApp Butonu:
- WhatsApp Business: Eğer bir işletme olarak WhatsApp kullanıyorsanız, WhatsApp Business hesabı oluşturun. Ardından, resmi bir WhatsApp butonu almak için WhatsApp Business araçlarını kullanabilirsiniz.
- Eklenti veya Widget: WordPress gibi platformlarda, WhatsApp butonunu eklemek için çeşitli eklentiler veya widget’lar bulunur. Bu eklentileri yükleyin ve ayarlarınızı yapılandırın.
- Bağlantı Oluşturma: WhatsApp butonunuzu manuel olarak eklemek istiyorsanız, bir bağlantı oluşturabilirsiniz. WhatsApp numaranızı, ülke koduyla birlikte kullanarak bu bağlantıyı oluşturun:
https://api.whatsapp.com/send?phone=+1234567890
Aşağıdaki Yerleri Kendi numaranız ile değiştiriniz!
Sitenize eklemeniz gereken Bootstrap Kodu;
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.2.1/dist/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.2.1/dist/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
Sitenize eklemeniz gereken CSS Kodu;
.btn-get-started {
font-family: "Poppins", sans-serif;
text-transform: uppercase;
font-weight: 500;
font-size: 14px;
letter-spacing: 1px;
display: inline-block;
padding: 10px 28px;
border-radius: 4px;
transition: 0.5s;
color: #fff;
background: #106eea;
}
.btn-get-started:hover {
background: #247cf0;
}
.iletisimbutonlari {
position: fixed;
width: 100%;
z-index: 999;
bottom: 0px;
left: 0px;
}
.iletisimbutonlari a.btn {
width: 100%;
}
Sitenize eklemeniz gereken HTML Kodu;
<div class="iletisimbutonlari btn-group d-flex justify-content-between d-md-none" role="group" aria-label="...">
<a title="xxx Firma - Telefon Numarası" href="tel:+905555555555" class="btn btn-primary ">
<i class="icofont-ui-call"></i> <b> ŞİMDİ ARA</b>
</a>
<a title=" xxx Firma - Whatsapp" rel="nofollow" href="https://api.whatsapp.com/send?phone=+905555555555" target="_blank" class="btn btn-success ">
<i class="icofont-brand-whatsapp"></i> Whatsapp
</a>
</div>
Bu butonları eklerken dikkat etmeniz gereken bazı önemli noktalar:
- Butonların web sitenizde belirgin ve kullanıcı dostu bir konumda olmasını sağlayın.
- Mobil cihazlarda da düzgün çalışmasını sağlamak için butonların duyarlı (responsive) tasarlandığından emin olun.
- Butonların metinleri ve renkleri, web sitenizin tasarımına uygun olmalıdır.
“Hemen Ara” ve “WhatsApp” butonları eklemek, kullanıcılarınıza hızlı ve kolay bir iletişim seçeneği sunmanın yanı sıra müşteri memnuniyetini artırabilir. Bu butonlar, potansiyel müşterilerle daha etkili bir şekilde iletişim kurmanıza ve soruları hızla yanıtlamanıza yardımcı olabilir.
Sizlere Önerebileceğim Bir Kaç Makale;
Wordpress Hemen ara ve Whatsapp Butonu Eklentisi;
Easy Sticky Buttons
Easy Sticky Buttons eklentisi ile sitenizin mobil görünümünün alt kısmına 1 ila 4 adet yapışkan buton ekleyebilirsiniz.
Easy Sticky Buttons Eklentisi Kurulumu
Aşağıdaki “Easy Sticky Buttons” Eklentisini Kuruyoruz.
Easy Sticky Buttons Eklentisi Ayarları
Daha sonrasında aşağıda bulunan resimdeki gibi ayarlarımızı yapıyoruz. resimdekilerin birebir aynısını yapın “Icon Direction” ve “link” kısmını düzgün ayarladığınızdan emin olun!
Easy Sticky Buttons Eklentisi Mobil Görünüm
En son ayarlamalarınız düzgün ise bu şekilde gözükecektir iyi kullanımlar. Herhangi bir hata ile karşılaşırsanız lütfen yorumlar kısmına yazmayı unutmayınız.
WordPress Optimizasyonu ve Semantik Seo
Anahtar Kelime Araştırması: İçeriklerinizin Arama Motorlarında Daha İyi Sıralanması İçin İpuçları
Merhabalar. wordpress eklentisini kurdum ve yerlerini değiştirmek istiyorum nasıl yapabilirim?
Merhaba ahmet. yazıda belirttiğim gibi “Icon Direction” ve “link” Kısmını resimde olan ayarlara göre yaparsanız sorununuz çözülecektir.