Memasang Animasi Pada Loading Blog

Cara Memasang Animasi Pada Loading Blog,- Pasti kalian pernah melihat custom loading blog kan? Yap, Banyak blog yang Memasang Animasi Pada Loading Blog agar tampilannya terlihat menarik seperti di blog saya yang ini. Oke, kali ini saya akan membagikan Bagaimana memasang animasi pada loading blog. Sebelum memasangnya yang harus kita perhatikan adalah jangan sampai akibat memasang Animasi Pada Blog membuat blog menjadi lambat. Maka yang harus kita perhatikan adalah ukuran animasi jangan sampai terlalu besar. Kalau bisa sebelum memasang kita harus mengkompres gambarnya agar ukurannya menjadi lebih kecil. Bagimana? anda tertarik untuk memasang animasi loading blog di blog anda agar lebih terlihat keren dan elegen? Kalau anda tertarik silahkan simak postingan berikut ini.

Cara Memasang Animasi Pada Loading Blog

 

Dalam postingan saya yang berjudul Cara Memasang Animasi Pada Loading Blog ini, pertama sekali anda harus memilih dan mencari animasi loading untuk blog anda, saran saya pilihlah animasi yang tidak terlalu berat, jika ukurannya besar silahkan di kompres dahulu. Berikut tutorial atau cara caranya.

1. Pada dashboard, Masuk ke menu Template lalu Edit HTML,
2. Lalu cari ]]</b:skin> dengan menekan Ctrl+F, lalu letakkan code di bawah ini diatasnya,
   

   /* Loading Page */
   #page-loader{position:fixed!important;position:absolute;top:0;right:0;bottom:0;left:0;z-index:999999;background:#fff url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh00YlGNEQ4vtggSCHecQPkHAWgYwXgX5G_9PoVyF7rsunx8KseecW99w8WbRn2C8myNN-rasQIUVjdeERBIjDIVkXLgQK5Hr5qiy_Z7AP2E7OvmcDv_9pUbuX_3FKSrUlhqSc3o43BWDMs/s128-no/loading.GIF') no-repeat 50% 50%;padding:1em 1.2em;display:none}

3. Setelah itu, cari </body> setelah itu letakkan kode di bawah ini diatasnya,
   

   <script type='text/javascript'>
   //<![CDATA[
   $(document.body).append('<div id="page-loader"></div>');
   $(window).on("beforeunload", function() {
   $('#page-loader').fadeIn(1000).delay(9000).fadeOut(1000);
   });
   //]]>
   </script> 

4. Setelah itu simpan.

Catatan :
ubah kode yang berwarna biru dengan link animasi yang akan dipasang.

Itulah Postingan Cara Memasang Animasi Pada Loading Blog. Semoga anda dapat berhasil memasangnya. Ingat! Jangan memakai animasi yang ukuran filenya berat karena dapat membuat loading blog menjadi lama. Jika ada kesalahan dalam script mohon di komentar.

Bagikan Artikel ini