Latar Post Otomatis Berwarna warni yaitu warna latar secara otomatis dan acak pada postingan bukan latar belakang layar secara keseluruhan blog.
Kali ini masih diseputar label Toturial Blog seperti postingan kemaren
SCROLLBAR EFEK LEMBUT
Memang biasanya blog yang berwarna warna terkadang memberi kesan norak namun semenjak kehadiran window 8 gaya Metro UI, malah sepertinya menjadi terkesan menarik.
Untuk Demo mungkin blog ini sendiri atau silakan lihat blog
JonQuickly
Baiklah langsung saja, Cara Membuat Latar Post Otomatis Berwarna warni :
Buka edit template silahkan cari kode
</head> letakkan kode berikut diatasnya:
<script type='text/javascript'>
//<![CDATA[
function get_random_color() {
var letters = '0123456789ABCDEF'.split('');
var color = '#';
for (var i = 0; i < 6; i++ ) {
color += letters[Math.round(Math.random() * 14)];
}
return color;
}
$(function() {
$(".post").each(function() {
$(this).css("background-color", get_random_color());
});
});
//]]>
</script>
Silakan dilihat hasilnya:
jika tidak berfungsi maka tambahkan kode jquery sembarang aza versinya yang penting ada
Atau tambahkan Code Jquery dibawah ini :
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'/>
Silakan lihat hasilnya kembali.
Kemudian Jika ingin Tampilan berwarna-warninya hanya dibagian home maka cukup tambahkan tag kondisional diatasnya,
Silakan anda coba kode berikut ganti code sebelumnya tadi agar fungsi ala pelangingnya hanya pada halaman home saja:
Copy paste Code berikut:
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<script type='text/javascript'>
//<![CDATA[
function get_random_color() {
var letters = '0123456789ABCDEF'.split('');
var color = '#';
for (var i = 0; i < 6; i++ ) {
color += letters[Math.round(Math.random() * 14)];
}
return color;
}
$(function() {
$(".post").each(function() {
$(this).css("background-color", get_random_color());
});
});
//]]>
</script>
</b:if>
Selesai.
Selamat mencoba Latar Post Otomatis Berwarna warni