Membuat Blogroll Bergerak Paling Keren

Alhamdulillah bisa posting lagi nih , setelah barusan di daerah sini listriknya mati sekitar 2 jam dan akhirnya nyala juga deh listriknya , alhamdulillah. Saya pada kesempatan sebelumnya pernah membahas sebuah artikel yang berjudul Membuat Widget Subscribe Paling Keren yang gunanya supaya pengunjung bisa mengikuti blog kita dan juga akan mendapat informasi bila kita membuat postingan. dan kesempatan sebelumnya saya juga pernah membahas masalah template yaitu Template Mirip Terselubung Paling Keren.

 

 Balik ke topik sob , Fungsi Blogroll ini sendiri untuk blog yaitu untuk mencantumkan link-link teman atau kawan. Tapi keistimewaan tutorial ini yaitu Blogroll yang kita buat bisa bergerak sob , mau liat contohnya gak sob ??? ,berikut ini contoh blogrollnya sob :



Sobat ingin membuat  Blogroll Bergerak Paling Keren seperti diatas ???
kalau sobat ingin , silahkan ikuti tutorialnya berikut ini , mudah kok sob santai aja.

1. Login ke blogger sobat
2. Klik Template > Edit HTML
3. Masukan kode berikut diatas kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js' type='text/javascript'/><script type='text/javascript'>
var $ul = $('#blog-roll'),
    roll = function() {
        $ul.find('li').first().slideUp('slow', function() {
            $(this).appendTo($(this).parent()).fadeIn();
        });
    },
    anim = setInterval(roll, 3000);
// Pause on hover...
$ul.hover(function() {
    clearInterval(anim);
}, function() {
    setInterval(roll, 3000);
});
</script>

   4. Klik Simpan Template
   5. Letakan kode berikut di tata letak maupun postingan , ya pokoknya yang sobat sukai :

<ul id="blog-roll">         
<li><a href="#">Planet Ajaib 1</a></li>
<li><a href="#">Planet Ajaib 21</a></li>
<li><a href="#">Planet Ajaib 3</a></li>
<li><a href="#">Planet Ajaib 4</a></li>
<li><a href="#">Planet Ajaib 5</a></li>
<li><a href="#">Planet Ajaib 6</a></li>
<li><a href="#">Planet Ajaib 7</a></li>
<li><a href="#">Planet Ajaib 8</a></li>
<li><a href="#">Planet Ajaib 9</a></li>
<li><a href="#">Planet Ajaib 10</a></li>
<li><a href="#">Planet Ajaib 11</a></li>
<li><a href="#">Planet Ajaib 12</a></li>
<li><a href="#">Planet Ajaib 13</a></li>
<li><a href="#">Planet Ajaib 14</a></li>
<li><a href="#">Planet Ajaib 15</a></li>
</ul>

Gantilah tanda pagar (#) dengan link-link teman atau kawan , dan Planet Ajaib 1-15 dengan judul
Mudah kan sobat ????? pastinya dong .....

Demikianlah kali ini postingan saya tentang Membuat Blogroll Bergerak Paling Keren , Semoga dapat berguna dan bermanfaat bagi sobat semua . Dan seperti biasanya bila ada tutur kata atau ucapan saya yang kurang berkenan mohon dimaafkan , dan bila ada pertanyaan silahkan berkomentar dibawah , Wassalamualaikum.