Cara Membuat Effect Loading/Loader pada Blog, Saat Masuk Pada Blog Dengan Code Jequery Trik Blogging Mempercantik Blog

Cara Membuat Effect Loading/Loader pada Blog, Saat Masuk Pada Blog Dengan Code Jequery Trik Blogging Mempercantik Blog

Hello para web designer, kini kami postkan trik terbaru kami agar blog anda jauh lebih indah dan menarik dari sebelumnya.
Kini kami coba membuat suatu Loader pada Blog/web, tapi saya tetap sulit menggabungkan CSS dan Jquery dengan tepat.
Kemudian saya coba Tanya Mbah Google, kemudian kami temukan script yang tepat digabungkan dengan script kami.
Script animasi loading page ini saya dapat dari http://www.gayadesign.com yang merupakan versi awal dari script tersebut. Untuk membuat dan memasang animasi loading page pada blog kalian, masuk pada Design - Edir HTML dan cari kode ]]></b:skin> dan letakan kode dibawah ini diatas ]]></b:skin>

Okee….
Coba ikuti langkah berikut.
1.  Login Blogger.
2. Kemudian Rancangan => Edit HTML
3. Kemudian cari code ]]></b:skin> , untuk lebih cepat tekan CTRL+F pada keyboard.
4. Copy code Jquery dibawah ini.
/* ---------------
jquery animation loading page
---------------------------------- */
.QOverlay {
background-color: #000000; /* background color loading */
z-index: 9999;
}
.QLoader {
background-color: #CCCCCC; /* color bar loading */
height: 10px;
}
.QAmt {
color:#FF530D; /*loading Color number*/
font-size:50px;
font-weight:bold;
line-height:50px;
height:50px;
width:100px;
margin:-60px 0 0 -50px;
}

5. Pastekan diatas code ]]></b:skin>
6. Kemudian cari code </head> , gunakan cara cepat seperti tadi.
7. Copy code dibawah ini
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://situseo.googlecode.com/files/loadpage.js' type='text/javascript'/>

8. Pastekan code tersebut diatas code </head>

Perhatian-!!!!
untuk kode yang diberi warna merah, jika kode tersebut sudah ada dalam template kalian, kalian tidak perlu menambahkan kode tersebut (cukup 1 saja)

9. Kemudian cari code </body>, gunakan cara cepat seperti tadi.
10. Copy code dibawah ini
<script>
QueryLoader.selectorPreload = &quot;body&quot;;
QueryLoader.init();
</script>

11. Pastekan code tersebut diatas code </body>

Save template kalian dan coba buka blog kalain untuk mengetestnya
Hanya seperti itu yang dapat kami berikan untuk entri kali ini.
Kurang jelas, atau lebih jelas silahkan berkomentar kami akan segera merespon.
Salam Web Designer

(Artikel Dilindungi)
Sertakan alamat blog ini jika mengcopy paste.
Hak Cipta Dilindungi

Terima Kasih
Rafi Orilya Groups
by Rafi Aldiansyah Asikin

13 komentar

  1. Yoho.... masama gan.
    Kami tunggu kunjungan baliknya.

    BalasHapus
  2. waww keren gan ... teruma kasih ya gan. atas petunjuk nya..

    amikboekittinggi.blogspot.com

    BalasHapus
  3. Thank's gan... Yoo, gan.. masama :)
    Sepzz...
    udah mampir, ditunggu kunjungan baliknya.
    :)

    BalasHapus
  4. Yogan, masama....
    Okee-okee. chapcus, MELUNCUUURRR...
    Ditunggu kunjungan baliknya, broo..

    BalasHapus
  5. Tutorialnya mantap gan ...

    Kunjungi blog saya juga yah http://blogzeng.blogspot.com/
    Thank's

    BalasHapus
  6. Yupzz... gan :)
    thank's kunjungannya...

    BalasHapus
  7. ryntales & tri ana : iyah sama-sama.. :)

    BalasHapus
  8. Blog yang bagus...
    Kunjungi dan follow blog saya yah..
    saya newby kakak..
    http://rodelaide.blogspot.com/

    BalasHapus
  9. thank's sob.. :)sipp sob... sy mlncur..

    BalasHapus
  10. Informasinya bagus mas, banyak sekali tentang tutorial blognya jadi enak untuk dibaca. Kapan-kapan saya coba nih :)

    BalasHapus

Komentar anda sangat dibutuhkan bagi kemajuan kami untuk terus berkarya.
Diharapkan :
* Berkomentarlah dengan bahasa yang baik
* Tidak ada unsur SARA, SPAM, PORNO
* Tidak merugikan orang lain
* Menunjukkan identitas yang jelas bukan Anonim

Diperkenankan :
* Komentar promosi link web anda
* Kritik & Saran

[Protected] by DMCA Protection Pro™
EmoticonEmoticon