Cara Buat Recent Post Gallery Di Sidebar Blogger - Onet4u Tech
News Update
Loading...

Cara Buat Recent Post Gallery Di Sidebar Blogger

Cara Buat Recent Post Gallery Di Sidebar Blogger
BY Dottycat
Hi O4U Fan.
Kita bertemu lagi dalam posting Cara Buat Recent Post Gallery Di Sdebar Blogger,
Sebenarnya saya tlah kongsikan satu Cara Buat Recent Post Gallery Di Sdebar Blogger tetapi ada sahabat kita yang inginkan Recent post yang lebih Senang , Dan hari ini saya akan kongsikan.
Cara Buat Recent Post Gallery Di Sdebar Blogger

Pertama kali Login ke blogger anda dan tab Theme - Edit Html
Cari code </head> dan tambahkan code ini di atasnya.

<style type='text/css'>
/* Recent Post */
.recent-galeri{padding:0;clear:both}
.recent-galeri:after{content:&quot;&quot;;display:table;clear:both}
.recent-galeri .gallerytem{display:block;float:left;position:relative;margin:0 auto 15px auto;overflow:hidden;padding:0;text-align:center;width:100%;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)}
.recent-galeri .gallerytem:last-child{margin:0 auto}
.recent-galeri .gallerytem a{position:relative;float:left;margin:0;overflow:hidden;text-decoration:none;width:100%}
.recent-galeri .gallerytem .ptitle{background:rgba(255,255,255,.97);display:inline-block;clear:left;font-size:14px;line-height:1.3em;position:absolute;bottom:15px;left:15px;right:15px;color:#888;padding:15px;word-wrap:break-word;text-align:center;backface-visibility:hidden;box-shadow:0 8px 10px -5px rgba(0,0,0,0.15);border-top:2px solid #a4b0be;transition:all .2s}
.recent-galeri .gallerytem:hover .ptitle{background:rgba(255,255,255,.97);color:#222;border-top-color:#eccc68}
.recent-galeri a img{background:#fdfdfd;float:left;margin:auto;text-align:center;width:100%;transition:all .3s}
</style>
<script type='text/javascript'>
//<![CDATA[
// Recent Post
function recdgrid(a){for(var t=a.feed.entry||[],e=['<div class="recent-galeri">'],i=0;i<t.length;++i){for(var l=t[i],r=l.title.$t,n=l.media$thumbnail?l.media$thumbnail.url:"https://4.bp.blogspot.com/-XQARxtj3cwk/VhKQr6dmTBI/AAAAAAAADJc/Tww7zM8jllc/s1600/default.png",s=n.replace("/s72-c/","/w"+recd_thumbs_wid+"-h"+recd_thumbs_hei+"-c/"),h=l.link||[],c=0;c<h.length&&"alternate"!=h[c].rel;++c);var d=h[c].href,m='<img src="'+s+'" width="'+recd_thumbs_wid+'" height="'+recd_thumbs_hei+'"/>',p=recd_title?'<span class="ptitle">'+r+"</span>":"",g='<a href="'+d+'" title="'+r+'">'+m+p+"</a>";e.push('<div class="gallerytem">',g,"</div>")}e.push("</div>"),document.write(e.join(""))}
//]]>
</script>

Cara Buat Recent Post Gallery Di Sdebar Blogger
Tambahkan code berikut ke dalam widget sidbar anda.
<script>
var recd_thumbs_wid = 300; 
var recd_thumbs_hei = 190; 
var recd_title = true; 
</script>
<script src="/feeds/posts/summary?max-results=2&amp;alt=json-in-script&amp;callback=recdgrid"></script>

Setelah selesai simpan Template/Widget anda dan lihat hasilnya.
Sekiranya ada pertanyaan sila tinggalkan comment anda di ruangan yang di sediakan, sampai d sini sahaja posting saya tentang Cara Buat Recent Post Gallery Di Sdebar Blogger. Wasalam

Thanks,
O4U Theme.
DONATION Help make a Donation if the article is useful. Donations will be used to extend O4U www.onet4u.com Domain. Thank you.
Load Comments

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel

Notification
Do You Want Buy This Template? Contact onet4u.com@gmail.com
Done