Bir Sosyal Medya Nasıl Yapılır Modül Monarch gibi kalır
Bugünün öğreticisinde, belirli ihtiyaçlara göre bir sosyal medyanın takip modülünü nasıl yapacağınızı göstereceğiz. Sosyal Medya Takibi, herhangi bir web sitesindeki herhangi bir sayfadan nadiren kaybolan bir modüldür. Bu, sosyal medya kanallarını web sitelerine bağlamanın ana yollarından biridir. Web siteniz ve sosyal medya kanalları arasında istenen bağlantıya ulaşmanıza yardımcı olmak için Monarch’ımız var. Düğmeleri görüntülemenize yardımcı olan eklentiler, web sitenizde sosyal medyayı takip eder. Ancak Divi Builder aracılığıyla bazı hükümdar sonuçları elde etmeyi tercih ederseniz, bu yazı yararlı olabilir.
Monarch eklentisi tarafından sağlanan şeylerden biri olan web siteniz için sabit bir sosyal medya takip modülünü nasıl yapacağınızı göstereceğiz. Sol veya sağ tarafa (Monarch’daki standart ayarlar) yerleştirmenin yanı sıra, sayfanızın üstüne ve altına nasıl bağlanacağını da göstereceğiz. Sayfanın en üstüne eklenmesini sağlamanın yanı sıra, web sitenizdeki ana menü altında (ana menünüz düzeltilmiş olsun ya da olmasın) bir modülün nasıl takip edilmesini sağlayacağımız bir parçayı da ekleyeceğiz. Aşağıdaki sonuca bakalım.
Sol tarafın örneği
Ardından, Tasarım sekmesine geçin. Bu durumda, Facebook en önemli sosyal ağdır. Bu yüzden en çekici renk gölgesini vereceğiz. Kullandığımız renk ‘RGBA (59,89,152.0.94)’ dir. Bir sonraki Twitter ayarı, yeni bir sosyal ağ ekleyin. Facebook’u seçmek yerine, bu sefer Twitter’ı seçin. URL’yi aynı içerik sekmesine ekleyin ve Tasarım sekmesine devam edin. Tasarım sekmesinin içinde, arka plan rengi olarak ‘RGBA (59,89,152,0,76)’ seçin. Bu durumda, Twitter önemli bir sosyal medya kanalıdır, ancak Facebook kadar önemli değildir. Bu yüzden ikinci ve biraz daha şeffaf ve daha az çarpıcı bir renkle. LinkedIn Ayarları İçerik sekmesindeki LinkedIn Sosyal Ağı için aynı işlemi tekrarlayın ve tasarım sekmesini açın. Tasarım sekmesinin içinde ‘RGBA rengini (59,89,152.0.6)’ ‘simgeye ayarlayın. Google+ ayarları ve son ama daha az önemli değil; Google+ sosyal simgeleri ekleyin. URL’yi doldurun ve tasarım sekmesini açın. Bu, bu örnekte listeye eklemek istediğimiz en önemli ‘sosyal ağdır ve’ RGBA simgesi (59,89,152.0.42) simgesine sahip olacaktır. Sosyal medya oluşturun Sol taraf takip ediliyor İlk sosyal medya, sayfanızın sol tarafında nasıl bulunduğunu göstereceğimiz modülü takip eder. Bu en yaygın olarak kullanılan ve belki de sizi Monarch hakkında düşünen en çok kullanılan şeydir. Önce genel adımları izleyin ve bu yazının bir sonraki bölümünde bulacağınız CSS kodunu ekleyerek devam edin. CSS kodu eklemenin iki yolunu göstereceğiz; Tema seçeneğine ve özellikle bir sayfaya. Bu örnekten sonra, diğer örnekler için iki seçenek arasında da seçim yapabilirsiniz. CSS kod satırını tema seçeneğine ekleyin Ek bir CSS kodu eklemenin bir yolu tema seçeneğidir. Bu yöntem çoğunlukla tüm web sitelerinde efekt oluşturmak istediğinizde kullanılır. Ama hatırla; Bu efekt kullanıyorsanız, web sitenizin her sayfasında (veya görüntülemek istediğiniz sayfada) sosyal medyayı takip etmek için modülü eklemelisiniz. Tema seçeneklerine CSS kodu eklemek için WordPress Gösterge Tablosu> Divi> Tema Seçeneği> Genel> Genel sekmesini aşağı kaydırın ve aşağıdaki CSS kod satırını CSS özel alanına ekleyin: UL.ET_PB_SOCIAL_Media_Follow {Pozisyon: Sabit; Sol: 0;
Üst:%35;
Dolgu: 0! Önemli;
Z-Index: 999! Önemli;
}
.et_pb_social_media_follow li {
Marj: 0! Önemli; Dolgu: 0! Önemli;
}
.et_pb_social_media_follow li a.icon.runded_rectangle {
Border-Radius: 1 piksel;
Marj: 0! Önemli;
}
CSS kod satırını bir sayfaya ekleyin, özellikle CSS kodunu uygulamanıza yardımcı olan başka bir yöntem, belirli bir sayfaya eklemektir. Bu yöntem çoğunlukla sosyal medyayı yalnızca belirli bir sayfaya takip etmek için bir modül eklemeye karar verdiğinizde kullanılır. Bu yöntemi kullanarak, web siteniz, web sitenizdeki sosyal medyayı takip etmek için modüller içermeyen birbirlerinin sayfasına CSS kod satırını yüklemez. Ya da, modüllerin diğer sayfalardaki sosyal medyayı her zamanki gibi davranmasını istiyorsanız, bu yöntem de size yardımcı olacaktır. Divi üreticinizdeki aşağıdaki düğmeyi tıklayın:
Ardından, CSS kodunu özel CSS alanına kopyalayıp yapıştırın.
Sosyal medyanın doğru tarafını oluşturun
Paylaşacağımız bir sonraki kod, modülün sosyal medyayı web sitenizin sağ tarafına yerleştirmenize yardımcı olacaktır. Gerekli CSS kod satırı, tema seçeneğine veya yukarıdaki örnekte açıklandığı gibi belirli bir sayfaya aşağıdaki CSS kod satırını ekler. ul.et_pb_social_media_follow {pozisyon: düzeltildi;
EN İYİ 40%; Dolgu: 0! Önemli; Sağ: 0;Genişlik: 30px;
Z-Index: 999! Önemli;
}
.et_pb_social_media_follow li {
Marj: 0! Önemli;
Dolgu: 0! Önemli;
}
.et_pb_social_media_follow li a.icon.runded_rectangle {
Border-Radius: 1 piksel;
Marj: 0! Önemli;
}
En iyi sosyal medyayı takip et
Ardından, sosyal medyanızı web sitenizin en üstünde takip etmek için modüller de bulabilirsiniz. Bu aslında sosyal medya ikonlarının web sitesi aracılığıyla ziyaretçilerinizi takip etmesine izin vermenin çok ilginç bir yoludur. Bu sıklıkla kullanılmaz, bu yüzden insanların dikkatini çeker. CSS Kod Satırları Gerekli Kopyala ve Aşağıdaki CSS kodunu tema seçeneğine yapıştırın veya belirli bir sayfaya ekleyin. ul.et_pb_social_media_follow {
Konum: Sabit;
Sol:%45; Üst: 0; Z-Index: 999! Önemli;
}
.et_pb_social_media_follow li {
Marj: 0! Önemli;
Dolgu: 0! Önemli;
}
.et_pb_social_media_follow li a.icon.runded_rectangle {
Border-Radius: 1 piksel;
Marj: 0! Önemli;
}
Daha önce görüntülenen ana menü yöntemi altında izlenen en iyi sosyal medyayı oluşturun, ana menüyü dikkate almayan web sitenize sosyal medyayı takip etmek için modüller eklemek için. Ancak, sosyal medyayı takip etmek istiyorsanız, ana menü altında görünür ve kaydırma yaparken zirveye dönerse, bu yazı bölümü size yardımcı olabilir. CSS kodunu ekleyin Navigasyonun etkinleştirildiği ve kalmadığı her iki durumda da, tema seçeneğine aşağıdaki CSS kod satırını eklemeniz veya özellikle bir sayfaya eklemeniz gerekir: ul.et_pb_social_media_follow {konum: sabit;
Sol:%45;
Üst: 0;
Z-Index: 999! Önemli; }
.et_pb_social_media_follow li {
Marj: 0! Önemli;
Dolgu: 0! Önemli;
}
.et_pb_social_media_follow li a.icon.runded_rectangle {
Border-Radius: 1 piksel;
Marj: 0! Önemli;
} Bundan sonra, bazı jQuery kodu eklemeniz de gerekir. JQuery kodu, sabit bir gezinmeyi etkinleştirip etkinleştirmediğinize bağlıdır. Sabit navigasyon ile
Sabit bir gezinmeyi etkinleştirdiyseniz, web sitenizin kafasına veya sayfadaki kod modülüne aşağıdaki jQuery kod satırını eklemeniz gerekir:
jQuery (işlev ($) {
$ (“ul.et_pb_social_media_follow”).
$ (pencere) .bind (‘kaydırma’, function () {
var navi = $ (“#play-header”); var naviheight = navi.outeheight ();
if ($ (pencere) .scrolltop () <= naviheight) {
$ ("ul.et_pb_social_media_follow"). css ("marj üstü", naviheight);
}
});
});
CSS kod satırını da kullanmayı unutmayın. JQuery kodu ektir. Ayrıca, kaydırdığınızda ana yüksekliğinizin aynı kaldığından emin olun. Bunu WordPress Dashboard> Ekran> Özelleştirme> Başlık ve Navigasyon> Sabit Gezinme Ayarları> Sabit Navigasyon olmadan Minimum Seçin. Sabit Gezinme Olmadan Yapabilirsiniz.
Aynı sonuçları elde etmek istiyorsanız, ancak sabit bir navigasyonunuz yoksa, kod biraz farklı olacaktır:
jQuery (işlev ($) {
$ (“ul.et_pb_social_media_follow”).
$ (pencere) .bind (‘kaydırma’, function () {
$ ("ul.et_pb_social_media_follow"). css ("marj üstü", naviheight);
}
başka {
$ ("ul.et_pb_social_media_follow"). CSS ("Margin-Top", 0);
}
});
});
Bir takip oluşturun Sosyal Medya Sonunu takip etmek Ardvection’ı takip etmek için alt sosyal medyayı takip etmek için modülü takip edin.
CSS Kod Satırı Gerekiyor Özel CSS alanına tema seçeneklerinizden veya bir sayfaya aşağıdaki CSS kod satırını ekleyin: ul.et_pb_social_media_follow {
Konum: Sabit;
Sol:%45;
Alt: 0;
Dolgu: 0! Önemli;
.et_pb_social_media_follow li {
Marj: 0! Önemli;
Dolgu: 0! Önemli;
}
.et_pb_social_media_follow li a.icon.runded_rectangle {
Border-Radius: 1 piksel;
Marj: 0! Önemli;
}
