Telefon bağlantısı: “quot;& amp;CTA web sitenize
Birçok iş web sitesi, müşterilerinin onlarla iletişime geçebilmesi için telefon numaralarını gösterir. Bir masaüstü siteye erişmenin en popüler yolu olduğunda, kullanıcılar ayrı cihazlardan telefon numaralarını ve çağrıları kaydeder. Tabii ki, çoğu kullanıcı artık web sitelerine erişiyor ve aynı cihazdan telefon görüşmeleri yapıyor. Bu, bir arama bağlantısı eklemek için fırsatlar açar – tıklanan bir HTML telefon numarası oluşturun. Bu makalede, arama bağlantılarının ve e -posta ve diğer CTA gibi tıklanabilecek diğer birkaç bağlantının nasıl ekleneceğini göreceğiz.
YouTube kanalımıza, telefon numarası yapmak için çağrı bağlantısının nasıl çalıştığı HTML ile kolayca tıklanabilir. HTML5, tarayıcı tarafından kullanılabilecek tel: ve mailto: gibi protokolleri içerir. Tarayıcı bu protokole farklı yanıt verdi. Bazıları telefon uygulamasını başlatacak ve arama düğmesini tıklamanızı beklerken ekrana bir numara ekleyecektir. Diğerleri arayacak, diğerleri ise sorun olup olmadığını soracak. Bu HTML olduğundan, sitenizde başlıklar, altbilgiler, kenar çubukları, içerik ve sayfalar yayınlama ve widget dahil herhangi bir protokol ekleyebilirsiniz.
Web sitesine HTML Telefon Numarası Arayan Bağlantı ekleyin Metin olarak kodu eklersiniz Link’i getirmek istediğiniz konuma eklersiniz: > href = tel: Bir arama bağlantısı oluşturun. Bu, tarayıcıya numarayı nasıl kullanacağını söyler. “Tel: 123-456-7890” HTML telefon numarası yapmak. Alıntılardaki numara temasa geçilecek sayıdır. Tag> <'daki numara görsel bölümdür ve telefon numaraları, "çağrı için tıklayın" veya "şimdi iletişime geç" veya istediğiniz diğer oyunculuk davetiyeleri gibi satırlar da dahil olmak üzere ne istediğiniz şeklinde olabilir. Tıkladıklarında ne olacağı hakkında açıklayıcı olmalı. Numaralar yerine mesajları görüntülemek şöyle görünecektir: aramak için tıklayın Ziyaretçileriniz metni görecek ama Tıkladıklarında, numaranızla telefon görüşmesi ekranlarını, arama düğmesini tıklamaya hazırlar. Uzatma Ekleme Birkaç telefon numarasının bir uzantısı vardır. Uzantı numarasına başvurmadan önce kısa bir mola verecek bir kod ekleyebilirsiniz. Uzantının önüne P eklenmesi bir saniye eklenir. Kod şöyle görünebilir: aramak için tıklayın Numarayı arar, bir saniye bekleyin ve sonra uzantıyı arar.
P yerine W kullanarak çağrı tonunu beklemesini sağlayabilirsiniz. Durum kodunun durum kodunun eklenmesi, telefon numarasından önce ülke kodunuzla birlikte A + işaret eklenerek eklenebilir. Örnekler şöyle görünebilir: 123-456-7890 Yerel SEO için mikro veri ekleyin Akıllı telefonlar getirmek için en sevdiğim kolaylıklardan biri bir yerel aradığımda İş ve Google’daki sonuçlar bana tıklanabilecek bir telefon numarası verdi. Yazmak veya hatırlamaya çalışmak zorunda kalmadan çağrı yapmak için numarayı tıklayabilirim. Bu özellik artık bir zorunluluktur. Neyse ki, Google’ın telefon numaranızı yerel aramada sağlayabilmesi için web sitenize ekleyebilirsiniz.
Bu bir mikro veri ile yapılır. MicroData, arama motoruna numaranın bir telefon numarası olduğunu söyler, böylece tıklanabilecek bir tıklama bağlantısı olarak görüntülenir. Bunu, yerel arama için birkaç etiketle işaretlemeyi zenginleştirerek yapabilirsiniz. Örneğin, kod şu gibi görünebilir:
wordpress teması
Telefon:
234567890
HTML5 ile hareket etmek için başka bir davet, telefon numaralarıyla sınırlı değilsiniz. E -posta, mesaj, faks vb. Gibi diğer ACT davetiyeleri ekleyebilirsiniz. HTML5 protokolleri şunları içerir:
Tel: – Telefon görüşmeleri yapın
Mailto: – E -posta uygulamasını açın
Arayın: Açık Skype
SMS: – Metin Mesajları Gönder
Faks: – Faks Gönder
Tüm bu protokoller yukarıda gördüğümüz gibi kullanılır. Bazı örneklere bakalım. İletişim sayfasına iletişim bilgilerinize bir arama bağlantısı eklemek için en iyi yerlerden biri olan Kodu Küdük sayfanıza ekleyin. Klasik bir düzenleyici veya yeni bir Gutenberg editörü kullanmalısınız, sayfa metin sürümünü görmelisiniz. Klasik editörde Metin sekmesini tıklayın. Gutenberg’de sağ üstteki üç noktayı tıklayın ve kod düzenleyicisini seçin.
Kodu telefon numaranıza ekleyin.
Kod Düzenleyicisi’nden veya sayfalardan çıkın ve şimdi telefon numaranızın tıklanabilecek bir bağlantı olduğunu göreceksiniz. E -posta bağlantıları veya url için bir kod oluşturma e -posta için html kodu Mailto: Sonunda e -posta adresi eklendi: <a href = "mailto: tyail korumalı
Aşağıda SPA Düzen Paketi İletişim sayfasının bir örneği verilmiştir. E -Mail simgesi ve metin içeren bir açıklama modülü ekledim. Metin sekmesini seçtim ve bir e -posta html ekledim. Metin şimdi tıklanabilir ve e -posta uygulamanızı açacaktır. Açık URL’ye kod ekleme İstediğiniz URL’yi açmak için HTML’ye sahip olabilirsiniz. Bültenlerin, etkinliklerin vb. Kayıt için sayfaya okuyucu göndermek istiyorsanız bu iyidir. Bağlamak için HTML kodunuz URL’yi içerecektir. Örneğin: <a href="
Etkinlik sayfasını görmek için kodla başka bir açıklama ekledim. Masaüstü ve tablette devre dışı bırakın
Çağrı bağlantısıyla ilgili bir sorun, bağlantının masaüstü veya tablet için işe yaramaz olmasıdır. Her bir cihaz türü için belirli bir modül oluşturarak, ardından diğer cihazlarda devre dışı bırakarak DIVI ile bunun üstesinden gelebilirsiniz. Burada, telefon numarası ile iki modül yaptım: biri HTML telefon numaraları ve diğeri içermiyor. Tabletlere ve masaüstlerine tıklanabilecek numaraları olanları devre dışı bıraktım, böylece bağlantıyı asla görmeyecekler. Ayrıca cep telefonu için bağlantısı olmayan bir modülü devre dışı bıraktım, bu nedenle mobil kullanıcılar yalnızca bağlantılı modülleri görecek. Kodunuzu başlığınıza veya altbilginize ekleyin, tema düzenleyicisini kullanarak kodu üstbilginize veya altbilginize ekleyebilirsiniz. Her zaman çocuk temanızı kullanın veya temayı güncellediğinizde PHP kodunuzun üzerine yazılır. Bu, iyi görünmesini sağlamak için bazı CSS stillerinin gerektirilmesi gerekecektir.
Gösterge tablounuzda, görünüm> editör> tema üstbilgisi (veya tema altbilgisi) açın. Kodu bölümüne yerleştirin. Kapanış etiketini aradım. Kodu burada 28 ve 29. satırda görebilirsiniz. Bu, arama ve e -posta bağlantılarını yirmi on dokuz tema başlığına yerleştirdiğimde görünümdür. Var ve çalışıyor, ama çok güzel değil. Bu, birbirlerinden ayrı durmaları için renk ve marj alanı ekleyerek geliştirilebilir. Tabii ki, bu CSS’de yapılır. Bağlantıyı düzenleme Kodu ayarlamadaki ek CSS alanına eklemelisiniz. Kodunuz şöyle görünebilir: a [href^= “tel:”] { Renk: Kahverengi; Metin dekorasyonu: yok;
Marj-sağ: 0.em;
} a [href^= “mailto:”] {Turuncu renk;
Metin dekorasyonu: yok;
Marj-sağ: 0.8em;
}
Bu, CSS’ye tel: ve mailto için metin nasıl düzenleneceğini söyler:. Telefon numarası yazı tipini kahverengi, turuncu e -posta yazı tipine değiştirir ve her bağlantının sağına küçük kenar boşlukları ekler.
CSS işlevi, kod widget, post, vb. Metin yerine simgeyi bile kullanabilirsiniz. Kodu ikincil menüye ekleyin Divi Divi, telefon numaranızı ve e -postanızı başlığın üzerindeki ikincil menüye ekleyebilir. E -posta düğmesi varsayılan olarak tıklanabilir, ancak telefon numarası değildir. Telefon numaraları, önceki örnekte kullandığımız benzer HTML telefon numaraları kullanılarak arama bağlantılarına dönüştürülebilir.
Tema Ayarını Aç> Başlık ve Navigasyon> Başlık Elemanları.Bu size telefon numaranızı ekleyebileceğiniz metin kutusunu verecektir.Neyse ki, sayılarla sınırlı değilsiniz.HTML de ekleyebilirsiniz.Önceki örnekten HTML ekledim.Ayrıca, resmi görmeyi kolaylaştırmak için telefon numarası yazı tipinin boyutunu artırıyorum. Bağlantının görsel bölümüne bir mesaj ekleyerek tıklanabileceğini açıklayabilirsiniz.Numarayı mesajla değiştirebilir veya numaranın sonunda bir mesaj ekleyebilirsiniz.Bu şöyle görülebilir: 123-456-7890 Aramak için tıklayın
Bu örnek yalnızca metni gösterir.
Bunda, metinle birlikte bir telefon numarası ekledim.Cep telefonumda test etmek, çalıştığından emin olmak için mobil cihazlarla bağlantının test edilmesini öneriyor.Akıllı telefonunuza erişiminiz yoksa Google Chrome geliştiricilerini kullanabilirsiniz.
Sağ -Ana sayfanıza tıklayın ve inceleyin. Ekranın sol üst köşesinde bir cihaz listesi göreceksiniz. Web sitenizin ekranda görüntülenmesini görmek için birini seçin. HTML telefon numarası bağlantısını tıklamak, uygulamayı seçmenizi isteyen bir iletişim kutusu açar. Bunu görürseniz, bağlantı çalışıyor. Hala gerçek akıllı telefonda denemenizi tavsiye ederim, ancak bu, bağlantının bir şey yaptığının iyi bir göstergesidir. Eklenti ile bir arama bağlantısı ekleyin Başlık ile bir eklenti ile bir arama bağlantısı da ekleyebilirsiniz. Genellikle stilleri düzenlemek, hareket etmek için bazı davetiyeler eklemek ve ziyaretçilerin cihazlarına göre etkinleştirme veya devre dışı bırakılma yeteneği içerir. Ayrıca yönetilmesi ve kullanımı kolaydır. Kodu işlemek istemiyorsanız bu iyi bir seçimdir. İşte en iyi seçeneklerden bazıları. Telefon düğmesi şimdi aranıyor ve mobil ziyaretçileriniz için ekranın altını aramak için tıklama düğmesini ekliyor. Bu diğer cihazlarda görünmez. İsterseniz metin de ekleyebilirsiniz. Düğme telefon simgesidir, böylece ne olduğunu anlamak kolaydır. Tek yapmanız gereken düğmeyi etkinleştirmek ve telefon numaranızı girmek. Gelişmiş ayarlarda varsayılan davranışı değiştirebilirsiniz. Daha fazla bilgi yapışkan yan düğme Bu eklenti, web sitenizin yanına yapışan düğmeler eklemenizi ve kullanıcı kaydırıldığında ekranda kalmanızı sağlar.Telefon numaraları, e -posta adresleri, sosyal medya simgeleri ve tıklanan mağaza konumlarını ekleyebilirsiniz.Onları sağa veya sola ayarlayın, animasyon ve rollover stillerini seçin, rengi ayarlayın ve nerede görüntülendiklerini seçin.Daha fazla bilgi Bu Hız İletişim Çubuğu, telefon numaraları, faks numaraları, başlıklar, adresler, e -postalar, sosyal ağlar ve özel URL’ler için tıklanabilecek bağlantıları içeren iletişim bıçakları ekler.Bıçakları yukarı veya aşağı ayarlayın ve metnin ve bağlantıların boyutunu, rengini, rengini ve bıçakların nasıl tepki verdiğini ayarlayın.Boyutu da ayarlayabilirsiniz.FILTER HOC’u kullanarak daha fazla içerik ekleyebilirsiniz.Hücresel temaslar hakkında daha fazla bilgi için
