Cara Membuat Recent Post Berjalan Horizontal

Untuk kesekian kalinya saya akan mengulas kembali tentang recent post, tetapi untuk yang kali ini memang berbeda dari sebelumnya tapiiii.............. masih ada kesamaaanya kok yaitu hanya menampilkan judul postingan saja namun agak berbeda dengan recent posts pada umumnya, recent post berikut adalah recent posts atau postingan terakhir dari blog yang berjalan atau biasa kita sebut dengan marquee secara horizontal.

Baiklah Disini saya akan memberikan contoh tampilan Recent Post Berjalan. berikut contohnya.

â�¢ PES 2013 Option File by Asun11 (FIX)  â�¢ PESEdit.com 2013 Patch 6.0 - Released!   â�¢ Download Adobe Photoshop CS5 (Portable)  â�¢ Cara Mengatur Dan Merapihkan Gambar di Sidebar  â�¢ Dirgahayu HUT RI ke-68  â�¢ PESEdit.com 2013 Patch 5.1 - Released  â�¢ Pengertian Tentang Hacker Dan Cracker  â�¢ Cara Membuat Iklan Banner Berganti Secara Otomatis  â�¢ Avast Internet Security 8.0.1489 sampai 2016 (Valid)   â�¢ 10 Sifat Beracun Dalam Diri yang Patut Kita Waspadai   â�¢ Animasi Bergerak Kaligrafi Allah SWT  â�¢ Kumpulan Ucapan Selamat Lebaran   â�¢ PESEdit.com 2013 Patch 5.0 - The New Season - Released!  â�¢ Cara Memasang Widget Twitter Streaming Tweet di Blog  â�¢ Membuat Loading Animasi Blogspot Mirip Startup Windows 8  â�¢ Cara Membuat Spoiler Komentar Show/Hide di Blog  â�¢ Mengubah Lebar Kotak Komentar di Blogger   â�¢ Membuat Widget Blog Tampil di Halaman Tertentu  â�¢ Cara Membuat Headline Artikel di Blog   â�¢ Woow..!! Foto Cindy Gulla JKT48 Laku Rp. 3,6 Juta   

Berikut Scriptnya :

<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 == "left" || sDirection =="right")
{//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> var nMaxPosts = 20; var sBgColor; var nWidth; var nScrollDelay = 180; var sDirection="left"; var sOpenLinkLocation="Y"; var sBulletChar="�"; </script> <script src="http://rujakcemil.blogspot.com/feeds/posts/default?alt=json-in-script&amp;callback=RecentPostsScrollerv2"></script>

KET : ganti teks yang berwarna Merah dengan URL Blog sobat.

Tertarik ingin memasangnya? berikut langkah singkat dan padatnya, tidak perlu backup template karena kita akan meletakkannya langsung di elemen halaman.

Seperti biasa sobat langsung masuk aja ::>>
1. To the point aja .. klik Rancangan
2. Kemudian klik Tamhah Gadget

 

3. Cari yang Tambah Halaman HTML / Javascript
4. Masukkan salah satu kode diatas kedalamnya :
5. Simpan. dan Lihat hasilnya.
  

Selamat Mencoba

sumber

Anda sedang membaca artikel tentang Cara Membuat Recent Post Berjalan Horizontal. Anda bisa bookmark halaman ini dengan URL http://rujakcemil.blogspot.com/2013/07/cara-membuat-recent-post-berjalan.html. Jika Anda menyukai Artikel di blog ini, Silakan masukkan email Anda di bawah ini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit.