Cara Membuat Recent Post Berjalan di Blogspot

Widget Recent Post digunakan untuk Menampilkan Artikel atau Postingan yang terbaru yang kita upload di Blog. Tujuan Membuat judul Recent Post berjalan adalah mengelompokan suatu judul postingan Sesuai Label blog pada sebuah Gadget blogspot (HTML/JavaScript). Widget ini biasa dipasang berjejer ke bawah atau bisa juga dibuat menjadi berjalan dari sebelah kiri ke kanan dan sebaliknya. Widget Recent post berjalan ini sangat bagus dan cocok ditempatkan dibawah Header ataupun bisa juga di Footer dengan lebar Gadget maximal sesuai lebar halaman blog.

Widget ini Hampir Mirip dengan Widget Related Post atau Artikel Terkait dengan Gambar yang kita bahas sebelum ini. Namun hanya saja Widget related post biasa di pasang tepat di bawah atau disamping posting akan menarik perhatian pengunjung untuk membacanya. Cara membuat Widget Recent Post Berjalan adalah sebagai berikut :
Masuk ke halaman Dasboard Pilih Tata Letak (Rancangan) pilih Elemen Laman
Tambah Gadget Elemen HTML/JavaScript

Copy kode berikut dan paste pada elemen HTML/JavaScript tersebut

<script type='text/javascript'>

//<![CDATA[

function RecentPostsScrollerv2(json)

{

var sHeadLines;

var sPostURL;

var objPost;

var sMoqueeHTMLStart;

var sMoqueeHTMLEnd;

var sPoweredBy;

var sHeadlineTerminator;

var sPostLinkLocation;

try

{

sMoqueeHTMLStart = "\<MARQUEE onmouseover=\"this.stop();\" onmouseout=\"this.start();\" ";

if( nWidth)

{

sMoqueeHTMLStart = sMoqueeHTMLStart + " width = \"" + nWidth + "%\"";

}

else

{

sMoqueeHTMLStart = sMoqueeHTMLStart + " width = \"100%\"";

}

if( nScrollDelay)

{

sMoqueeHTMLStart = sMoqueeHTMLStart + " scrolldelay = \"" + nScrollDelay + "\"";

}

if(sDirection)

{

sMoqueeHTMLStart = sMoqueeHTMLStart + " direction = \"" + sDirection + "\"";

if(sDirection == "top" || sDirection =="bottom")

{

//For left and right directions seperate the headilnes by two spaces.

sHeadlineTerminator = "&nbsp;&nbsp;";

}

else

{

//For down and up directions seperate headlines by new line

sHeadlineTerminator = "\<br/\>";

}

}

if(sOpenLinkLocation =="N")

{

sPostLinkLocation = " target= \"_blank\" ";

}

else

{

sPostLinkLocation = " ";

}

sMoqueeHTMLEnd = "\</MARQUEE\>"

sHeadLines = "";

for(var nFeedCounter = 0; nFeedCounter < nMaxPosts; nFeedCounter++)

{

objPost = json.feed.entry[nFeedCounter];

for (var nCounter = 0; nCounter < objPost.link.length; nCounter++)

{

if (objPost.link[nCounter].rel == 'alternate')

{

sPostURL = objPost.link[nCounter].href;

break;

}

}

sHeadLines = sHeadLines + "\<b\>"+sBulletChar+"\</b\> \<a " + sPostLinkLocation + " href=\"" + sPostURL + "\">" + objPost.title.$t + "\</a\>" + sHeadlineTerminator;

}

document.write(sMoqueeHTMLStart + sHeadLines + sMoqueeHTMLEnd )

}

catch(exception)

{

alert(exception);

}

}

//]]>

</script>

<script style="text/javascript"> var nMaxPosts = 20; var sBgColor; var nWidth; var nScrollDelay = 180; var sDirection="top"; var sOpenLinkLocation="Y"; var sBulletChar="�"; </script> <script style="text/javascript" src="http://namablogSOBAT.blogspot.com/feeds/posts/default?alt=json-in-script&callback=RecentPostsScrollerv2"></script>

Keterangan :
Ganti kode yang berwarna Hijau dengan alamat blog sobat.
var nMaxPosts = 20 adalah jumlah postingan terakhir yang ingin di tampilkan. angka tersebut bisa diganti sesuai keinginan anda.

var nScrollDelay = 180 adalah kecepatan text berjalan

var sDirection="left" untuk text berjalan dari kanan ke kiri, ganti dengan "right" jika ingin text tersebut berjalan dari kiri ke kanan.
var sOpenLinkLocation="Y" untuk link pada halaman yang sama, ganti dengan "N" untuk membuka link pada jendela baru (new tab).
var sBulletChar="•" adalah icon kecil pada bagian depan setiap link, bisa diganti dengan apa saja sesuai selera

Selamat Mencoba

• facebook
• twitter
• google+
• tumblr
• linkedin
• pinterest
• Whatsapp
• blackberry