Öne Çıkan Gönderileri Otomatik Kayma Efektiyle Nasıl Gösterirsiniz – Showeblogin

Aşağıdaki makale size yardımcı olacaktır:Öne Çıkan Gönderileri Otomatik Kayma Efektiyle Nasıl Gösterirsiniz – Showeblogin

Belirli gönderileri otomatik kaydırma efektleriyle öne çıkan gönderiler olarak göstermek ve ziyaretçilerin sitelerinizde uzun süre meşgul olmasını sağlamak için seçebilirsiniz.

Bu eğitimde, BlogSpot blog gönderilerinizi veya WordPress blog gönderilerinizi veya diğer site hikayelerini/makalelerini sitenizin tüm sayfalarında veya herhangi bir sayfasında öne çıkan gönderiler olarak görüntülemeyi öğreneceksiniz. Bu otomatik kayan öne çıkan gönderilerin yardımıyla, gönderilerin/hikayelerin/makalelerin resimlerini, açıklamalarını/snippet’lerini ve başlıklarını içeren gönderileri gösterebileceksiniz.

Otomatik kaydırma efektleriyle istediğiniz sayıda gönderiyi özellikli olarak görüntüleyebilirsiniz. Bu, hangi gönderilerin öne çıkan gönderiler olarak görüntüleneceğini seçebileceğiniz anlamına gelir.

WordPress/BlogSpot bloglarınıza öne çıkan yayın kaydırıcısı ekleyin

Aşama 1:

Bu CSS kodlarını sitenize ekleyin. Blogger için, şablon düzenleyiciye gidin ve kapanış ]]> etiketini bulun ve bu CSS kodlarını ]]>‘in önüne/üstüne yapıştırın.

ul.swtSlideShow {/* SWT Öne Çıkan Gönderi Kaydırıcısı, Showeblogin START */ list-style:none; genişlik:%100; yükseklik:250 piksel; taşma:gizli; konum: göreli; kenar boşluğu:0; dolgu:0; yazı tipi ailesi:Arial,Helvetica,Trebuchet MS,Verdana; } ul.swtSlideShow li { pozisyon:mutlak; sol:0; sağ:0; } ul.swtSlideShow li.show { z-index:500; } ul.swtSlideShow img { genişlik:100%; yükseklik:250 piksel; kenarlık:yok; } #swtSlideShow-caption { genişlik:100%; yükseklik:otomatik; pozisyon:mutlak; alt:0; sol:0; renk:#fff; arkaplan:#000; z-endeksi:500; } #swtSlideShow-caption .swtSlideShow-caption-container { padding:5px 10px; z-endeksi:1000; } #swtSlideShow-caption h3 { marj:0; dolgu:0; yazı tipi boyutu: 16px; } #swtSlideShow-caption p { marj:5px 0 0 0; dolgu:0; } #swtSlideShowTitle > h3 { yazı tipi ağırlığı: normal; metin hizalama: merkez; marj: .5em 1em; dolgu: 0 10 piksel; yazı tipi boyutu: %130; konum: göreli; satır yüksekliği: 32px; z-endeksi: 1; sol: -5 piksel; alt: -5 piksel; alt kenarlık: 5 piksel katı #1ABC9C; yükseklik: 32 piksel; arka plan rengi: #192a3e; renk: #fff; metin süslemesi: yok; } #swtSlideShowTitle > h3:önce, #swtSlideShowTitle > h3:sonra { genişlik:0; yükseklik:0; içerik:””; pozisyon:mutlak; z-endeksi:10; kenarlık:0 katı saydam; } #swtSlideShowTitle > h3:before { border-bottom: 32px solid #1ABC9C; kenar-sağ-genişlik: 0; sol kenarlık genişliği: 14px; sağ: %100; alt: 0; } #swtSlideShowTitle > h3: after { border-bottom: 32px solid #1ABC9C; kenar-sağ-genişlik: 14 piksel; kenarlık-sol-genişlik: 0; sol: %100; alt: 0; /* SWT Kaydırıcı Eğitimini http://www.microsoft.com/?p=765 adresinde Yayınlıyor */}

Tavsiye Edilen:  İlgi Çekici CTA'lar Oluşturmak İçin 8 İpucu

Adım 2:

Şimdi, bu JavaScript dosyasını sitenize head etiketi içinde kopyalayıp yapıştırın. Blogger için, blog şablonu düzenleyicinizde kapanış etiketini bulun ve bu JavaScript kodlarını dosyanın önüne/üstüne yapıştırın. Blogunuza/sitenize zaten eklediyseniz, ilk JavaScript dosyasını yok sayabilirsiniz.

Aşama 3:

Son olarak bu html kodlarını kopyalayıp sitenize yapıştırmanız gerekmektedir. WordPress blogunuz varsa, koşullu etiketi yok sayarak metin kutusuna yapıştırın. Ancak, blogger blogunuz varsa, blogunuzun düzen sekmesini ziyaret edin ve yeni bir tane ekleyin. HTML/JavaScript Aygıt.

Öne Çıkan Yazılar Slayt Gösterisi

SWT Öne Çıkan Gönderi Kaydırıcısının Özelleştirilmesi

1) Öne çıkan gönderilere istediğiniz kadar

  • S
  • ekleyin.
    2) Değiştir # gönderi URL’si ile.
    3) Değiştir S yazı açıklaması/özet/snippet ile.
    4) Değiştir W resim/fotoğraf URL’si ile.
    5) Değiştir T yazı başlığı ile.
    6) Blogger kullanıcısı ayrıca yazıları tüm blog sayfalarında göstermek istiyorsa yukarıdaki kodların (adım-3) ilk ve son satırını (yani koşullu etiket b:if) kaldırabilir.

    Şimdi gadget’ı kaydedin ve blogunuzda/sitenizde otomatik slayt efektli canlı öne çıkan yayınları görün. Eğlence!