Cara Memasang Recent Posts Blog - Judul Widget Tetap Ada

WIDGET Recent Posts, Latest Post, Tulisan Terbaru, atau Artikel Terbaru biasa dipasang di sidebar blog. Isinya berupa dafta posting terbaru.

Widget ini termasuk widget yang "wajib" dipasang di sidebar blog untuk navigasi internal sekalikus tautan internal yang dianjurkan Google. Pengunjung juga mungkin akan mencari tahu, posting terbaru apa yang ada di blog yang dikunjunginya.

Cara memasangnya sangat mudah, yaitu dengan memakai widget Feeds:

1. Layout > Add a Gadget > Pilih Feed
2. Masukkan alamat Blog Anda di Feed Url
3. Klik Continue
4. Ubah Nama Blog dengan Recent Post atau Posting Terbaru
5. Save!

Pilih Feed

 Masukkan Alamat Blog Anda

 Klik Continue dan Ubah Judul Widget (Title)

Beres!
Recent Posts sudah muncul di Sidebar Blog.

Namun, judul widget Recent Post itu suka menghilang. Itu bug yang belum dibenerin aja ama Blogger. Maka, alternatifnya yaitu Memasang Recent Posts Blog dengan arahan JavaScrip semoga Judul Widget Tetap Ada, tidak menghilang. Ini caranya.

Cara Memasang Recent Posts Blog - Judul Widget Tetap Ada

1. Layout > Add a Gadget > Pilih HTML/JavaScript

2. Isi judul dengan Recent Post, POSTING TERBARU atau RECENT POSTS
3. COPAS arahan berikut ini di kolom kontent:

<link href="http://mybloggerlab.com/Scripts/recent.css" type="text/css" rel="stylesheet" />
<script src="http://mybloggerlab.com/Scripts/json.js"></script>
<script type='text/javascript'>
var numposts = 5; //JUMLAH POSTING
var showpostthumbnails = true; //GAMBAR THUMBNAIL ubah ke false jikalau tidak ingin ditampilkan
var displaymore = false;
var displayseparator = true;
var showcommentnum = false;
var showpostdate = false; //TANGGAL POSTING ubah ke true jikalau mau ditampilkan
var showpostsummary = false; //Ringkasan ubah ke true jika mau ada ringkasan
var numchars = 100;</script> //Jumlah huruf ringkasan

<script type="text/javascript" src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=labelthumbs"></script>
<style>
.label_with_thumbs a {text-transform:none;}
</style>

Save! Ini penampakannya sebagaimana dipasang di sidebar blog yang sedang Anda kunjung ini.

Masih banyak arahan lainnya yang dapat digunakan, menyerupai dari MBL berikut ini:

Kode:

<link href="http://mybloggerlab.com/Scripts/recent.css" type="text/css" rel="stylesheet" />
 <script src="http://mybloggerlab.com/Scripts/json.js"></script>

  <script type='text/javascript'>
var numposts = 3;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = true;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 100;</script>
  <script type="text/javascript" src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=labelthumbs"></script> 

Kode Recent Post Judul + Ringkasan, Tanpa Gambar

<link href="http://mybloggerlab.com/Scripts/recent.css" type="text/css" rel="stylesheet" />
 <script src="http://mybloggerlab.com/Scripts/json.js"></script>
  <script type='text/javascript'>
var numposts = 3;
var showpostthumbnails =  false;
var displaymore = false;
var displayseparator = true;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 100;</script>
  <script type="text/javascript" src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=labelthumbs"></script>

Kode Recent Post Judulnya saja, TANPA GAMBAR:

<link href="http://mybloggerlab.com/Scripts/recent.css" type="text/css" rel="stylesheet" />
<script src="http://mybloggerlab.com/Scripts/json.js"></script>

 <script type='text/javascript'>
var numposts = 3;
var showpostthumbnails = false;
var displaymore = false;
var displayseparator = true;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = false;
var numchars = 100;</script>
  <script type="text/javascript" src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=labelthumbs"></script>

Ada juga yang tampilannya unik menyerupai dari HelpLogger berikut ini:

Kodenya:

<div class="recentpoststyle">
<script type="text/javascript">
function showlatestposts(e){for(var t=0;t<posts_no;t++){var r,s=e.feed.entry[t],n=s.title.$t;if(t==e.feed.entry.length)break;for(var a=0;a<s.link.length;a++)if("alternate"==s.link[a].rel){r=s.link[a].href;break}n=n.link(r);var i="... read more";i=i.link(r);var l=s.published.$t,o=l.substring(0,4),u=l.substring(5,7),c=l.substring(8,10),m=new Array;if(m[1]="Jan",m[2]="Feb",m[3]="Mar",m[4]="Apr",m[5]="May",m[6]="Jun",m[7]="Jul",m[8]="Aug",m[9]="Sep",m[10]="Oct",m[11]="Nov",m[12]="Dec","content"in s)var d=s.content.$t;else if("summary"in s)var d=s.summary.$t;else var d="";var v=/<\S[^>]*>/g;if(d=d.replace(v,""),document.write('<li class="recent-post-title">'),document.write(n),document.write('</li><div class="recent-post-summ">'),1==post_summary)if(d.length<summary_chars)document.write(d);else{d=d.substring(0,summary_chars);var f=d.lastIndexOf(" ");d=d.substring(0,f),document.write(d+" "+i)}document.write("</div>"),1==posts_date&&document.write('<div class="post-date">'+m[parseInt(u,10)]+" "+c+" "+o+"</div>")}}
</script>
<script type="text/javascript">
var posts_no = 5;var posts_date = true;var post_summary = true;var summary_chars = 80;</script>
<script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showlatestposts">
</script><a style="font-size: 9px; color: #CECECE;margin-top:10px;" href="http://templetedownload.blogspot.com//search?q=cara-menampilkan-widget-recent-posts" rel="nofollow">Recent Posts Widget</a>
<noscript>Your browser does not support JavaScript!</noscript>
<style type="text/css">
.recentpoststyle {counter-reset: countposts;list-style-type: none;}
.recentpoststyle a {text-decoration: none;color: #49A8D1;}
.recentpoststyle a:hover {color: #000;}
.recentpoststyle li:before {content: counter(countposts,decimal);counter-increment: countposts;float: left;z-index: 1;position:relative;font-size: 15px;font-weight: bold;color:#fff;background:#69B7E2; margin:13px 5px 0px -6px;line-height:30px;width:30px;height:30px;text-align:center;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;}li.recent-post-title{margin-bottom: 5px;padding: 0;}
.recent-post-title a {color: #444;text-decoration: none;font: bold 13px "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;}
.post-date {font-size: 11px;color: #999;margin:5px 0px 15px 32px;}
.recent-post-summ {border-left:1px solid #69B7E2; color: #777; padding: 0px 5px 0px 20px; margin-left: 10px; font: 15px Garamond,Baskerville,"Baskerville Old Face","Hoefler Text","Times New Roman",serif;}
</style></div>

Demikian Cara Memasang Recent Posts Blog - Judul Widget Tetap Ada.*

Cara Memasang Random Posts Fast Loading di Sidebar Blog

RANDOM Posts artinya posting yang ditampilkan secara acak. Bisa berupa judul plus gambar dan ringkasan, dapat juga hanya berupa daftar judul goresan pena --ini yang fast loading.

Fungsi Random Post ini sebagai sajian navigasi atau internal link. Sama dengan fungsi widget Popular Posts, Most Commented Posts, Related Posts, dan Recent Posts.

Widget Random Posts memunculkan dan mempromosikan posting usang secara acak kepada pengunjung yang sedang membuka halaman blog kita.

Random sendiri artinya --menurut Kamus Inggris-- secara serampangan, dengan sembarangan, tidak disengaja. Tapi, dalam konteks blogger, maksudnya yakni dimunculkan secara acak oleh arahan yang dipasang.

Menurut para senior blogger, random post ini elok buat meningkatkan pageviews, bahkan dapat meningkatkan seo blog sebab Google dapat mengindeksnya.

Berikut ini cara memasang widget random post yang penampakannya menyerupai gambar di bawah ini. Demo Random Post Widget dapat dilihat di sidebar paling bawah halaman posting blog ini.

Cara Memasang Random Posts Fast Loading di Sidebar Blog

1. Di Dashbord Blogger, klik "Layout" (Tata Letak) > Pilih "HTML/Javascript"
2. Isi judul widget dengan Random Posts atau bebas --misalnya Posting Rekomendasi
3. Copy & Paste arahan berikut ini:

<ul id="random-posts"></ul>
<script>
//<![CDATA[
var homePage = "http://blogromeltea.blogspot.com/",
numPosts = 5;
function randomPosts(a){if(document.getElementById("random-posts")){var e=shuffleArray(a.feed.entry),title,link,img,content="",ct=document.getElementById("random-posts");for(var i=0;i<numPosts;i++){for(var j=0;j<numPosts;j++){if(e[i].link[j].rel=="alternate"){link=e[i].link[j].href;break}}var title=e[i].title.$t;content+='<strong><li class="random-posts"><a href="'+link+'" title="Cara Memasang Random Posts Fast Loading di Sidebar Blog" target="_blank">'+title+'</a></li></strong>'}ct.innerHTML=content}}function shuffleArray(arr){var i=arr.length,j,temp;if(i===0)return false;while(--i){j=Math.floor(Math.random()*(i+1));temp=arr[i];arr[i]=arr[j];arr[j]=temp}return arr}var random_post=document.createElement('script');random_post.src=homePage+'/feeds/posts/summary?alt=json-in-script&orderby=published&max-results=999&callback=randomPosts';document.getElementsByTagName('head')[0].appendChild(random_post);
//]]>
</script>

Note!
Ganti http://blogromeltea.blogspot.com/ dengan alamat blog Anda.

4. Save!

Memunculkan Random Post di Halaman Dalam Saja

Jika hanya akan dimunculkan di halaman posting atau halaman dalam, tidak tampil di halaman depan (home), gunakan Tag Kondisional berikut ini:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
</b:if>

Cara Memasangnya:
1. Klik Template > Edit HTML
2. Cari arahan widget Random Post yang sudah dipasang tadi: Ctrl+F > Random Post
3. Akan ditemukan arahan menyerupai ini:

 <b:widget id='HTML4' locked='false' title='Random Posts' type='HTML' visible='true'>
      <b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
    </b:widget>

4. Pasangkan arahan Conditional Tag tadi di bawah arahan <b:includable id='main'> dan di atas arahan </b:includable> menjadi kayak gini (perhatikan posisi arahan warna merah). 

<b:widget id='HTML4' locked='false' title='Random Posts' type='HTML' visible='true'>    
<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
        </b:if>
</b:includable>
    </b:widget>

5. Save Template!

Demikian Cara Memasang Random Posts Fast Loading di Sidebar Blog. Kalau gak work alias gagal, berarti gak kodenya gak cocok dengan blog Anda. Masih banyak arahan Random Post yang lain. Googling aja lagi :)
Wasalam. (http://blogromeltea.blogspot.com/).*

Featured Post yakni widget Blogger yang menampilkan posting unggulan di halaman depan (homepage).

Featured Post ini semacam headline atau gosip utama di situs berita.

Postingan yang ditampilkan di Featured Post menjadi semacam sajian utama atau konten unggulan yang ditawarkan kepada pengunjung blog.

Widget Featured Post juga disediakan Blogger semenjak Desember 2015. Tim Blogger Google merilisnya dengan judul "Highlight the posts that matter the most".

Untuk memasangnya sangat mudah, yaitu tinggal klik Layout > Add a Gadget > pilih Featured Post.

 

Kita dapat pilih salah satu post untuk ditampilkan atau otomatis menampilkan posting terbaru dengan centang "Use the most recent published post".

 

Kita dapat menampikannya di sidebar atau di halaman depan. Anda juga dapat memasang Featured Post bawaan Blogger yang sudah dimodifikasi.

Cara Memasang Featured Post Artikel Terbaru di Blogger

Selain Featured Post Bawaan Blogger, banyak pula desain featured post lainnya dengan tampilan beraam dan menampilkan lebih dari satu postingan. Salah satunya dengan memasangkan isyarat berikut ini. Penampakannya ibarat ilustrasi gambar di atas.

Featured Post Artikel Terbaru di Blogger ini di-share Help Logger. Di demonya,  Featured Post Image Slider dipasang di sidebar, dengan menampilkan posting terbaru.

Berikut ini cara Cara Memasang Featured Post Image Slider Otomatis di Sidebar Blogger:

1. Layout > Add a Gadget > pilih HTML/JavaScript
2. Judul Isi dengan "Featured Posts" atau Kosongkan
3. Copy & Paste Kode berikut ini:

<style type="text/css">
ul.featured-widget-list,ul.featured-widget-list li{margin:0;padding:0;list-style:none;position:relative }ul.featured-widget-list li{display:none}ul.featured-widget-list li:nth-child(1){display:block;line-height:0}ul.featured-widget-list img{border:0;width:100%;height:auto}ul.featured-widget-list .featuredbg{width:100%;height:100%;position:absolute;z-index:2;left:0;top:0;opacity:.6;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhANMkEHIHg3mVKl5oL1X9MkdRwIU04xPk6uLd74d1U_Hp6hB_JdTUjDJWPl1XHlbRZagv2hTCOui0E6Jl7eFTTFapJtg6KDmNkSWP9rqtjvbUsBvpwI7XsU_pUig1p6SuOWnSniaWuSE4/s400/overlay-bg.png);background-position:0% 100%;background-repeat:repeat-x}ul.featured-widget-list .featuredbg:hover{opacity:.1}ul.featured-widget-list h5{position:absolute;left:0;right:0;text-align:center;bottom:10px;z-index:2;color:#fff;margin:0;text-transform: capitalize;padding:10px 20px;line-height:1.9em;letter-spacing:0.3px;font: 600 16px 'Abel', sans-serif;overflow:hidden}ul.featured-widget-list li:hover h5{bottom:30px}ul.featured-widget-list .featured-meta{font: 11px 'Abel', sans-serif;letter-spacing:0.3px;position:absolute;bottom:0;left:0;right:0;text-align:center;z-index:2;color:#fff;opacity:0}ul.featured-widget-list h5, ul.featured-widget-list .featured-meta {-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}ul.featured-widget-list li:hover .featured-meta{bottom:20px;opacity:1}.feat-buttons{position:absolute;top:50%;left:0;z-index:5;width:100%}
.feat-buttons a{text-indent:-9999px;margin:0 7px;width:15px;height:15px;padding:5px;background:#000;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";filter: alpha(opacity=60);-moz-opacity:0.6;-khtml-opacity:0.6;opacity:0.6;position:relative;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;}.feat-prev{float:left;}.feat-next{float:right;}.feat-buttons a.feat-prev::before, .feat-buttons a.feat-next::before{content:"";width:0;height:0;border-width:6px 7px;border-style:solid;border-color:transparent #fff transparent transparent;position:absolute;top:50%;margin-top:-6px;margin-left:-11px;left:50%}
.feat-buttons a.feat-next::before{border-color:transparent transparent transparent #fff;margin-left:-3px}
</style>
<div id="featuredbwidget"></div>
<link href='https://fonts.googleapis.com/css?family=Abel' rel='stylesheet' type='text/css'/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script type='text/javascript'>
//<![CDATA[
featuredbwidget({
listURL:"https://namabloganda.blogspot.com/",
featuredNum:9,
listbyLabel:false,
feathumbSize:350,
interval:3000,
autoplay:true,
featuredID:"#featuredbwidget"
});
function featuredbwidget(a){(function(e){var h={listURL:"",featuredNum:3,featuredID:"",feathumbSize:300,interval:5000,autoplay:false,loadingFeatured:"nextfeatured",pBlank:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzGWUUis8RqEgIksViifR0Mm_IqWogTLg5yg_Nf1w8_7kD9wV4lpd87IhyQA6bQZCVH7PqbXS1eo4vHoUgiqnuBGdeAROQceWGPDzS9NSEmYBFywOwaujKPSwlNz8dYeTLPYDmmeyAWxY/s500/no-image.png",byMonth:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],listbyLabel:false};h=e.extend({},h,a);var g=e(h.featuredID);var d=h.featuredNum*200;g.html('<div class="featslider"><ul class="featured-widget-list"></ul><div class="feat-buttons"><a href="#" class="feat-prev">Prev</a><a href="#" class="feat-next">Next</a></div></div>');var f=function(w){var q,k,m,u,x,p,t,v,r,l="",s=w.feed.entry;for(var o=0;o<s.length;o++){for(var n=0;n<s[o].link.length;n++){if(s[o].link[n].rel=="alternate"){q=s[o].link[n].href;break}}if("media$thumbnail" in s[o]){u=s[o].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+h.feathumbSize+"-c")}else{u=h.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+h.feathumbSize+"$1")}k=s[o].title.$t;r=s[o].published.$t.substring(0,10);m=s[o].author[0].name.$t;x=r.substring(0,4);p=r.substring(5,7);t=r.substring(8,10);v=h.byMonth[parseInt(p,10)-1];l+='<li><a href="'+q+'"><div class="featuredbg"></div><img class="featuredthumb" src="'+u+'"/><h5>'+k+'</h5></a><div class="featured-meta"><span class="fdate"><span class="fday">'+t+'</span> <span class="fmonth">'+v+'</span> <span class="fyear">'+x+'</span></span> - <span class="fauthor">'+m+"</span></div></li>"}e("ul",g).append(l).addClass(h.loadingFeatured)};var c=function(){e(h.featuredID+" .feat-next").click()};var b=function(){e.get((h.listURL===""?window.location.protocol+"//"+window.location.host:h.listURL)+"/feeds/posts/summary"+(h.listbyLabel===false?"":"/-/"+h.listbyLabel)+"?max-results="+h.featuredNum+"&orderby=published&alt=json-in-script",f,"jsonp");setTimeout(function(){e(h.featuredID+" .feat-prev").click(function(){e(h.featuredID+" .featslider li:first").before(e(h.featuredID+" .featslider li:last"));return false});e(h.featuredID+" .feat-next").click(function(){e(h.featuredID+" .featslider li:last").after(e(h.featuredID+" .featslider li:first"));return false});if(h.autoplay){var i=h.interval;var j=setInterval(c,i);e(h.featuredID+" .featslider li:first").before(e(h.featuredID+" .featslider li:last"));e(h.featuredID+" .featslider").hover(function(){clearInterval(j)},function(){j=setInterval(c,i)})}e("ul",g).removeClass(h.loadingFeatured)},d)};e(document).ready(b)})(jQuery)};
//]]>
</script>

Catatan

• listURL - ganti dengan alamat URL blog Anda
• featuredNum - jumlah posting, dapat diubah
• listbyLabel - jikalau akan menampilkan posting dengan label tertentu, ubah menjadi lissbyLabel:"Nama Label"
• featthumbSize - ukuran atau dimensi gambar dalam pixel
• interval - pergantian gambar dalam detik'
• autoplay - ubah true manjadi false jikalau akan dimatikan autoplaynya
• Kode warna hijau yakni link ke  isyarat jQuery. Jika di template Anda sudah ada isyarat tersebut, hapus saja, jangan disertakan.

4. Save!

Berikut ini isyarat Featured Post Image Slider Otomatis yang sudah sedikit dimodifikasi, untuk dipasang di halaman depan blog.

Bagian yang dimodifikasi yakni tinggi gambar (height) menjadi 300px dan autoplay dimatikan (false).

<style type="text/css">
ul.featured-widget-list,ul.featured-widget-list li{margin:0;padding:0;list-style:none;position:relative }ul.featured-widget-list li{display:none}ul.featured-widget-list li:nth-child(1){display:block;line-height:0}ul.featured-widget-list img{border:0;width:100%;height:300px}ul.featured-widget-list .featuredbg{width:100%;height:100%;position:absolute;z-index:2;left:0;top:0;opacity:.6;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhANMkEHIHg3mVKl5oL1X9MkdRwIU04xPk6uLd74d1U_Hp6hB_JdTUjDJWPl1XHlbRZagv2hTCOui0E6Jl7eFTTFapJtg6KDmNkSWP9rqtjvbUsBvpwI7XsU_pUig1p6SuOWnSniaWuSE4/s400/overlay-bg.png);background-position:0% 100%;background-repeat:repeat-x}ul.featured-widget-list .featuredbg:hover{opacity:.1}ul.featured-widget-list h5{position:absolute;left:0;right:0;text-align:center;bottom:10px;z-index:2;color:#fff;margin:0;text-transform: capitalize;padding:10px 20px;line-height:1.9em;letter-spacing:0.3px;font: 600 16px 'Abel', sans-serif;overflow:hidden}ul.featured-widget-list li:hover h5{bottom:30px}ul.featured-widget-list .featured-meta{font: 11px 'Abel', sans-serif;letter-spacing:0.3px;position:absolute;bottom:0;left:0;right:0;text-align:center;z-index:2;color:#fff;opacity:0}ul.featured-widget-list h5, ul.featured-widget-list .featured-meta {-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}ul.featured-widget-list li:hover .featured-meta{bottom:20px;opacity:1}.feat-buttons{position:absolute;top:50%;left:0;z-index:5;width:100%}
.feat-buttons a{text-indent:-9999px;margin:0 7px;width:15px;height:15px;padding:5px;background:#000;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";filter: alpha(opacity=60);-moz-opacity:0.6;-khtml-opacity:0.6;opacity:0.6;position:relative;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;}.feat-prev{float:left;}.feat-next{float:right;}.feat-buttons a.feat-prev::before, .feat-buttons a.feat-next::before{content:"";width:0;height:0;border-width:6px 7px;border-style:solid;border-color:transparent #fff transparent transparent;position:absolute;top:50%;margin-top:-6px;margin-left:-11px;left:50%}
.feat-buttons a.feat-next::before{border-color:transparent transparent transparent #fff;margin-left:-3px}
</style>
<div id="featuredbwidget"></div>
<link href='https://fonts.googleapis.com/css?family=Abel' rel='stylesheet' type='text/css'/>
<script type='text/javascript'>
//<![CDATA[
featuredbwidget({
listURL:"https://namabloganda.blogspot.com",
featuredNum:5,
listbyLabel:false,
feathumbSize:350,
interval:3000,
autoplay:false,
featuredID:"#featuredbwidget"
});
function featuredbwidget(a){(function(e){var h={listURL:"",featuredNum:3,featuredID:"",feathumbSize:300,interval:5000,autoplay:false,loadingFeatured:"nextfeatured",pBlank:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzGWUUis8RqEgIksViifR0Mm_IqWogTLg5yg_Nf1w8_7kD9wV4lpd87IhyQA6bQZCVH7PqbXS1eo4vHoUgiqnuBGdeAROQceWGPDzS9NSEmYBFywOwaujKPSwlNz8dYeTLPYDmmeyAWxY/s500/no-image.png",byMonth:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],listbyLabel:false};h=e.extend({},h,a);var g=e(h.featuredID);var d=h.featuredNum*200;g.html('<div class="featslider"><ul class="featured-widget-list"></ul><div class="feat-buttons"><a href="#" class="feat-prev">Prev</a><a href="#" class="feat-next">Next</a></div></div>');var f=function(w){var q,k,m,u,x,p,t,v,r,l="",s=w.feed.entry;for(var o=0;o<s.length;o++){for(var n=0;n<s[o].link.length;n++){if(s[o].link[n].rel=="alternate"){q=s[o].link[n].href;break}}if("media$thumbnail" in s[o]){u=s[o].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+h.feathumbSize+"-c")}else{u=h.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+h.feathumbSize+"$1")}k=s[o].title.$t;r=s[o].published.$t.substring(0,10);m=s[o].author[0].name.$t;x=r.substring(0,4);p=r.substring(5,7);t=r.substring(8,10);v=h.byMonth[parseInt(p,10)-1];l+='<li><a href="'+q+'"><div class="featuredbg"></div><img class="featuredthumb" src="'+u+'"/><h5>'+k+'</h5></a><div class="featured-meta"><span class="fdate"><span class="fday">'+t+'</span> <span class="fmonth">'+v+'</span> <span class="fyear">'+x+'</span></span> - <span class="fauthor">'+m+"</span></div></li>"}e("ul",g).append(l).addClass(h.loadingFeatured)};var c=function(){e(h.featuredID+" .feat-next").click()};var b=function(){e.get((h.listURL===""?window.location.protocol+"//"+window.location.host:h.listURL)+"/feeds/posts/summary"+(h.listbyLabel===false?"":"/-/"+h.listbyLabel)+"?max-results="+h.featuredNum+"&orderby=published&alt=json-in-script",f,"jsonp");setTimeout(function(){e(h.featuredID+" .feat-prev").click(function(){e(h.featuredID+" .featslider li:first").before(e(h.featuredID+" .featslider li:last"));return false});e(h.featuredID+" .feat-next").click(function(){e(h.featuredID+" .featslider li:last").after(e(h.featuredID+" .featslider li:first"));return false});if(h.autoplay){var i=h.interval;var j=setInterval(c,i);e(h.featuredID+" .featslider li:first").before(e(h.featuredID+" .featslider li:last"));e(h.featuredID+" .featslider").hover(function(){clearInterval(j)},function(){j=setInterval(c,i)})}e("ul",g).removeClass(h.loadingFeatured)},d)};e(document).ready(b)})(jQuery)};
//]]>
</script>

DemikianCara Memasang Featured Post Artikel Terbaru di Blogger. (blogromeltea.blogspot.com).*