Etikete Bağlı Son Yayınlar Galerisi Yapımı

Blogger Etikete Bağlı Son Yazılar Galerisi Yapımı. Daha önce blogger son yazılar eklentisini slider şeklinde vitrin olarak nasıl yapabileceğinizi şuradaki yazımda anlatmıştım. Şimdi sizlerle yine bloger için son yayınlar eklentisini paylaşacağım ama bunda biraz daha fark var:
1. Etikete göre son yazıları gösterir
2. Son yazıları galeri şeklinde gösterir.
Bu sayede blogunuz sidbarına rahatlıkla eklersiniz ve blogunuza şıklık ve kolaylık katarsınız.

Mesela yayınlarınız arasında "blogger" etiketine sahip yazılar var işte bunların son 9 tanesini veya sizin belirleyeceğniz adetini gösteren bir galeri yapacağız.

Blogger etikete bağlı son yayınları kutucuklar içerisinde satır ve sütunlara bölerek göstermek isterseniz buyurun anlatıyorum.

Blogger etikete bağlı son yazılar galerisi nasıl yapılır?

1. Blogger

2. Şablon

3. HTML'yi Düzenle

4. CTRL+F tuşlarına basarak </head> kodunu bulun ve hemen alt satırına aşağıdaki kodları yapıştırın.

<script type='text/javascript'>
//<![CDATA[
// Recent Post Gallery
function arlinagrid(a){for(var t=a.feed.entry||[],e=['<div class="recent-gallery">'],i=0;i<t.length;++i){for(var l=t[i],r=l.title.$t,n=l.media$thumbnail?l.media$thumbnail.url:"http://2.bp.blogspot.com/-4fCf53FqYKM/Vccsy7apoZI/AAAAAAAAK4o/XJkv3RkC0pw/s1600/default%2Bimage.png",s=n.replace("s72-c","s"+arlina_thumbs+"-c"),h=l.link||[],c=0;c<h.length&&"alternate"!=h[c].rel;++c);var d=h[c].href,m='<img src="'+s+'" width="'+arlina_thumbs+'" height="'+arlina_thumbs+'"/>',p=arlina_title?'<span class="ptitle">'+r+"</span>":"",g='<a href="'+d+'" target="_blank" title="'+r+'">'+m+p+"</a>";e.push('<div class="ad-item">',g,"</div>")}e.push("</div>"),document.write(e.join(""))}
//]]>
</script>

5. Şimdi ]]></b:skin> kodunu bulun ve üst satırına aşağıdaki kodları yapıştırın. 

/* CSS son yazılar galerisi */
.recent-gallery {padding:0;clear:both;}
.recent-gallery:after {content:"";display:table;clear:both;}
.recent-gallery .ad-item{display:inline-block;position:relative;margin:6px 0;overflow:hidden;}
.recent-gallery .ad-item a{position:relative;float:left;margin:0 6px;text-decoration:none}
.recent-gallery .ad-item .ptitle{background:rgba(0,0,0,.7);display:block;clear:left;font-size:10px;line-height:1.3em;position:absolute;text-align:left;bottom:3px;left:3px;right:3px;top:3px;color:#fff;padding:5px;word-wrap:break-word;overflow:hidden;visibility:hidden;opacity:0;backface-visibility:hidden;transition:all .2s}
.recent-gallery .ad-item:hover .ptitle{visibility:visible;opacity:1}
.recent-gallery a img{background:#fdfdfd;float:left;padding:2px;border:1px solid #e3e3e3;transition:all .3s}
.recent-gallery a:hover img {border-color:#bbb;}

6. Şablonu kaydedin.
7. Şimdi Yerleşim-Gadget Ekle HTML/JawaScript yolunu takip ederek aşağıdaki kodları yapıştırın ve kaydedin.

<script>
var arlina_thumbs = 72; 
var arlina_title = true; 
</script>

<script src="/feeds/posts/summary/-/BLOGGER?max-results=9&amp;alt=json-in-script&amp;callback=arlinagrid"></script>

BLOGGER etiketi yerine göstermek istediğiniz kendi etiketinizi yazın. 9 sayısı gösterilecek yazıyı belirler. 

Blogger bloglar için etikete bağlı son yayınları galeri şeklinde sidebarda göstermek için yapılması gerekenler bu kadar. Daha fazla blogger eklentisi ve blogger ipuçlarına ulaşmak için bloğumu izle ve yorumlarla katkıda bulun. İyi bloglamalar ;)

Kaynak: http://blogbakkali.blogspot.com.tr/2015/08/blogger-etikete-bagli-son-yayinlar-galerisi-yapimi.html

Paylaş Facebook

Paylaş Twitter

Paylaş Google+

Paylaş LinkedIn