Senin, 01 September 2014

Animasi Untuk Blog Anda

20.24    No comments
Oy oy oy sobat Top.Pada posting kali ini saya akan  membeberkan sebuah panduan.Panduannya adalah cara menambahkan animasi pada blog anda.Tidak hanya itu saya juga akan membagi beberapa animasi mulai dari yang keren sampai yang lucu \(^,^)/.Oke tidak perlu banyak cingcong lagi ya.Langsung cekidot...!!!

 Yang perlu disiapkan :
  1. Laptop / PC
  2. Koneksi internet
  3. Blog (harus milik sendiri)
  4. Mental yang kuat karena ditakutkan akan pingsan saat melihat perubahan pada blog sendiri :D
Langkah - Langkah :
  1. Copy kode animasi yang anda inginkan untuk dipasang di blog anda.Kodenya akan saya berikan dibawah.
  2. Login ke blog anda.
  3. Klik nama Blog yang akan anda beri animasi.
  4. Pilih Tata Letak,kemudian klik Tambahkan Gadget,akan muncul tampilan seperti berikut ini        
  5. Pada "Dasar - dasar" gulirkan scroll kebawah sampai anda menemukan  "HTML/JavaScript".Klik simbol "+"
  6. Kemudian anda tinggal mem-paste kode yang telah anda copy sebelumnya pada kotak "Konten",untuk "Judul" bisa diisi bisa juga dikosongi.Setelah siap klik simpan.
Berikut beberapa animasi dari saya,silahkan copykode animasi yang anda inginkan :

 1. Pisang Joget
       
<div style="position: fixed; bottom: 0px; left: 20px;width:82px;height:160px;"><a href="http://content.sweetim.com/sim/cpie/emoticons/0002013F.gif" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002013F.gif" alt="animasi blog" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">Animasi Blog</a></center></small></div>

2. Kelinci     


 
<div style="position: fixed; bottom: 0px; left: 10px;width:125px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img alt="animasi blog" src="http://content.sweetim.com/sim/cpie/emoticons/000203A0.gif" title="Click to get more." /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">Animasi Blog</a></center></small></div>

3. Gajah
     


<div style="position: fixed; bottom: 0px; left: 20px;width:120px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203BC.gif" title="Click to get more." /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">Widget-Animasi</a></center></small></div>
4. Pinguin
   
 <div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:130px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020484.gif" title="Click to get more." /></a><small><center><ahref="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">Widget Animasi</a></center></small></div> 

 5. Kucing
   

<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:140px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203C0.gif" title="Click to get more." /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">Widget Animasi</a></center></small></div>
6. Ikan
   

<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:130px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020479.gif" title="Click to get more." /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">Widget Animasi</a></center></small></div>

 7. Lumba-lumba
   
<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203BA.gif" title="Click to get more." /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">Widget Animasi</a></center></small></div>

8. Anjing Laut
   

<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203B5.gif" title="Click to get more." /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">Widget Animasi</a></center></small></div>

9. Ayam Bertelur
   
<div style="position: fixed; bottom: 0px; left: 10px;width:125px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img alt="animasi blog" src="http://content.sweetim.com/sim/cpie/emoticons/00020541.gif" title="Click to get more." /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">Animasi Blog</a></center></small></div>

10. Lebah
   
<div style="position: fixed; bottom: 0px; left: 10px;width:125px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img alt="animasi blog" src="http://content.sweetim.com/sim/cpie/emoticons/0002048F.gif" title="Click to get more." /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">Animasi Blog</a></center></small></div>

11. Spongebob Mengantuk
   
<a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" style="bottom: 5px; display: scroll; left: 5px; position: fixed;" title="Want more... Click it."><img src="http://i1242.photobucket.com/albums/gg532/faizkr8/bob.gif" /></a>
12. Spongebob Lari
   
<a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" style="bottom: 5px; display: scroll; left: 5px; position: fixed;" title="Want more... Click it."><img src="http://i1242.photobucket.com/albums/gg532/faizkr8/boblari.gif" /></a>
13. Ubur-ubur
   
<a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" style="bottom: 5px; display: scroll; left: 5px; position: fixed;" title="Want more... Click it."><img src="http://i1242.photobucket.com/albums/gg532/faizkr8/ubur2.gif" /></a>

14. Doraemon Hulahop
   

 <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/1031/th/103123.gif" title="My widget" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>
15. Spiderman Joget
   
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/3/th/312.gif" title="My widget" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>
16. Kembang Api
 

     
<a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" style="bottom: 5px; display: scroll; left: 5px; position: fixed;" title="Want more... Click it."><img src="http://i1242.photobucket.com/albums/gg532/faizkr8/Fire.gif" /></a>
17. Petir
   
<a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" style="bottom: 5px; display: scroll; left: 5px; position: fixed;" title="Want more... Click it."><img src="http://i1242.photobucket.com/albums/gg532/faizkr8/Cloudelec.gif" /></a>
18. Naruto
   

<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/692/th/69207.gif" title="My widget" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">My Widget</a></center></small></div>

19. Gaara

   


<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/539/th/53973.gif" title="My widget" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">My Widget</a></center></small></div>

20. Zombie
   


<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/466/th/46602.gif" title="More Animation" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">More Animation</a></center></small></div>

21. Skeleton 
   

<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://bestanimations.com/Humans/Skeletons/animatedskeleton-1.gif" title="More Animation" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">More Animation</a></center></small></div>

22. Kamera CCTV

   
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNDGGHz7M4FecnFW12lVKRzUaAWFcNTDJcB3yg-nrNq7uaauM7_oWxLwB1upNXnOZSPOTJiv3DFdntPdEQjhbImzgaz2APe40RJoMc8Rir_4AN0HId1dD_1-JMzItWtl2GMYJGzLWKYGU/s1600/cctv.gif" title="My widget" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">My Widget</a></center></small></div>

23. Sinchan

   
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7tBuXIb77hhxS6zQzgXgAQzHu6IixEKpMnL7zRkPwWPy40Gc0a2RbV4_RcFj2F5o1jJNIkmCv9IrmxelfnQGA9TlETIh9QZr6U8xCCVGhvW7PUmu41OskInO5Q8STxJtzP6PgsL8uClCk/s1600/animasi-1.gif" title="More Animation" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">More Animation</a></center></small></div>

24. Motor 1
 
   

<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://www.amazing-animations.com/animations/motorcycle17.gif" title="More Animation" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.htmll" target="_blank">More Animation</a></center></small></div>

25. Motor 2

   

<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.htmll" target="_blank"><img border="0" src="http://www.amazing-animations.com/animations/motorcycle22.gif" title="More Animation" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">More Animation</a></center></small></div>

26. Motor 3
 
   

<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://www.amazing-animations.com/animations/motorcycle12.gif" title="More Animation" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">More Animation</a></center></small></div>

27. Motor 4

   

<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://www.amazing-animations.com/animations/motorcycle9.gif" title="More Animation" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">Animasiku</a></center></small></div>

 28. Rider Pig

   

<div style="position: fixed; bottom: 0px; left: 10px;width:160px;height:120px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="http://www.amazing-animations.com/animations/motorcycles13.gif" title="More Animation" alt=http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">More Animation</a></center></small></div>

29. Hamtaro berjalan
 
   

<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:100px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTP9sE5cIP0wOO-nnHuwFZltoL5wWVEpuuJTlwj9NCEY4q2YoYF0XTupsbGW__B8W9RQ14LCUD2FvcYeSQ71-0InncpR8_P0ynkZw5a2pDAnQpYLdmhu6zkT0O6q7BDHDKilu7SijIDVaB/s640/hamtaro4.gif" title="My widget" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">My Widget</a></center></small></div>

 30. Hamtaro Gatal
   

 <div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:100px;"><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj40IKWD1MAXzJ3nf3jwj7dJvxJGz3cToEuN2_TGCeevSm8G6hSTUbWyk8xIY95fpKxJ_CcHM4UeBzfjogW-b0mfqu6WJrOjVo66FNr8ifoctpV9GxtHxjdLYUOe2DBvvUt3L345kQGqqjf/s640/tumblr_ldrm15Boh01qacdwy.gif" title="My widget" alt="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" /></a><small><center><a href="http://info-taufiq.blogspot.com/2014/09/animasi-untuk-blog-anda.html" target="_blank">My Widget</a></center></small></div>

Beberapa animasi khusus :
1. Random Ghost Animation untuk blog anda. Klik Disini
2. Green Dragon Animation untuk blog anda. Klik Disini
3. Judul Blog bergerak. Klik Disini

Sekian dulu ya sob artikel Animasi Untuk Blog Anda ini.Jika ada waktu akan saya tambah lagi animasinya.Jangan lupa meninggalkan jejak.Semoga bermanfaat ^^

0 komentar:

Posting Komentar

Langganan: Posting Komentar (Atom)

 
Photobucket