Blogger Popüler Yayınlar Eklentisi (Özelleştirilmiş)

blogger popüler yayınlar eklentisiBlogger popüler yazılar eklentisini özelleştiriyoruz...

Popüler yazılar/yayınlar eklentisi, blog sitelerin çok okunan yazılarını öne çıkarmasını sağlayan ve kullanıcıların sitede kalma sürelerini arttıran olmazsa eklentilerden biri. Ben de kendi sitemde bu eklentiyi kullanıyorum. Birçok ayarı da bulunan eklenti haftanın, ayın veya yılın en çok okunan 10 yazısını listelemenizi sağlıyor.

Peki bu eklentiyi nasıl özelleştirip daha güzel bir görünüme kavuşturabileceğinizi biliyor musunuz? Ben oldukça güzel bir popüler yayınlar görünümü elde ettim ve bunu sizlerle paylaşmak istiyorum. Bloğunuzda hali hazırda bir popüler yazılar eklentisi varsa onu çok daha kullanışlı hale getireceğiz.

UYARI Her ihtimale karşı işleme başlamadan önce temanızın yedeğini alınız.

Blogger Popüler Yazılar Eklentisini Düzenleyelim


Blogger paneli > Tema > Html'yi Düzenle bölümüne ulaşıp CTRL+F komutu ile aşağıdaki kodu bulun.

[</head>]

Yukarıdaki kodu hemen üzerine aşağıdaki kodu ekleyin.

[<style>
/* Popular Posts */
.PopularPosts ul,.PopularPosts li,.PopularPosts li img,.PopularPosts li a,
.PopularPosts li a img {margin:0;padding:0;list-style:none;border:none;
background:none;outline:none;}
.PopularPosts ul {margin:0;list-style:none;color:#333;}
.PopularPosts ul li img {display:block;width:100%;height:180px;float:left;transition:all 0.3s ease-out;max-width: none;}
.PopularPosts ul li {background-color:#fff;margin:2px;margin-bottom: 30px;padding:0;padding-bottom:5px;position:relative;transition:all 0.3s ease-out;}
.PopularPosts ul li:last-child {padding-bottom:0;}
.PopularPosts .item-title a { font:600 14px 'Playfair Display';color: #555; font-size: 16px; padding: 10px; position: absolute; right: 0; left: 0px; margin: 0px auto; text-align: center; text-decoration: none; top: 120px; overflow: hidden; z-index: 2; line-height: 1.2; background: rgb(255, 255, 255); width: 70%; border-top: 3px solid #FEC606; }
.PopularPosts ul li .item-title a:hover, .PopularPosts ul li a:hover {}
.PopularPosts ul li:before {display:none;list-style:none;}
.PopularPosts .item-thumbnail {margin:0 0 0 0;background: #333;overflow: hidden;}
.PopularPosts .item-snippet {font-size:11px;color:#333;font-weight:400;}
.PopularPosts .item-title {padding-bottom:.2em;line-height: 0.9;}
.PopularPosts .item-thumbnail::after {color: #f8f8f8; list-style-type: none; position: absolute; z-index: 4;font-size: 22px; background: rgb(31, 118, 158); padding: 10px; font-weight: 700; left: 0;}
/* Popular Posts */
</style>]

Daha sonra yine aynı sayfada aşağıdaki kodu bulun. Bu kodu "PopularPosts1" olarak aratabilirsiniz yada Widget'a Atla butonuna basarak PopularPost1'i seçebilirsiniz.

[<b:widget id='PopularPosts1' locked='false' title='Entradas populares' type='PopularPosts'>…</b:widget>]

Yukarıdaki kodu silip yerine aşağıdaki kodu ekleyin ve temanızı kaydedin.

[<b:widget id='PopularPosts1' locked='false' title='Popüler Yayınlar' type='PopularPosts' version='1'>
<b:widget-settings>
<b:widget-setting name='numItemsToShow'>7</b:widget-setting>
<b:widget-setting name='showThumbnails'>true</b:widget-setting>
<b:widget-setting name='showSnippets'>false</b:widget-setting>
<b:widget-setting name='timeRange'>ALL_TIME</b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<b:if cond='data:title != ""'><h2><data:title/></h2></b:if>
<div class='widget-content popular-posts'>
<ul>
<b:loop values='data:posts' var='post'>
<li>
<b:if cond='!data:showThumbnails'>
<b:if cond='!data:showSnippets'>
<!-- (1) No snippet/thumbnail Ayudadeblogger.com -->
<a expr:href='data:post.href'><data:post.title/></a>
<b:else/>
<!-- (2) Show only snippets -->
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</b:if>
<b:else/>
<!-- (3) Show only thumbnails or (4) Snippets and thumbnails. -->
<div expr:class='data:showSnippets ? "item-content" : "item-thumbnail-only"'>
<b:if cond='data:post.featuredImage.isResizable or data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<b:with value='data:post.featuredImage.isResizable ? resizeImage(data:post.featuredImage, 300, "1:1") : data:post.thumbnail' var='image'>
<img alt='' border='0' expr:src='data:image'/>
</b:with>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
<b:if cond='data:showSnippets'>
<div class='item-snippet'><data:post.snippet/></div>
</b:if>
</div>
<div style='clear: both;'/>
</b:if>
</li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>]

popular posts code
popüler yayınlar eklentisine ait kodlar

Popüler yayınlar eklentisi artık çok daha modern bir görünüme sahip oldu. Eklentinin resimleri büyüdü ve başlıklar resmin ortasında konumlandı. Eğer eklentinin görünümünde sorunlar varsa temanızda daha önce eklenmiş ve popüler yayınları etkileyen başka kodlar olabilir, onları silerek sorunu çözebilirsiniz.

İyi bloglamalar!

Kaynak:
https://www.ayudadeblogger.com/2017/12/entradas-populares-para-blogger-like-style.html

YORUMLAR

BLOGGER
301 yönlendirmesi,1,301 yönlendirmesi hakkında,1,301 yönlendirmesi nasıl yapılır,1,301 yönlendirmesi nedir,1,Adsense,12,adsense banka doğrulama,1,adsense banka ekleme,1,adsense iban ekleme,1,adsense onay,1,Adsense onaylatma,1,adsense ödeme duraklatıldı,1,Adwords,3,affiliate marketing,2,affiliate marketing nasıl yapılır,1,affiliate marketing nedir,1,Airties Modem Şifresi,1,akıllı cep telefonu,7,akıllı saat,1,akıllı televizyon,3,alan adı,1,alternatif kazanç,1,Anadolu Jet ucuz uçak biletleri,1,Analytics,2,Android,1,Android Batarya,1,Android Batarya Kalibrasyonu,1,Android Oreo,1,Android Oreo 2018,1,Atatürk Kravat,1,Başkasına Nasıl Kontör Gönderilir,1,Bayilik Veren Firmalar,1,bilgisayar,3,Bios,1,Bitcoin,3,Blog,1,blog yazmak,1,Blogger,71,blogger para kazanmak,1,blogger taşıma,1,blogger temaları,1,blogger teması,1,Blogger yardım,1,Blogger'dan WordPress geçiş,1,canlı tv,1,canlı tv izle,1,CDN,1,cloudflare,4,cloudflare ayar,1,cloudflare ayarlama,1,cloudflare kaldırma,1,cloudflare kurulumu,1,cloudflare nasıl kurulur,1,cloudflare nedir,1,cloudflare özellikleri,1,cloudflare seo,1,cloudflare yardım,3,cloudflare zararları,1,Devlet,2,Diğer,3,domain,1,Donanım,8,drone,1,Elektronik Sigara,1,elektronik sigara modelleri,1,en sık yapılan hatalar,1,Facebook,11,FileZilla,1,filezilla kullanımı,1,filezilla kurulumu,1,filezilla nasıl kullanılır,1,filezilla nasıl kurulur,1,filezilla yardım,1,Firefox,1,Firefox Kayıtlı Olan Şifreleri Silme,1,Firefox’da Kayıtlı Form Verileri Nasıl Silinir,1,ftp kullanımı,1,Girişimcilik ve Kişisel Gelişim,1,Google,21,Google Adsense,2,Google Sandbox,1,Gözü Kaynak Almasına Hangi Damla İyi Gelir,1,Hesap,36,Hitman Sniper Hile Apk indir,1,hosting,2,Instagram,9,İnternet,12,İnternetten Para Kazanmak,23,iphone,1,işletim sistemi,1,kazanç,1,kontör gönderme,1,METİN2 7X,1,METİN2 7X HİLESİ,2,Minecraft Apk indir,1,Mobil,11,modem arayüz girişi,1,modem şifreleri,1,Mouse ile seçilen metnin rengi nasıl değiştirilir,1,müzik indirme,1,nasıl site açılır,1,Office,2,on-page seo,1,onepage tema,1,Oyun,43,profil resmi gizleme,1,reseller hosting,1,samsung,1,samsung tablet,1,Sandbox,1,satış ortaklığı,3,satış ortaklığı firmaları,1,satış ortaklığı nasıl yapılır,2,satış ortaklığı nedir,1,Schema Lite,1,SEO,12,seo hataları,2,seo hatası,2,servis sağlayıcısı,1,seyahat önerileri,1,Simcity Buildit Hile Apk indir,1,Site içi seo,1,sunucu,1,swarm,1,tek sayfa tema,1,Terminal Servisleri,1,Tplink Modem Şifresi ve Arayüze Erişim,1,tüm modem şifreleri,1,Twitter,10,ucuz uçak bileti,1,uçuş bilgileri,1,ücretsiz blogger teması,1,ücretsiz indir,2,ücretsiz tema,3,vodafone,1,Vodafone 2 Gb İnternet 1 TL,1,vodafone tarife,1,Webmaster,31,Whatsapp,5,whatsapp profil resmi,1,whatsapp profil resmi gizleme,1,Windows 10,51,Windows 8,2,Windows 8 Biosa,1,Windows 8 Biosa Nasıl Girilir,1,Wordpress,17,Wordpress kurulumu,1,wordpress nasıl kurulur,1,WordPress Tema,2,wordpress yardım,2,Yazılım,58,Youtube,18,Yurt Dışı Uçuşlar,1,Yüksek Kaliteli Sayfa,1,
ltr
item
Teknik Blog | isa.gen.tr: Blogger Popüler Yayınlar Eklentisi (Özelleştirilmiş)
Blogger Popüler Yayınlar Eklentisi (Özelleştirilmiş)
Blogger popüler yayınlar eklentisini düzenleyelim, popüler yazılar eklentisi nasıl özelleştirilir, blogger eklentiye resim ve açıklama ekleme, blogger popular posts widget, blogspot popüler yayınlar aracı.
https://2.bp.blogspot.com/-JtbQf3O2TnQ/WjIeHfCZWwI/AAAAAAAADXY/m3YjEhNptScSpm3rWUrgiMXUJAK7U1dEwCLcBGAs/s640/blogger-populer-yazilar-yayinlar-eklentisi.jpg
https://2.bp.blogspot.com/-JtbQf3O2TnQ/WjIeHfCZWwI/AAAAAAAADXY/m3YjEhNptScSpm3rWUrgiMXUJAK7U1dEwCLcBGAs/s72-c/blogger-populer-yazilar-yayinlar-eklentisi.jpg
Teknik Blog | isa.gen.tr
https://www.isa.gen.tr/2017/12/blogger-populer-yayinlar-eklentisi-duzenleme.html
https://www.isa.gen.tr/
https://www.isa.gen.tr/
https://www.isa.gen.tr/2017/12/blogger-populer-yayinlar-eklentisi-duzenleme.html
true
420692696674173166
UTF-8
Hepsi yüklendi! BUNA BENZER BAŞKA BİR YAZI YOK Tüm Yazılar Devamını oku Yanıtla İptal et SİL By Ana Sayfa SAYFALAR YAZILAR Tümünü Görüntüle BENZER YAZILAR KATEGORİ ARŞİV ARAMA YAP... TÜM YAZILAR Uygun bir sonuç bulunamadı Ana Sayfa Pazar Pazartesi Salı Çarşamba Perşembe Cuma Cumartesi Paz Pzt Sal Çar Per Cum Cmt Ocak Şubat Mart Nisan Mayıs Haziran Temmuz Ağustos Eylül Ekim Kasım Aralık Oca Şub Mar Nis Mayıs Haz Tem Ağu Eyl Eki Kas Ara Az önce 1 saat önce $$1$$ dakika önce 1 saat önce $$1$$ saat önce Dün $$1$$ gün önce $$1$$ hafta önce Ay önce Takipçiler Takip et THIS CONTENT IS PREMIUM Please share to unlock Kodları kopyala Tüm kodları seç Tüm kodlar kopyalandı Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy