Warna Latar Otomatis Berbeda Pada Setiap Postingan

Dulu saya tidak begitu tertarik untuk merubah warna Background disetiap halaman posting, selain kesannya aneh..mungkin juga terkesan rada Ndeso (kata orang jawa) hehehe Tapi itu dulu ya, selera tentu bisa berubah juga khan, ini tidak lain karena saya lagi senang ngedit template dengan tampilan nyerempet bergaya style Windows 8 ala Metro UI yang lebih berwarna-warni namun tidak sedikitpun menghilangkan kesan elegan pada tampilannya.

Nah dari Style Windows 8 itulah saya mulai tertarik dan mencoba sekaligus ngajarin gimana caranya agar warna postingan blog kalian bisa berubah warna secara otomatis tanpa harus menggunakan banyak koding CSS apalagi  harus menggunakan Conditional Tag yang bikin pusing kepala aja.

Contoh Tampilannya seperti dibawah ini sobat :

Langsung aja ya dan caranya sangat mudah sekali...silahkan cari kode </head> kemudian letakan kode Javascript dibawah ini tepat diatas kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js?ver=1.5' type='text/javascript'/> <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>

Jika kalian hanya ingin merubah warna posting pada halaman utama saja kalian tinggal gunakan saja conditional tag seperti kode dibawah ini:

<b:if cond='data:blog.url == data:blog.homepageUrl'> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js?ver=1.5' type='text/javascript'/> <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>

Menurut saya tampilan warna berbeda pada latar setiap posting mungkin lebih cocok hanya untuk Template dengan Style Gallery, kalau untuk Template biasa mungkin terlihat gimana gitu... namun tidak ada salahnya juga kalau ingin mencobanya. Bila kalian lebih jeli dan memiliki kemampuan Programming Javascript yang handal tentu bisa mengeditnya lebih bagus lagi sesuai kebutuhan.

Selamat Mencoba. jika masih bingung silahkan tinggalkan komentar sobat.