Cara Membuat Recent Post Dengan Tombol NEXT

Apa kabar sobat..., kali ini saya akan berbagi tips blog yaitu tentang Cara Membuat Recent Post Dengan Tombol NEXT. Sobat penasaran kayak gimana recent postnya kan.., monggo di simak.

Ikuti Langkah-langkahnya :

Pertama Login Blogger
Lalu buka Tata Letak
Lalu klik Add Gadget
Setelah itu masukkan kode dibawah ini.
<script type='text/javascript'>
//<![CDATA[
var numfeed = 4; /* Jumlah Postingan */
var startfeed = 0;
var urlblog = "http://dianarimablog.blogspot.com/";
var charac = 100;
var urlprevious, urlnext;
function akaUTkolisfeed(ir,banget){
var showfeed = ir.split("<");
for(var i=0;i<showfeed.length;i++){
if(showfeed[i].indexOf(">")!=-1){
showfeed[i] = showfeed[i].substring(showfeed[i].indexOf(">")+1,showfeed[i].length);
}
}
showfeed = showfeed.join("");
showfeed = showfeed.substring(0,banget-1);
return showfeed;
}
function showterbaru(json) {
var entry, posttitle, posturl, postimg, postcontent;
var showblogfeed = "";
urlprevious = "";
urlnext = "";
for (var k = 0; k < json.feed.link.length; k++) {
if (json.feed.link[k].rel == 'previous') {
urlprevious = json.feed.link[k].href;
}
if (json.feed.link[k].rel == 'next') {
urlnext = json.feed.link[k].href;
}
}
for (var i = 0; i < numfeed; i++) {
if (i == json.feed.entry.length) { break; }
entry = json.feed.entry[i];
posttitle = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
if ("content" in entry) {
postcontent = entry.content.$t;
} else if ("summary" in entry) {
postcontent = entry.summary.$t;
} else {
postcontent = "";
}
if ("media$thumbnail" in entry) {
postimg = entry.media$thumbnail.url;
} else {
postimg = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdf2u9KEreYNyCopPwYgK-m7kiP6ubR8l4bd7UL12gJNtqyE43Co_8puDcWBOuv5ojoMawRrjXNXuAzuObtSbe1ZPgYseFId5Kix-qf_ZnP1Ltn6v9-agZ5iUjJhhT4BbFahYs8xJ4oPc/s1600/no+image.jpg";
}
showblogfeed += "<div class='akaUT-elemen'>";
showblogfeed += "<a href='" + posturl + "' target='_blank'><img src='" + postimg + "' /></a>";
showblogfeed += "<h6><a href='" + posturl + "'>" + posttitle + "</a></h6>";
showblogfeed += "<p>" + akaUTkolisfeed(postcontent,charac) + "...</p>";
showblogfeed += "</div>";
}
document.getElementById("akaterbaru").innerHTML = showblogfeed;
showblogfeed = "";
if(urlprevious) {
showblogfeed += "<a href='javascript:navigasifeed(-1);' class='previous'>◄ Previous</a>";
} else {
showblogfeed += "<span class='noactived previous'>◄ Previous</span>";
}
if(urlnext) {
showblogfeed += "<a href='javascript:navigasifeed(1);' class='next'>Next ►</a>";
} else {
showblogfeed += "<span class='noactived next'>Next ►</span>";
}
showblogfeed += "<a href='javascript:navigasifeed(0);' class='home'>Home</a>";
document.getElementById("akaUT-navigasifeed").innerHTML = showblogfeed;
}
function navigasifeed(url){
var p, parameter;
if(url==-1) {
p = urlprevious.indexOf("?");
parameter = urlprevious.substring(p);
} else if (url==1) {
p = urlnext.indexOf("?");
parameter = urlnext.substring(p);
} else {
parameter = "?start-index=1&max-results=" + numfeed + "&orderby=published&alt=json-in-script"
}
parameter += "&callback=showterbaru";
incluirscript(parameter);
}
function incluirscript(parameter) {
if(startfeed==1) {removerscript();}
document.getElementById("akaterbaru").innerHTML = "<div id='akaUT-loading'></div>";
document.getElementById("akaUT-navigasifeed").innerHTML = "";
var archievefeed = urlblog + "/feeds/posts/default"+ parameter;
var akaterbaru = document.createElement('script');
akaterbaru.setAttribute('type', 'text/javascript');
akaterbaru.setAttribute('src', archievefeed);
akaterbaru.setAttribute('id', 'MASLABEL');
document.getElementsByTagName('head')[0].appendChild(akaterbaru);
startfeed = 1;
}
function removerscript() {
var elemen = document.getElementById("MASLABEL");
var parent = elemen.parentNode;
parent.removeChild(elemen);
}
onload=function() { navigasifeed(0); }
//]]>
</script>
<div id="akaterbaru"></div>
<div id="akaUT-navigasifeed"></div>
<style>
#aka-terbaru{border:1px solid #585858;width:100%;margin:0 auto}
#akaterbaru{margin:0px}
.akaUT-elemen{background-color:#fff;border:1px solid #ccc;margin:5px 0;padding:5px;height:79px}
.akaUT-elemen img{background:#eee;padding:4px;float:left;height:70px;margin-right:8px;width:70px}
.akaUT-elemen h6,.akaUT-elemen h6 a{font-size:12px!important;font-weight:700!important;margin:0;color:#111}
.akaUT-elemen:hover{background-color:#ecf3fb}
.akaUT-elemen p{text-align:justify;color:#555;line-height:14px;margin:5px 0}
#akaUT-loading{color:#888;font-family:Tahoma;font-size:100px;letter-spacing:-10px;text-align:center;text-shadow:-5px 0 1px #444;background:#ffffff url(http://www.westmarine.com/wcsstore/MadisonsStorefrontAssetStore/images/colors/color1/loading.gif) no-repeat 50% 50%;height:470px;border:1px solid #c3c3c3}
#akaUT-navigasifeed{background-color:#fff;border:1px solid #c3c3c3;color:#bbb;font-family:Verdana;font-size:12px;text-align:center;margin:0px}
#akaUT-navigasifeed:hover{background-color:#ecf3fb}
#akaUT-navigasifeed a{color:#141414!important;font-family:Tahoma!important;font-size:12px!important;font-weight:400!important;display:block;padding:5px 10px}
#akaUT-navigasifeed span{padding:5px 10px}
#akaUT-navigasifeed .next{float:right}
#akaUT-navigasifeed .previous{float:left}
#akaUT-navigasifeed .home{text-align:center}
#akaUT-navigasifeed a:hover,#akaUT-navigasifeed span.noactived{color:transparant!important}
</style>

Lalu ganti angkat 4 dengan artikel yang ingin ditampilkan oleh sobat
Lalu ganti http://dianarimablog.blogspot.com/ dengan Alamat link sobat.
Setelah itu simpan dan lihat hasilnya