Divi'nin Birincil Menüsüne Sosyal Simgeler Nasıl Eklenir

Özel bir sosyal medya varlığı olmadan başarılı bir web sitesi çalıştırmak neredeyse imkansızdır. Bunu Instagram, Twitter, TikTok, Facebook veya bunların herhangi bir kombinasyonu olarak seçseniz de, insanlar sizinle ve markanızla doğrudan etkileşim kurmak ister. Divi'nin ana menüsünde sosyal simgeleriniz olduğundan emin olmak, web sitenizden seçtiğiniz ağa trafik yönlendirmenin harika bir yoludur. Hızlı ve kolaydır ve her adımda size yol göstereceğiz.

Başlayalım!

Ön izleme

masaüstü

Mobil

Ücretsiz Küresel Başlık Yüklemek için Divi Tema Oluşturucu'yu kullanın

Bu makale için, Tenis Kulübü düzen paketini ve üstbilgi/altbilgi özgürlüğünü kullanacağız. Düzen paketini Divi oluşturucunuzdan ve üstbilgi/altbilgi paketini blogumuzdan indirebilirsiniz. İndirdiğinizde, dosyalar bir .zip arşivi olarak olacaktır. Divi'ye yüklemek üzere bir .json dosyanız olması için bunları ayıkladığınızdan emin olun.

Şimdi, WordPress panonuza gidin ve Divi – Theme Builder altında Divi Theme Builder'ı bulun. Sayfanın sağ üst köşesindeki yukarı ve aşağı ok simgesine tıklayın. Bu, Taşınabilirlik modunu açar, İçe Aktar sekmesini seçin, indirdiğiniz üstbilgi/altbilgi için .json dosyasını bulun ve Divi Tema Oluşturucu Şablonlarını İçe Aktar öğesine tıklayın.

Daha sonra sitenizin başlık bölümüne gitmek istiyorsunuz. Sosyal simgeler olduğu için, sitenizdeki tüm sayfalarda olması gerektiğini düşündüğümüz için (aksi belirtilmedikçe) bunları Genel Başlığa koyacağız .

Şimdi inşaatçının içinde olmalısın. Yukarıdaki yönergeleri izlediyseniz, yüklediğiniz yeni başlık zaten yerinde görünmelidir.

Burada zaten sosyal simgeler olduğunu fark edebilirsiniz. Ancak bu sosyal simgeler, bugün üzerinde çalıştığımız Divi Birincil Menüsünde değil. Öyleyse yabani otlara girelim, olur mu?

Birincil Menü Çubuğuna Sosyal Simgeler Ekleyin

Öncelikle satır/sütun yapısını değiştirelim. 2. bölümdeki satırı bulmak istiyoruz (Alttaki Ana Sayfa/İletişim bağlantıları).

Bu eğitim için iki sütunlu yapıyı seçiyoruz, ancak siteniz için en iyi olanı bu. Bunu seçtikten sonra, Satır ayarlarına gidin ve Tasarım sekmesine gidin. Boyutlandırma menüsünü bulun ve Özel Cilt Payı Genişliğini Kullan öğesini açın . Cilt Payı Genişliği değerini 1 olarak ayarlayın. Bunu yapmak için sayıyı girebilir veya kaydırıcıyı kullanabilirsiniz.

Ayarlarınızı kaydetmek için yeşil onay işaretine tıklayın. Ardından Satır ayarlarına geri dönün . Bu sefer, üst/ilk/sol sütun için ayar dişlisini seçin.

Ardından, Gelişmiş sekmesine gidin. Özel CSS alanını bulun ve Ana Öğe alanına tıklayın. Bu alanın içine aşağıdaki CSS'yi eklemek isteyeceksiniz.

width:80%;

veya

width:80%!important;

Bu öğeye stil vermek için !important etiketini eklemeniz gerekebilir. Sorun yok. Tek bir öğe olduğu için başa çıkmak için performans sorunları veya spagetti kodu oluşturmamalıdır.

Ardından, Duyarlılık ayarlarına gidin ve aynı kodu kullanarak sütunun genişliğini mobil cihazlar için %100 olarak değiştirin.

Ardından, ikinci sütun için bu adımı tekrarlayın. Yalnızca bu sefer, varsayılan değeri %20 olarak ayarlayın ve mobil değeri %100'de tutmaya devam edin .

Bunu yaptıktan sonra, değişikliklerinizi kaydedin ve sosyal medya simgelerinizi eklemeye ve biçimlendirmeye hazır olun.

Sosyal Medya Takip Modülü Ekle

Yeni bir modül eklemek için Sütun 2'deki siyah + simgesini tıklayın ve Sosyal Medya Takip'i bulana kadar kaydırın. Takın.

Kullanmakta olduğunuz başlık ne olursa olsun, varsayılan sosyal medya simgeleri büyük olasılıkla tarzınıza uymayacaktır. Ne de doğru konumlandırılacaklar. Bir sonraki adım, onları doğru şekilde biçimlendirmek ve boşluk bırakmak olacaktır. Sosyal Medya Takip modülü ayarlarının içinde Tasarım'a ve ardından Hizalama'ya gidin . Modülün yerleştirilmesini istediğiniz yeri seçin.

Masaüstü için sağa dayalı seçiyoruz ve ardından Duyarlılık seçeneklerine girip ortalıyoruz.

Sıradaki, Simge menüsüne doğru aşağı kaydırılıyor. İstediğiniz simgenin rengini seçin. Bu Facebook için f , Twitter için kuş, Instagram için kamera. Örneğin bu mavi arka plan değil.

Sıradaki boşluk. Gerçekten ayarlanması gereken en önemli şey üst kenar boşluğudur. Menü metniyle ortalanması için 1.5 vw üst kenar boşluğu uygulayacağız. Mobil için az ya da çok istiyorsanız, bunu da ayarlayabilirsiniz.

Şimdi İçerik sekmesine tıklayın ve özelleştirmek istediğiniz bireysel sosyal ağ simgesine gidin. Siteniz için seçtiğiniz her simge için bu adımları tekrar edeceksiniz.

Arka Plan'a ilerleyin ve sitenizin tasarımına uygun olmasını istediğiniz rengi seçin. Yine, bunun yalnızca bu belirli simgenin arka planını değiştireceğini unutmayın.

Bu belirli simgenin rengini de değiştirmek isteyebilirsiniz. Bunu, genel modülün kendisinde olduğu gibi Tasarım sekmesi ve Simge bölümü altında yapabilirsiniz. Bu ayar genel ayarı geçersiz kılar, bu nedenle tek seferlik renkler istiyorsanız diğerlerine müdahale etme konusunda endişelenmenize gerek yoktur.

Ardından Tasarım sekmesinin altındaki Kenarlık girişine gidin ve bunun içinde Kenarlık Genişliği öğesini bulacaksınız. Bu değeri 3 piksel olarak ayarlayın ve ardından Divi Birincil Menüsünün arka planından öne çıkan bir Kenarlık Rengi seçin.

Bu noktada, İçerik sekmesine geri dönecek ve görüntülemek istediğiniz her sosyal ağ simgesi için bu adımları tekrarlayacaksınız. Bu modüldeki simgelerin her birinin aynı tasarımı paylaşmasını istiyorsanız, tasarladığınız simgeye sağ tıklayıp Öğe Stillerini Kopyala öğesini seçmeniz yeterlidir.

Ardından, stil vermek istediğiniz diğer ağlara sağ tıklayın ve Öğe Stillerini Yapıştır öğesini seçin.

Ve bu kadar! Genel düzeni kaydetmek için ekranın sağ alt köşesindeki Kaydet düğmesini tıkladığınızdan emin olun. Ardından, sağ üst köşedeki düzenleme ekranından X'e kadar güvendesiniz.

Divi Tema Oluşturucu sayfasının sol üstte Tüm Değişikliklerin Kaydedildiğini gösterdiğinden emin olun. Değilse, Değişiklikleri Kaydet 'i tıklayın . Tamamlandığında, siteniz Divi Birincil Menünüzdeki sosyal medya simgelerini görüntüleyerek yayında olacak!

Nihai sonuçlar

Ve bu, nihai sonuçlarınızın benzemesi gereken şeydir.

masaüstü

Mobil

Toplama

Kitlenizin birincil sosyal ağlarınızı her zaman bulabilmesini sağlamak Divi ile çok kolay. Sadece birkaç adımda, ücretsiz üstbilgi/altbilgi paketlerimizden birini, sosyal medya simgelerinizi birincil menüye (veya istediğiniz herhangi bir yere) dahil edecek şekilde ayarlayabilirsiniz. İyi şanlar!

Birincil menüdeki sosyal medya simgeleri hakkında ne düşünüyorsunuz? Onları nereye yerleştirme eğilimindesiniz?