Divi altbilgi nasıl yapışkan hale getirilir
Bu öğreticide, Divi web sitenizde bir altbilgi yapışkanlığını nasıl yapacağınızı göstereceğiz. Yapışkan altbilgi kullanmak, müşteriler için bir web sitesi tasarlarken veya kendi web sitenizi oluştururken sahip olduğunuz ihtiyaçlardan elde ettiğiniz isteklerden biri olabilir. Altbilginizi yapışkan hale getirecek iki olasılık göstereceğiz. İlk yol, CSS kodu ve ikincisi JQuery kodu üzerinden. Her iki işlevsellik de ama her şey, web siteniz için hangisinin yapışkan bir etki yaratmak istediğinize bağlıdır. Web sitenize yapışkan bir altbilgi ekleyin Şimdi Divi Maker’da otomatik olarak yapabileceğiniz bir şey değil. Bu yüzden, çok denemeden istediğiniz doğru sonuçları nasıl elde edeceğinizi göstereceğiz. Yapmanız gereken tek şey, bu gönderiyi adım adım takip etmek, birkaç satır kod kopyalamak ve yapıştırmak ve doğru yere koymaktır.
Neden yapışkan altbilgi kullanıyorsunuz? Yapışkan altbilgi genellikle bir ana nedenden dolayı kullanılır; Web sitenizde, ekranı dolduracak yeterli içeriğe sahip olmayan bir sayfanız veya birkaç sayfanız varsa. Elbette bir sayfada yeterli içeriğe sahip olduğunuzdan emin olabilirsiniz, ancak sayfaya katma değer sağlamazsa; Bunu yapmaya gerek yok. Şimdi, ekranı dolduracak kadar içerik yoksa, sayfanın içerik bittikten hemen sonra yüzen bir altbilgi olacaktır. Genellikle iyi görünmez ve istediğiniz sonuç değildir. Neyse ki, yüzen altbilgiyi ortadan kaldırmak için yapışkan altbilgi kullanabilirsiniz. Yapışkan altbilgi, altbilginin gereksiz alan yapmadan avlunun dibinde kalmasını sağlar. Bu nedenle sayfanın uzunluğu aynı kalacak ve pencerenizin boyutunu her ayarladığınızda, altbilgi kendini ekrana değiştirecektir. Burada yapışkan bir altbilgisi olmayan kısa bir sayfa resminiz var:
Ve bu, yapışkan altbilgi eklendikten sonra sayfanın aynı resmidir:
Ardından, yeni açtığınız penceredeki özel CSS alanına aşağıdaki kodu ekleyin: #Main-footer {
Pozisyon: Mutlak;
Alt: 0; Genişlik:%100;
}
Sayfanızı incelediğiniz andan itibaren, CSS kodu uygulanmalı ve yapışkan bir altbilgi yapmalıdır. Temaları ayarlayarak CSS kodunu ekleyin (gerçek zamanlı ekran) Kod eklemenin başka bir yolu özelleştirici temasıdır. CSS kodunu bu şekilde eklerseniz, tüm web sitelerine otomatik olarak uygulanır. Her sayfa bu CSS kodunu kendisine uygulayacaktır. Özelleştirici teması aracılığıyla kod ekleyerek, web sitenizde meydana gelen değişiklikleri hemen görebilirsiniz. CSS kodunu özelleştirici temasına eklemek için WordPress sitenizin arkasındaki ‘Tema Özelleştirici’yi tıklayın. Ardından, sayfayı aşağı kaydırın ve ek CSS seçeneğini açın. Şimdiye kadar kullandığınız tüm özel CSS kodunu göreceksiniz. Lütfen ve aşağıdaki kodu ekleyin: #Main-footer {
Pozisyon: Mutlak;
Alt: 0;
Genişlik:%100;
}
CSS kodunu divi son ama en az değil tema seçeneğinden ekleyin, divi tema seçeneğinden de kodu ekleyebilirsiniz. Bu, tüm web sitelerinin koddan yararlanmasını istediğiniz web sitesine kod eklemenin en sık kullanılan yoludur.
Divi’yi Aç> Tema Seçenekleri> Aşağı Kaydırma Sayfası> CSS Kustom kutusuna aşağıdaki CSS kodunu ekleyin: #Main-Footer {
Pozisyon: Mutlak;
Alt: 0;
}
JQuery aracılığıyla divi web sitenizde yapışkan bir altbilgi oluşturun Kod modülü üzerinden JQuery Kodu Ekle (özellikle bir sayfa için) Divi Maker’daki kod modülünü kullanarak bir jQuery kodu ekleyebilirsiniz. Bu, bir kez daha, çoğunlukla kısa içeriğe sahip birçok sayfa olmadığında ve tüm web siteleri için jQuery kodu yüklemek istemediğinizde kullanılır. Üzerinde çalıştığınız sayfaya tam geniş bir satır içeren bir parça ekleyin. Kod modülünü tam geniş satıra eklemeye devam edin ve aşağıdaki kodu yapıştırın:
jQuery (işlev ($) {
İşlev stickyfooter () {
var footer = $ (“#Main-footer”); var konumu = footer. Pozisyon (); var yüksekliği = $ (pencere) .Height ();
Yükseklik = yükseklik – konum.top;
yükseklik = yükseklik – footer.outeheight ();
if (yükseklik> 0) {
footer.css ({‘marj-üst’: yükseklik+’px’});
}
}
stickyfooter ();
$ (pencere). SECK (function () {
stickyfooter ();
});
});
JQuery Kodunu Divi Tema Seçeneği aracılığıyla ekleyin JQuery Kodu eklemek için diğer olasılıklar Divi Tema seçeneğidir. Tüm web siteleri için bir jQuery kodu eklerken, Divi teması seçeneğinde bunu yapabileceğimiz özel bir yer vardır; Divi’yi açın> Tema seçeneğini aç> Entegrasyon sekmesini açın ve web sitenize aşağıdaki jQuery kodunu ekleyin:
jQuery (işlev ($) {
İşlev stickyfooter () {
var footer = $ (“#Main-footer”);
var yüksekliği = $ (pencere) .Height ();
Yükseklik = yükseklik – konum.top;
yükseklik = yükseklik – footer.outeheight (); if (yükseklik> 0) {
footer.css ({‘marj-üst’: yükseklik+’px’});
}
}
stickyfooter ();
$ (pencere). SECK (function () {
stickyfooter ();
});
});
Bu yapışkan altbilgi, pencerenin boyutu her değiştirildiğinde kendini yeniler, bu nedenle tarayıcınızdaki ekran boyutunu değiştirdiğinizde başka bir yüzer altbilgiye sahip olmak konusunda endişelenmenize gerek yoktur.
Son zihin, içinde fazla içerik olmayan bir sayfanız varsa yapışkan bir altbilginin genellikle gerekli olduğunu ekler.Yüzde altbilgiden kurtulmak istiyorsunuz, böylece bahçe yapısı daha doğal hissediyor.Blog bölümümüzde gelecekteki yayınlar için yorum veya önerileriniz varsa;İletişim kurabilmemiz için aşağıdaki yorumlar bölümünde bir yorum bıraktığınızdan emin olun!
Büyük duyuruları, yararlı ipuçlarını veya divi freebie’yi asla kaçırmayacak şekilde e -posta bültenimize ve YouTube kanalımıza abone olduğunuzdan emin olun!Vintagio / Shutterstock.com’dan Üstün Görüntü