Cara Menambahkan Gambar Secara Random, Rotating untuk Header Blogger

Dalam tutorial ini saya akan menjelaskan bagaimana menambahkan gambar acak /atau memutar  untuk background. 

Langkah-langkahnya :

1.Masuk ke blog dashboard --> Design--> Edit HTML
2. Cari tag atau kode .
3. Sekarang salin kode di bawah ini dan paste tepat setelah tag atau kode .

<script type='text/javascript'>

var HeaderImage= new Array()

HeaderImage[0]=&quot;URL-OF-HEADER-IMAGE-1&quot;
HeaderImage[1]=&quot;URL-OF-HEADER-IMAGE-2&quot;
HeaderImage[2]=&quot;URL-OF-HEADER-IMAGE-3&quot;
HeaderImage[3]=&quot;URL-OF-HEADER-IMAGE-4&quot;
HeaderImage[4]=&quot;URL-OF-HEADER-IMAGE-5&quot;
var random=Math.round(4*Math.random());

document.write(&quot;<style>&quot;);
document.write(&quot;#header-wrapper {&quot;);
document.write(&#39; background:url(&quot;&#39; + HeaderImage[random] + &#39;&quot;) no-repeat left TOP;&#39;);
document.write(&quot; }&quot;);
document.write(&quot;</style>&quot;);

</script>

CATATAN:

Ganti "URL-OF-HEADER-IMAGE-X" dengan URL gambar Anda.

Jika kode diatas tidak bekerja untuk blog Anda, kemudian ganti "# header-wrapper" dengan "# header". (ID atau Class bagian header Anda).

Anda dapat menambahkan jumlah yang berbeda gambar dari 5. tapi ingat untuk mengubah "4 * Math.random ()" sesuai dengan jumlah gambar yang Anda masukan. Misalnya, bila Anda ingin menambahkan 8 gambar yang berbeda untuk background header blog Anda, kemudian kode harus berubah sebagai "7 * Math.random ()" Lihat contoh di bawah ini.:

<script type='text/javascript'>

var HeaderImage= new Array()

HeaderImage[0]=&quot;URL-OF-HEADER-IMAGE-1&quot;
HeaderImage[1]=&quot;URL-OF-HEADER-IMAGE-2&quot;
HeaderImage[2]=&quot;URL-OF-HEADER-IMAGE-3&quot;
HeaderImage[3]=&quot;URL-OF-HEADER-IMAGE-4&quot;
HeaderImage[4]=&quot;URL-OF-HEADER-IMAGE-5&quot;
HeaderImage[4]=&quot;URL-OF-HEADER-IMAGE-6&quot;
HeaderImage[4]=&quot;URL-OF-HEADER-IMAGE-7&quot;
HeaderImage[4]=&quot;URL-OF-HEADER-IMAGE-8&quot;
var random=Math.round(7*Math.random());

document.write(&quot;<style>&quot;);
document.write(&quot;#header-wrapper {&quot;);
document.write(&#39; background:url(&quot;&#39; + HeaderImage[random] + &#39;&quot;) no-repeat left TOP;&#39;);
document.write(&quot; }&quot;);
document.write(&quot;</style>&quot;);

</script>

Selamat Mencoba   !