Divi'nin Birincil Menüsüne Sosyal Simgeler Nasıl Eklenir
Yayınlanan: 2017-06-27Bugünün Divi eğitiminde, Divi web sitenizin ana menüsüne sosyal simgeleri nasıl ekleyeceğinizi göstereceğiz. Bu öğreticiyi adım adım izleyerek, oluşturduğunuz herhangi bir web sitesine, ister kendiniz ister bir müşteri için olsun, sosyal simgeler ekleyebileceksiniz.
Divi tema özelleştiricisi ile sosyal simgeleri doğrudan bir web sitesinin üstbilgisine ve altbilgisine ekleme olanağına sahibiz. Ancak aradığınız şey bu değilse, bu eğitim size yardımcı olabilir çünkü çoğu durumda; insanlar, web sitelerinin üstbilgisi veya altbilgisi yerine sosyal simgelerin birincil menülerinde olmasını tercih ediyor.
Bunları tam olarak nasıl ekleyebileceğinizi, nasıl özelleştirebileceğinizi ve yeni bir sekmede nasıl açacağınızı göstereceğiz. Bunlar, birincil menünüzdeki sosyal simgelerin tüm web sitenize katma değer getirebilmesi için gerçekten bilmeniz gereken şeylerdir.
Neden Birincil Menüye Sosyal Simgeler Eklemelisiniz?
Web siteleri ve sosyal medya kanalları çoğu durumda birbirini tamamlayıcı niteliktedir. Bir web sitesinde paylaşılan içeriğin tamamı sosyal medya kanallarında görünmez ve bunun tersi de geçerlidir. Bu nedenle sosyal medya kanallarınızda web sitenizi ve web sitenizde sosyal medya kanallarınızı tanıtmanız nadir değildir ve açıkçası; son derece teşvik edildi.
İnsanların şirketinizle veya markanızla en aşina oldukları şekilde etkileşim kurmasını istiyorsunuz. Web siteniz onlar için genellikle ' bilinmeyen bölge'dir . Bu nedenle, web siteniz aracılığıyla sizinle doğrudan iletişim kurmanın önündeki engel, sosyal medya kanallarından daha büyük olabilir. Facebook sayfanızı veya Twitter sayfanızı ziyaret eden çoğu kişi zaten platformlara entegredir ve rahatlık hissi davranışlarını olumlu yönde etkileyebilir.
Bu nedenle, genel olarak, web sitenize sosyal medya simgeleri koymak çok tavsiye edilir. Ama neden bunları birincil menünüzde açıkça paylaşıyorsunuz? Ana sebeplerden iki tanesini listeledik.
Bulması Kolay/Menü, Ziyaretleri Sırasında Ziyaretçiyi Takip Eder
Web sitenize sosyal simgeler eklerken, bunların mümkün olduğunca görünür olmasını istersiniz. İnsanlar, web sitenizdeki sosyal simgeleri bulmak için çaba harcamak zorunda kalmamalıdır. Sosyal simgeleri birincil menüye yerleştirmenin fark yaratabileceği yer burasıdır. Birincil menü, bir kişiyi web sitenizde kaldığı süre boyunca takip eder. Simgelere bakmanıza gerek yok, simgeler size geliyor. Kişinin yapması gereken tek şey tıklamak ve oraya varacaklar.
Birincil menü, bir kişiyi web sitenizde kaldığı süre boyunca takip eder. Simgeleri aramaya gerek yok, simgeler size geliyor. Bir ziyaretçinin yapması gereken tek şey üzerlerine tıklamak ve oraya varacaklardır.
Tetikleme Eylemi
Önceden belirtildiği üzere; sosyal medya kanalları ve web siteleri birbirini tamamlayıcı niteliktedir. Birlikte çalışırlar ve genellikle potansiyel müşterileri bilgilendirmek ve onları sunulan hizmetlere veya ürünlere çekmek gibi aynı hedeflere sahiptirler. Onlarla ne kadar çok yüzleşirlerse, meraklarının tetiklenmesi o kadar olasıdır.
Web sitesi ve sosyal medya kanalları arasındaki bağlantıyı desteklemek için, ziyaretçileri mümkün olduğunca sık sosyal simgelerle karşı karşıya getirmek iyi bir şeydir. Onlarla ne kadar çok yüzleşirlerse, merakları o kadar tetiklenir ve sonunda onlara tıklamaları daha olasıdır.
Divi'nin Birincil Menüsüne Sosyal Simgeler Nasıl Eklenir
Youtube Kanalımıza Abone Olun
Harika Yazı Tipi Yükle
Her şeyden önce, WordPress web sitemize Font Awesome'i yüklememiz gerekiyor. Bunu Divi'nin Tema Seçeneklerine biraz CSS kodu ekleyerek yapacağız.
WordPress web sitenizi açın, Divi > Tema Seçenekleri > Entegrasyon'a gidin ve aşağıdaki kodu <head> bölümüne yapıştırın:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" />
Yazı tipi harika artık web sitenizde kullanılan yazı tiplerine eklenmelidir. Artık yazımızın sonraki bölümünü adım adım takip ederek bu simgeleri ana menünüze ekleyebilirsiniz.
Birincil Menü Oluşturmaya Başlayın
Büyük olasılıkla, web sitenizin birincil menüsünde görünmesini istediğiniz tüm sayfaları listelediğiniz, kendi özelleştirilmiş birincil menünüzü zaten oluşturdunuz. Henüz yapmadıysanız, Görünüm içindeki 'Menüler' sayfasına gidin ve yeni bir menü oluşturun.
Ardından menüyü adlandırın, birincil menünüzde görünmesini istediğiniz sayfaları ekleyin ve aşağıdaki 'Birincil Menü' seçeneğini seçin.
Sosyal Simgeler Ekle
Devam ederek, sosyal simgeleri eklemek istiyoruz. Birincil menüyü oluştururken, sosyal simgelerinizin nerede görünmesini istediğinizi seçebilirsiniz. Çoğu durumda, sayfalardan hemen sonra gelirler, ancak onları ilk sıraya da koyabilirsiniz. Dışarıdaki tüm önemli ve en popüler web siteleri için sosyal medya simgeleri mevcuttur; Facebook'tan Twitter'a, Instagram'a, LinkedIn'e ve daha fazlasına.
Font Awesome web sitesinde aşağıdaki bağlantıyı açarak başlayın. Simgeleri manuel olarak ekleyeceğimiz bu yazının sonraki bölümü için bu web sitesine ihtiyacımız olacak.
Simgeleri Manuel Olarak Ekle
Birincil menünüze eklediğiniz her sosyal simge için aynı çalışma şekli geçerlidir. Örnek olarak, Instagram simgesini nasıl ekleyeceğinizi göstereceğiz. Eklemek istediğiniz diğer tüm simgeler için; aynı şekilde çalıştığını bilin (yalnızca simge, HTML kodu ve URL buna göre farklılık gösterir).
'Özel Bağlantılar' seçeneğini açın ve iki alanın göründüğünü göreceksiniz: URL ve Gezinme Etiketi. Açıkçası, URL alanı, bir ziyaretçiyi sosyal medya kanallarından birine yönlendiren URL'yi yazdığınız yerdir. Bu örnekte, simgenin Instagram'a yönlendirmesini istiyoruz, bu yüzden Instagram URL'nizi yazmanız yeterli.
Ardından, tarayıcınızdaki Font Awesome web sitesine gidin ve arama çubuğunda Instagram simgesini arayın. Aynı şekilde Facebook, LinkedIn ve diğer herhangi bir simgeyi de arayabilirsiniz.
Instagram simgesine tıkladığınızda, web sitesinin aşağıdaki HTML kodunu sağladığını göreceksiniz:
<i class="fa fa-instagram" aria-hidden="true"></i>
Bu, Gezinme Etiketi alanında kullanmamız gereken tam koddur, bu yüzden devam edin ve kodu kopyalayıp alana yapıştırarak özel bağlantıyı tamamlayın.
Birincil menünüzde görünmesini istediğiniz sosyal simgelerin her biri için aynı işlemi tekrarlayın ve web sitenizin ön ucunda nasıl göründüğüne bakın.
Sosyal Simgelerin Görünümünü Değiştir
Birincil Menüde Toplu Değişiklikler (Sosyal Simgeler Dahil)
Tema Özelleştirici, birincil menünüzde yapmak istediğiniz tüm görünüm değişikliklerini tek bir yerden yapmanızı sağlar.
Divi seçenekleriyle birincil menüde yapabileceğiniz değişiklikler sosyal simgeler için de geçerlidir. Örneğin, ana menünüze belirli bir renk verdiğinizde, sosyal simgeler aynı renge sahip olacaktır. Bunun nedeni, bu işi yapmak için bir resim yerine bir yazı tipi kullanmamızdır.
Tema Özelleştirici'deki görünümde yapmak istediğiniz tüm bu değişiklikleri Başlık ve Gezinme > Birincil Menü Çubuğu'na giderek yapabilirsiniz . Yaptığınız değişiklikler gerçek zamanlı olarak uygulanır ve ana menünüzün nasıl görünmesini istediğiniz konusunda size iyi bir bakış açısı sunar.
Sosyal Simgeleri Yeni Sekmede Aç
Gönderinin bu kısmı, sosyal simgelerle yapabileceğiniz ekstra bir şey. Ziyaretçilerinizi sosyal medya kanallarınıza gidiyor olsalar bile muhtemelen siteden uzaklaştırmak istemezsiniz. Sosyal medya bağlantılarını, birileri her tıkladığında yeni bir sekmede açarak her iki etkileşimi de mümkün olduğunca uzun süre canlı tutmak istiyorsunuz.
Daha önce oluşturduğumuz menüye geri dönerek 'Yeni Sekmede Aç' seçeneğinin tüm sosyal medya ikonlarında kolayca çalışmasını sağlayabiliriz. Simgelerin her birine manuel olarak tüm ayarlamaları yapmamız gerekiyor. Bu örnekte, Instagram simgesinde değişiklikler yapacağız.
Devam edin ve URL alanında sağladığınız URL'yi silin ve bunun yerine aşağıdaki kodu gezinme URL'sine yapıştırın:
<a href="http://www.instagram.com" target="_blank"><i class="fa fa-instagram" aria-hidden="true"></i></a>
Simgelerin yeni bir sekmede açılmasını istiyorsanız, simgelerin her biri için aynı şeyi yapın. Bir ziyaretçi onlara her tıkladığında, ziyaretçilerinizi mümkün olduğunca uzun süre etrafta tutmanıza izin veren yeni bir sekmede açılır.
Son düşünceler
Bu eğitim, sosyal simgeleri kendi Divi web sitenize istediğiniz şekilde entegre etmenize kesinlikle yardımcı olacaktır. Bunları özelleştirebilir ve birincil menünüzün geri kalanıyla uyumlu hale getirebilirsiniz. Herhangi bir sorunuz veya öneriniz varsa; Aşağıdaki yorum bölümünde bir yorum bıraktığınızdan emin olun. İletişimde kalacağız ve sahip olduğunuz tüm soruları veya önerileri yanıtlamaya çalışacağız.
Büyük bir duyuruyu, faydalı ipucunu veya Divi freebie'sini asla kaçırmamak için e-posta bültenimize ve YouTube kanalımıza abone olmayı unutmayın!
Oceans / Shutterstock.com aracılığıyla Öne Çıkan Görsel