Cara Menampilkan Loading di Blog paling Simple!

Assallamu'allaikum sobat blogger yang sering mampir kemari, mohon maaf nih sebelumnya saya jarang update postingan tutorial blog! akan t...

Assallamu'allaikum sobat blogger yang sering mampir kemari, mohon maaf nih sebelumnya saya jarang update postingan tutorial blog! akan tetapi kali ini saya ingin berbagi sedikit bumbu css dan jquery untuk sahabat yang ingin membuat loading di blog dengan mudah, cukup copy & paste pada tutorial berikut :

Tutorial Blogger

Langkah-langkah Pembuatan Loading di blog :

Langkah-1 : Login Blogger, Klik menu Template > Edit HTML

Langkah-2 : Simpan kode external jQuery library di bawah ini, tepat sebelum tag </head> :
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
Kode jQuery library hanya bisa di pasang 1x saja, jika sobat sudah memasang kode jQuery library lewati langkah ini, karena akan mengakibatkan konflik / semua kode jQuery tidak akan berfungsi.

Langkah-3 : Copy kode CSS di bawah ini, setelah itu paste tepat sebelum tag </head> :
<style>/* LOADING HALAMAN */#loadingHalaman {background:url(https://lh5.googleusercontent.com/-FjPBmaz4eZ0/VHPOQKFFodI/AAAAAAAAGA4/A64qYQ7YaMs/s1600/dark-loading.gif) no-repeat center;background-color:rgba(0, 0, 0, 0.32);width:100%;height:100%;position: fixed; left: 0px; top:0px; z-index: +100000;}</style>
Langkah-4 : Copy kode HTML di bawah ini, setelah itu paste tepat setelah tag <body> :
<div id="loadingHalaman"></div>
Langkah-5 : Setelah itu simpan kode jQuery di bawah ini tepat sebelum tag </body> :
<script>//<![CDATA[//Loading Halaman$(window).bind("load", function() { $('#loadingHalaman').slideUp(1000);});//]]></script>
Selesai!

Untuk demonstrasi bisa sobat lihat pada halaman blog ini, klik pada setiap artikel dalam blog ini untuk melihat tampilan demo nya! :)

Semoga artikel tentang Cara Menampilkan Loading di Blog paling Simple! yang saya buat ini bermanfaat bagi semua blogger yang membutuhkan!

Salam Blogger,

COMMENTS

Name

Aceh,23,Adsense,8,BBM,3,Biography,1,Bitcoin,4,Blog,21,Blogger,12,Blogging,55,Business,14,Cerita,3,CPNS,1,Delicious,1,Design,1,DeviantART,1,Digg,1,Dollar,3,Dunia,13,Facebook,5,Flickr,1,Friendster,1,Gambar,2,Game,34,Gmail,1,Google+,4,Hosting,1,Inspirasi,2,Instagram,1,Internet,13,Interview,11,Kesehatan,2,LinkedIn,1,Makalah,7,Marketing,12,Meme,8,Money,3,Motivasi,2,MySpace,1,Outlook,1,Path,1,Pendidikan,10,Pengetahuan,4,Pinterest,1,Plugin,5,PNS,1,Reddit,1,Review,4,Seo,53,Smartphone,5,Social Media,38,Sukses,3,Sumatera Barat,16,Sumatera Utara,3,Templates,1,Tips,6,Toko Online,3,Top10,18,Tumblr,1,Tutorial,29,Tutorial Blog,146,Twitter,3,Umum,9,Vimeo,1,VK,1,Weebly,1,WhatsApp,1,Widget,55,Wisata,4,WordPress,14,Yahoo,1,Youtube,3,
ltr
item
Mas Da Bang: Cara Menampilkan Loading di Blog paling Simple!
Cara Menampilkan Loading di Blog paling Simple!
https://3.bp.blogspot.com/-zfgnG9g66d4/Wkp7yZBisxI/AAAAAAAANjA/aXqbVFFDTbcCA5WOsSeGUo8ri7YJxCzdACLcBGAs/s1600/Widget-Header.png
https://3.bp.blogspot.com/-zfgnG9g66d4/Wkp7yZBisxI/AAAAAAAANjA/aXqbVFFDTbcCA5WOsSeGUo8ri7YJxCzdACLcBGAs/s72-c/Widget-Header.png
Mas Da Bang
https://blog.itapuih.com/2018/11/cara-menampilkan-loading-di-blog-paling.html
https://blog.itapuih.com/
https://blog.itapuih.com/
https://blog.itapuih.com/2018/11/cara-menampilkan-loading-di-blog-paling.html
true
2732475762120586724
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS PREMIUM CONTENT IS LOCKED STEP 1: Share. STEP 2: Click the link you shared to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy