Web sitenize ücretsiz bir WhatsApp sohbet aracı nasıl eklenir: basit wa.me bağlantı yaklaşımı ve özelleştirilebilir, kodsuz bir parça çıkaran bir oluşturucu.
Web sitenize ödemeden bir WhatsApp sohbet aracı eklemenin iki gerçek yolu vardır: düz bir wa.me bağlantısı yapıştırıp kendi stilinizi uygulamak ya da bitmiş, özelleştirilebilir bir parça sunan bir oluşturucu kullanmak. Her ikisi de tamamen ücretsizdir ve her ikisi de birkaç dakika alır. Sadece altı ay sonra çok farklı yerlerde bulunursunuz.
Bu her ikisini de açıklıyor ve basit bağlantıyla başlıyor, böylece atladığınız şeyi tam olarak bilirsiniz.
Mutlak minimum sürüm tek bir HTML satırıdır:
<a href="https://wa.me/15551234567?text=Hi%2C%20I%20have%20a%20question">Chat with us</a>15551234567 yerine numaranızı tam uluslararası biçimde koyun, artı işareti yok, boşluk yok, başında sıfır yok. text parametresi önceden doldurulmuş bir mesajdır, URL kodlanmış, bu nedenle %20 bir boşluk ve %2C bir virgüldür. Tıkladığınızda WhatsApp açılır ve bu mesaj zaten kutunun içinde yazılı, ziyaretçi gönder düğmesine basması için hazır.
wa.me Meta’nın kendisinin bu için kısa bağlantısıdır, bu nedenle diğer taraftaki davranış tutarlıdır: telefonda, uygulama yüklüyse WhatsApp uygulaması doğrudan açılır, değilse ziyaretçi uygulama mağazasına gönderilir. Uygulama yüklü olmayan bir masaüstü tarayıcısında, bunun yerine web.whatsapp.com yeni bir sekmede açılır. Tüm bu algılamayı kendiniz oluşturmanız gerekmez, bu da bu yaklaşımın gerçekten sizin için çözülen tek kısmıdır.
Geri kalan hiçbir şey değildir. O tek bağlantı sadece nereye koyarsanız orayı koyu mavi renkli altı çizili metin ile olur. Bunu, insanlar “WhatsApp sohbet aracı” derken gerçekte kastettiği kayan alt köşe düğmesine dönüştürmek için CSS’yi kendiniz yazıyorsunuz:
<a href="https://wa.me/15551234567?text=Hi%2C%20I%20have%20a%20question"
target="_blank" rel="noopener"
style="position:fixed; bottom:20px; right:20px; z-index:5000;
width:56px; height:56px; border-radius:50%;
background:#25D366; display:flex; align-items:center;
justify-content:center; box-shadow:0 2px 8px rgba(0,0,0,.25);">
<img src="/whatsapp-icon.svg" alt="Chat on WhatsApp" width="28" height="28">
</a>Bu çalışır, ama şimdi bir ikon dosyasına, çerezler pankartınızın ve tüm kalıcı öğelerin üzerinde oturmak için yeterince yüksek bir z-index değerine, mobil cihazlarda kendi gezinti ekranınızı kapatmadan üstüne sahip olmanız gerekir ve birisi gelecek ay mesaj metni değiştirilmesini isterse ne olacağı için bir planınız var, bu da bu işaretleme bloğunu açmak anlamına gelir, nereye yapıştırılırsa oraya, içeren veya şablon her sayfada.
WhatsApp Sohbet Aracı Oluşturucu yukarıdaki bağlantının aynı işini yapar, artı stil, konumlandırma ve ikon, ve geri döner bir komut dosyası etiketi yerine bir özel CSS bloğu yerine siz bakım konusunda sorumlu.
İşte gerçek izlenecek yol:
#25D366) varsayılandır, ancak sitenizin marka rengine uymak istiyorsanız alan herhangi bir onaltılık değer alır.text parametresi ile aynı fikir, ancak URL kodlanmış bir dize yerine form kaynağından düzenlenebilir.Formu doldurdukça, düğmenin canlı bir ön izlemesi sayfada belirir ve kod paneli onun yanında gerçek zamanlı olarak bitmiş parça ile güncellenir:
<script src="https://cdn.thechatquotient.com/widget/v1/widget.js"
data-widget-id="wgt_xxxxxxxx"
data-whatsapp-number="15551234567"
data-color="#25D366"
data-position-vertical="bottom"
data-position-horizontal="right"
data-offset-vertical="20"
data-offset-horizontal="20"
data-z-index="5000"
data-greeting="Hi! How can we help?"
async
defer
></script>Kopyala ye tıklayın, sitenizde </body> kapanış etiketinin önce herhangi bir yere yapıştırın ve aracı canlıdır. Başka bir şey yüklenmesi gerekmez, ikon dosyası yok, ayrı stil sayfası yok. Formdan her ayar (renk, konum, ofsetler, selamlama, açılır pencere) o bir etiketin üzerinde data- özniteliği olarak kodlanmış, böylece bütün şey tek bir yapıştırma olarak hareket eder.
İki çıktı yüzeyde benzer görünür, köşede bir düğme ki açar WhatsApp, ancak bunlar farklı yaşlanırlar.
El ile yuvarlanmış sürümle, her ayar satır içi stiller veya ayrı CSS dosya içinde gömülü bir değerdir. Selamlama değiştirmek, URL kodlanmış bir dize içinde text parametresini bulup düzenlemek anlamına gelir. Düğmeyi taşımak, çünkü yeni çerez pankartı bunu örtüyor, CSS’yi yapıştırdığınız her sayfa veya şablon üzerinde yeniden düzenlemeyi anlamına gelir ve biri unuttuysa, bu sayfa sessizce kırmış görünen bir aracıya sahip olur, ta ki birisi fark et. Bunların hiçbiri yüksek sesle başarısız olmaz, sadece sayfa sayfa senkronizasyon dışına kayar.
Üretilen parça her ayarı bir formdan saniyeler içinde yeniden kopyalayabileceğiniz bir satırda bir etiket olarak tutarak yaklaşık tutar, sonra sitenizde bulup değiştirin paylaşılan üstbilgi veya altbilgi dahil etme kullanmıyorsanız. Ve gerçek düğme mantığı yapıştırdığınız kod yerine işaret ettiği barındırılan komut dosyası dosyasında yaşadığı için, aracı hata düzeltmeleri ve davranış iyileştirmeleri sitenize bir kez daha dokunmadan gönderir.
Mekanikler her yerde aynıdır: parçayı her sayfada oluşturan bir yere koyun, tercihen sadece </body> önce.
theme.liquid içine yapıştırın, sadece </body> etiketini kapat, çevrimiçi mağaza yoluyla, temaları, kodu düzenle.Bunların her birinin kendi tuhaflıkları vardır, daha uzun bir bakış değer bir yerde, biz ayrı ayrıntı olarak WordPress’i ele alacağız, ancak yapıştırma adımının kendisi her yerde aynıdır: bir komut dosyası etiketi, bir yer, bir kez tüm sayfalarda uygulanır.
Siteyi özel bir pencerede yükleyin, böylece önbelleğe alınan stiller gerçek bir sorunu gizlemez, ve masaüstünde ve gerçek telefonda düğmeyi kontrol edin, sadece yeniden boyutlandırılmış tarayıcı penceresi değil. Her birinden bir kez tıklayın ve WhatsApp’ın açıldığını onaylayın, mobil cihazlarda uygulama, numaranız ve selamlama mesajı zaten doldurulmuş masaüstünde web.whatsapp.com. Sonra sayfa, herhangi bir çerez pankartı veya yapışkan öğeler görünür, en yaygın başarısızlık bu noktada, z-dizin çatışmasıdır, burada aracı tamamında kalan bir sabit konumlandırma öğesi yerine onu oluşturur.
Bu gerçekten ücretsiz mi, yoksa bir tuzak mı var? Oluşturucu kendisi hesap gerektirmeden ücretsizdir. İşaret ettiği aracı betiği barındırılan ve hiçbir maliyet olmadan sunulur. Daha sonra The Chat Quotient’un Chrome eklentisini gelen sohbetleri yönetmek için yüklerseniz, bunun kendi ücretsiz planı vardır, ancak ayrı, isteğe bağlı bir adım, aracı kullanma gereksinimi değil.
WhatsApp aracı WhatsApp Web ile aynı mı?
Hayır ve bu yaygın bir karışıklık. WhatsApp Web (web.whatsapp.com) tarayıcıdan WhatsApp mesajları okumak ve göndermek için kullandığınız arabirimdir. WhatsApp aracı web öğesi, sitenize eklediğiniz küçük düğmedir ki tıklandığında bir sohbet açarsınız, mobil cihazda WhatsApp uygulamasında veya uygulama yüklü olmayan bir masaüstü cihazda WhatsApp Web’de. Aracı bir şey gömüyorsunuz; WhatsApp Web sonuç sohbetin açıldığı yerdir.
Ziyaretçinin WhatsApp yüklü değilse aracı çalışır mı? Mobil cihazda uygulamayı yüklemeden tıkladığında, ziyaretçi ilk olarak WhatsApp’ı yüklemek için uygulama mağazasına gönderilir. Bu adımın etrafında başka yol yoktur, bağlantı sadece WhatsApp’ın kendisine kaymak nasıl bildiğinden, başka bir mesajlaşma kanalı değil.
Aynı aracıda birden fazla WhatsApp numarasına sahip olabilir miyim, satış ve destek gibi? Bir düğmede değil. Aracı tek WhatsApp numarası başına örneğin etrafında inşa edilir. İkiye ihtiyacınız varsa, çıkış noktaları, farklı konumlarla ve selâmlamalarla iki aracı eklerdiniz, bu noktada bir adanmış kişi sayfası her ikisini de listeyerek ayrı ayrı, aynı köşede yığılmış iki kayan düğmeden genellikle ziyaretçiler için daha temizdir.
Oluşturucuyu kullanmak için kod bilmem gerekiyor mu? Hayır. Her ayar bir form alanıdır ve yapıştırdığınız tek şey ürettiği tek komut dosyası etiketidir, sitenizin hangi platform üzerinde çalıştığından bağımsız olarak aynı kopyala yapıştır adımı.
Bir wa.me bağlantısı gerçekten tüm ihtiyacınız olan şey, eğer kendi CSS yazma ve bakım konusunda rahat ve her değiştirilmesi gereken şey kodun ziyaret etmektir. WhatsApp Sohbet Aracı Oluşturucu aynı sonucu üretir, önceden doldurulmuş bir sohbet açan kayan bir düğme, CSS olmadan, ikon dosyası olmadan veya elle yuvarlanması gelen bakım olmadan, ve yine de ücretsizdir.
Chrome uzantısını ekleyin ve işletmeniz için WhatsApp sohbet yönetimini dönüştürün.