Membuat recent post accordion

Alhamdulillah masih bisa update post disela-sela kesibukan sekolah yang padat. Kali ini saya akan mengulas recent posts atau artikel terbaru dengan Jquery atau recent post accordion.

Recent Posts AccordionKlik disini untuk melihat demo Recent Posts Accordion

</h3> Membuat recent post accordion </h3>
Masukan semua script dibawah ini ke sebuah gadget HTML/Java Script.

Kode/Script 1

<style type="text/css">
#acrec-post{
 font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;
 font-size:12px;
 color:#333;
 background:url(http://lh3.ggpht.com/_xcD4JK_dIjU/S-KAWJugl3I/AAAAAAAAEBg/bY_3UzrECSg/d/bg5.gif) repeat-y scroll left center #E7F7FB;
 padding:2px 0;
 border:1px solid #339DC6;
}
.acrecpost-label{a
 background:url(http://lh6.ggpht.com/_xcD4JK_dIjU/S-KAVk09KSI/AAAAAAAAEBc/Tqfaca2nwmo/d/bg4.gif) repeat-x scroll 0 0 #E1F4FB;
 font-weight:bold;
 line-height:1.4em !important;
 overflow:hidden;
 vertical-align: baseline;
 margin: 1px 3px;
 outline: none;
 cursor: pointer;
 text-decoration: none;
 padding: 2px 10px;
 color: #FFF;
 text-shadow: 0 1px 1px rgba(0,0,0,.3);
 border:1px solid #2F94BA;
}
.acrecpost-label:hover{
 background:url(http://lh3.ggpht.com/_xcD4JK_dIjU/S-KAVlLiuVI/AAAAAAAAEBU/Hd-n_8N7qak/d/bg2.gif) repeat-x scroll 0 0 #E1F4FB;
 color:#003366;
}
#acrecpost{
 overflow:hidden;
 line-height:1.3em;
 margin:1px 3px !important;
 padding:2px !important;
 border:1px solid #339DC6;
 background-color:#FFF;
}
#acrecpost li{
 height:65px;
 padding:5px;
 list-style:none;
}
#acrecpost .news-title{
 display:block;
 font-weight:bold;
 margin-bottom:4px;
 font-size:11px;
}
#acrecpost .news-text{
 display:block;
 text-align:justify;
 padding:0 5px 0 70px;
}
#acrecpost a{
 text-decoration:none !important;
 color:#FF0000;
}
#acrecpost img{
 float:left !important;
 margin-right:5px !important;
 padding:4px !important;
 border:solid 1px #339DC6;
 width:55px !important;
 height:55px !important;
}
</style>

Script 2
Kemudian tambahkan kode dibawah ini tepat dibawah kode diatas.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

jika anda sudah pernah
memasang script diatas pada template anda, maka Kode/Script 2 diatas diabaikan saja.

Script 3
Tambahkan kode/script dibawah ini setelah script diatas.

<script type="text/javascript" src="http://daftarisi-girant.googlecode.com/files/accrecpost-pack1.js"></script>
<script style="text/javascript">
var numposts = 10;
var numchars = 200;
</script>

Perhatikan angka 10 dan 200 diatas.
• angka 10 pada var numposts adalah untuk menentukan jumlah artikel yang akan ditampilkan.
• angka 200 pada var numchar adalah untuk menentukan jumlah karakter yang akan ditampilkan.

Script 4
Tambahkan juga script dibawah ini setelah kode/script 3 diatas.

<script src="http://blogger-utilities.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=accrecentpost"></script>

Rubahlah script yg berwarna merah dengan URL blog anda.
Sava gadget dan lihat hasilnya.

</h3>Nb. </h3>
Jika anda ingin menampilkan artikel tertentu berdasarkan category/label di blog anda,
anda cukup mengganti script pada script 4 dengan script dibawah ini :

<script src=" http://blogger-utilities.blogspot.com/feeds/posts/default/-/ Jquery?orderby=published&amp;alt=json-in-script&amp;callback=accrecentpost"></script> 

Script yg berwarna biru adalah script tambahan, gantikan Jquery dengan label yg ada di blog anda.

Terakhir
Preview blog anda.

Selengkapnya→

Memasang Widget Top Commenters Di Blogger

Top Commentators widget adalah salah satu widget yang paling di sukai para pemburu backlink, kenapa, karena otomatis akan membuat nama sang komentator terbanyak disuatu blog atau situs, akan tercantum di sidebar dan otomatis berarti memberikan Link di halaman utama sebuah blog atau situs. Kebayang kalau situs itu memiliki PageRank yang tinggi, dan linknya dofollow, seperti blog saya yang jelek ini.
Menambahkan widget top komentator di blogger

1. Login ke blogger dengan id anda
2. Pilih Tata Letak
3. Silahkan Tambahkan Elemen
4. Pada menu yang tersedia, pilih tambahkan HTML/JavaScript
5. Copy dan paste kode berikut di dalamnya :

<script type='text/javascript'>
function pipeCallback(obj) {
document.write('');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
if(obj.value.items[i].link == "")
var item ="<li>" + obj.value.items[i].title + "<br />";
else
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> <br />";
document.write(item);
}
document.write('<br />');
}
</script>
<script type="text/javascript" src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=31f03b26b13cc52ee46575b89095299a&url=http%3A%2F%2F<b>blogmu</b>.blogspot.com&num=<b>10</b>&filter= "></script>

CATATAN :
blogmu.blogspot.com :Ganti dengan nama blog anda.
8 = Jumlah komentator yang akan ditampilkan.

6. Kemudian klik tombol Simpan
7. Selesai

Selengkapnya→

Awas Virus Facebook Terbaru

Setidaknya ada dua virus yang mengancam pengguna Facebook di Indonesia. Pengguna disarankan hati-hati, karena serangan virus dengan modus operandi mengeksploitasi Facebok akan makin marak di masa datang.

Perusahaan antivirus Vaksincom mencermati, saat ini setidaknya ada dua virus yang mengancam pengguna Facebook. Virus itu bukan menyebar di Facebook, tapi memanfaatkan jejaring sosial popular itu untuk menjaring korban dan bertujuan mendapatkan akun FB.

“Menurut hemat kami, di tahun ini serangan virus dengan modus operandi mengeksploitasi FB akan makin marak seiring makin populernya FB,” kata CEO Vaksincom Alfons Tanuwijaya, di Jakarta.

Ia menambahkan di dunia virus berlaku hukum pembuat virus akan mengincar sistem operasi atau aplikasi yang paling popular. Hal itu karena korban potensialnya lebih besar.

Oleh karena itu komputer dengan sistem operasi Microsoft Windows lebih menarik dibuat virusnya dibandingkan Mac OS Leopard atau Linux, karena penggunannya paling banyak. Sementara sistem operasi Windows Mobile atau BlackBerry lebih sedikit mendapat serangan, karena secara de facto market ponsel masih dikuasai oleh sistem operasi Symbian.

“Saat ini dua virus yang cukup berbahaya dalam mengeksploitasi FB adalah Bredolab dan Zbot,” kata Alfons.

Bredolab merupakan virus lama yang menyebarkan diri sebagai lampiran e-mail. Sebelumnya, virus ini seolah-olah datang dari DHL. Jika dijalankan, maka virus akan menyebabkan komputer terinfeksi.

Memanfaatkan Facebook yang popular, pembuat virus mengubah e-mail seakan-akan dari administrator Facebook. Pembuat virus meminta password reset Facebook dan menjalankan satu aplikasi yang isinya program berbahaya.

“Jika aplikasi itu dijalankan, maka korbannya akan dibuat pusing tujuh keliling. Selain menginfeksi komputer korbannya, virus juga akan meng-download spyware, scareware berupa antivirus palsu, dan menginfeksi lagi komputer korbannya,” kata Alfons.

Tidak cukup melakukan hal ini, Bredolab juga akan melakukan spam dari komputer korbannya. Akibatnya IP address komputer korban bisa diblok oleh perusahaan blacklist, karena mengirimkan spam dan mengganggu pengiriman e-mail.

Sedangkan cara penginfeksian virus Zbot lebih canggih. Virus ini tidak mengirimkan diri sebagai lampiran e-mail seperti Bredolab, yang bisa diblok oleh mailserver.

Virus itu menyebar melalui email phishing, seakan-akan pesan resmi dari Facebook untuk mengubah password. Jika link tersebut diklik, maka ia akan menampilkan situs palsu Facebook yang meminta korbannya memasukkan username dan password.

Jika dituruti maka username dan password pengguna Facebook akan diketahui oleh pembuat virus. Tidak cukup mencuri password Facebook korbannya, virus ini juga akan memberikan link ke file untuk diunduh yang dikatakan sebagai file update dari Facebook. Jika dijalankan, maka virus akan menginfeksi komputer korbannya dan mengakibatkan komputer itu mengirimkan spam.

Lalu bahaya terbesar apa yang bisa dialami user?

Alfons mengatakan tingkat bahaya tergantung dari korbannya. Korban bisa kehilangan akun Facebook dan jika ada nilai ekonomis di akun itu, misalnya data rahasia rekening perbankan maka akan bisa berpindah tangan.

“Selain itu yang perlu dikhawatirkan adalah bahaya jaringan komputer kantor yang menjadi korban virus ini. Jika komputer mengirimkan spam, maka IP kantor akan di-blacklist sehingga tidak akan bisa mengirimkan email dengan baik, dan seluruh email kantor tersebut akan masuk ke dalam kategori spam. Potensi kerugian ekonominya sangat besar,” ujar Alfons.

Untuk menghindari virus di Facebook, Alfons mengatakan pengguna komputer harus menggunakan program antivirus yang ter-update. Selain itu ia menyarankan pengguna komputer selalu waspada terhadap pemalsuan situs atau webforging.

“Jangan mudah percaya link yang diberikan. Khususnya pada saat memasukkan data penting seperti username dan password, sebaiknya perhatikan situs yang dikunjungi dengan seksama,” timpalnya.

Sumber : trickfacebook.com

Selengkapnya→

Membuat Visitor Counter di Blogger

Membuat penghitung pengunjung merupakan hal biasa yang di tampilkan di banyak website, dan sebenarnya caranya sangatlah mudah karena banyak layanan gratisan yang menyediakan fasilitas itu.
Apa itu Web Counter atau automatic visitor counter?
Web counter adalah Aplikasi tambahan pada web atau blog yang berfungsi sebagai penghitung pengunjung yang mengunjungi blog kita. cara kerja counter ini bermacam-macam, mulai dari menghitung page View sampai unique Visitor.
Nah jika kamu sudah tau maksud saya dan berminat untuk membuatnya di blog atau

Website kamu silahkan ikuti langkah-langkah dibawah ini:
Buka website www.wowcounters.net
Kemudian Klik Link ** Click Here to Sign Up for your Free Counter ** yang ada di Website tersebut

Kemudian Isi Form sesuai data diri anda dan pilih sebuah Style kemudian Sign Up
Kemudian Copy Code HTMLnya Dan taruh di Blog kamu, dengan cara ke menu Layout --> Page elements kemudian Add a page elements terus pilih HTML/Java Script
Cukup mudah bukan? jika anda ingin mencoba menggunakan web lainya karena www.wowcounters.net dirasa kurang menarik dalam hal grafis tampilan penghitung otomatis, silahkan kunjungi beberapa alamat web dibawah ini:

Situs yang menyediakan Counter dan Statistik Blog:
http://www.easycounter.com/
http://sitemeter.com/
http://blogaja.com/
http://hitstats.com/
http://oggix.com/
Met Mencoba,,

Selengkapnya→

Cara Membuat Related Post Dengan Efek Scroll

Halo sobat, bertemu lagi di Yordan-Black kali ini saya akan menjelaskan bagaimana cara memasang artikel berkaitan / Related Post Dengan Fungsi Scrolling

Berikut langkah-langkahnya :

Tentu saja harus Login ke Blogger
Klik Tata Letak
Klik tab Edit HTML
Klik tulisan Download Template Lengkap.
Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula
Beri tanda centang pada kotak di samping tulisan Expand Template Widget .

Kemudian cari kode <data:post.body/>

untuk mempermudah pencarian tekan Ctrl + F atau (F3) di keboard sobat
Jika sudah ketemu silahkan Copy kode berikut dan letakkan dibawahnya
Kalau ada dua kode pilih yang pertama

</b:if>
<h2>
ARTIKEL BERKAITAN </h2>
<div class="rbbox">
<div style="border: 1px solid rgb(204, 204, 204); height: 200px; margin: 0pt; overflow: auto; padding: 10px;">
<div id="albri">
<script type="text/javascript">
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 10;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;albri&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script></div>
<script type="text/javascript">
RelPost();
</script></div>

Untuk menambahkan efek srollingnya cari kode ]]></b:skin> dan letakkan kode berikut diatasnya

.rbbox{border: 1px solid #87CEEB; padding: 5px; background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: #ffffff; border: 1px solid #ff6100;}

CATATAN:

Pada Tulisan ARTIKEL BERKAITAN anda bisa memngganti dengan yang anda inginkan untuk judulnya.

Selengkapnya→

Mengganti tampilan kotak komentar

Merasa bosan dengan fasilitas komentar di blogger yang kaku itu, anda dapat menggantinya dengan menggunakan fasilitas komentar atau diskusi di 2 tempat berikut:

1. DISQUS

Plug dalam sistem komentar DISQUS dan mengeluarkan diskusi terbaik di situs Anda.

 demo :
 

2. JS-Kit
Persiapan Instalasi JS-Kit Komentar di situs Anda adalah semudah 1-2-3
 

Demo:

Met mencoba ya

Selengkapnya→

Chatting Dengan Admin

Selengkapnya→