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:

Yapışkan altbilgi ve hala herkes arasındaki fark, web sitelerinde bir altbilgi kullanmaya karar vermez, ancak yaptıklarında; Düzenlemenin birçok yolu var. Her şey web sitenizin yapısına ve bunun yerine ‘manuel’ ve farklı stiline girmek istiyorsanız bağlıdır. Ancak standart bir altbilgi kullanıyorsanız, onu nasıl düzenlemek istediğinizi ve web sitenize nasıl yerleştirmek istediğinizi seçebilirsiniz. Abbaharın web sitesinde sahip olabileceği üç ana pozisyon yüzer, sabit ve yapışkandır. Yapışkan altbilgiyi karşılaştırırken ve birbirleriyle kalırken; İlk bakışta aynı görünebilirler ama aslında değiller. Altbilgi her zaman web sitenizdeki sayfayı kaydırırken görülürken, yapışkan altbilgi özellikle ekranın altına ulaşacak kadar uzun olmayan sayfaları işlerken. İçeriğin yeterince uzun olmadığı özel durumlarda; Sabit bir altbilgi gibi davranacak ve sayfanızın altına bağlı kalacaktır; ‘Sabit altbilgi efekti’ oluşturmak. Ancak, içerik yeterince uzunsa, yapışkan altbilgi her zamanki gibi davranır ve sayfa ekranda görünmeye devam etmediğinden emin olmak için altbilgiyi sayfanın altına iter. Çoğu durumda, bu yöntem tüm web sitelerinde sabit bir altbilgiye sahip olmaktan daha tercih edilir, çünkü içeriği görüntülemek için pencerede daha fazla yer sağlar.

Daha fazla zaman sınırlaması olmadan CSS üzerinden Divi web sitenizde yapışkan bir altbilgi yapın, web siteniz için yapışkan bir altbilgi yapmaya başlayalım. Kullanacağımız kod çok basit ama eksiksiz bir iş. İçerik yeterince uzun değilse, sayfanızdaki kayan bir altbilgiden, altbilginin aşağı itildiği sayfaya geçeceksiniz. CSS kodunu sayfa ayarları aracılığıyla (özellikle bir sayfa için) ekleyin, belirli durumlarda, altbilgiyi belirli bir sayfaya eklemek istersiniz. Bu yazıda, bir sayfadan CSS özel alanına CSS kodu ekleyerek nasıl düzgün bir şekilde yapılacağını göstereceğiz. Bunu yaparak, CSS kodunun yalnızca web sitenizdeki bir sayfa için geçerli olduğundan emin olursunuz. Bu aynı zamanda CSS kodunun yalnızca birisi belirli bir sayfayı açtığında yükleneceği anlamına gelir. Bu yöntem genellikle web sitesinde yapışkan altbilgi vermek istediğiniz sadece birkaç kısa sayfanın bulunduğu durumlarda kullanılır. Ardından, Divi Maker’ınızdaki aşağıdaki simgeyi tıklayarak sayfa ayarlarını açın:
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;

Genişlik:%100;
}
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 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 ();
});
});

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ü

admin

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir