Blog Widget Burung Terbang Twitter

Posted in Labels: Blog Code, Tutorial, Widget | Monday, August 8, 2011 [ 2:23 AM ]

Home » Blog Code , Tutorial , Widget » Blog Widget Burung Terbang Twitter

Siapa sich... yang ga kenal sama "twitter" ??? Pada kesempatan kali saya mencoba untuk membuat postingan artikel tentang animasi burung terbang twitter. Buat temen - temen yang lagi suka nge-blog widget ini wajib untuk di pasang di blog-nya. Sedikit me-review tentang twitter supaya bagi - bagi ilmunya ga tanggung - tanggung. Itulah nilai plusnya blog ini ga cuma copy - paste doank....hehehe :) jadi promosi dech....maksud saya dari sekian banyak blog yang ngasih informasi tentang widget rata - rata hampir 90% artikelnya copy - paste doank yang fungsinya cuma buat nyari dollar ama popularitas blognya termasuk saya ...hehehe... setidaknya saya masih punya nilai plus-lah. Ok back to topic.

Seperti yang sudah saya singgung "twitter" kalo dalam bahasa burung berarti berkicau dan apabila burung berkicau biasanya kalo dalam spesies yang sama saling bersahutan. Nah twitter.com mengambil konsep yang sama seperti burung dengan membuat sistem jaringan sosial yang bisa saling berkicauan atau sahut - menyahut secara global melalui internet. Hebat kan... kalo twitter mania sudah mempunyai high rank di dunia jagat maya, sekali twitt bisa dapet jutaan follower dan itu berarti uang...uang...uang koq bisa ??? ya bisa lah itulah mengapa saya bilang mengapa blog ini bernilai plus ++ Lebih lengkapnya silakan follow link ini [klik disini].

Twitter merupakan salah satu situs jejaring sosial yang terkenal diantara para blogger dan netter. Widget untuk twitter ada banyak jenisnya dan kebanyakan dalam bentuk icon dan tombol yang bentuknya statis artinya hanya terpaku pada satu lokasi. Sekarang pada kesempatan kali ini saya mencoba memberikan informasi tentang salah satu widget twitter yang dinamis. Kalo widget ini di pasang di blog nya sobat pasti akan menambah daya tarik pengunjung yang sedang blog surfing di blognya sobat.

Widget ini berbasis plugin javascript yang akan menampilkan animasi burung twitter yang sedang terbang dan hinggap di area yang terlihat di monitor. Ketika cursor pengunjung mengenai burung twitter ini maka akan memunculkan teks "Follow Me" dan menampilkan link ke twitter sobat.

Pada postingan ini saya akan memberikan 2 Opsi penempatan animasi burung twitter yaitu sobat boleh menempatkan pada halaman utama saja atau pada semua halaman. Untuk mengetahui lebih lanjut kode xml tentang penempatan halaman pada blogspot silakan sobat baca artikelnya [klik disini]. Seandainya sobat tertarik dengan widget ini tapi belum mempunyai blog dan sobat belum mengerti tentang cara membuat blog silakan sobat baca artikel cara membuat blog di blogspot [klik disini]. Tuh... lengkap kan ulasannya. Kalo sobat suka dengan postingan artikel di MonozCore silakan sobat bookmark blog ini ataupun mem-follow blog ini biar ga lupa alamatnya dan selalu uptodate bila ada postingan terbaru. Oke sekarang kita langsung aja ke TKP (Tempat Kejadian Postingan)

Menampilkan Widget ini Hanya Pada Halaman Utama Saja

Login ke blog anda.
Klik dashboard > design > edit HTML.
Cari potongan kode xml pada template blog sobat (tekan CTRL + F pada keyboard anda untuk menampilkan kotak pencarian di browser sobat untuk mempercepat pencarian).
```
</body>
```
Copy - Paste kode berikut ini tepat di bawah / di atas kode "</body>".

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<!-- Twitter Bird Widget for Blogger edited by MonozCore -->

<script type='text/javascript' src='http://monozcore-project.googlecode.com/files/tripleflap.js'>

</script>

<script type='text/javascript'>

var birdSprite='http://2.bp.blogspot.com/-8OMXyMFgt_U/Tj6zeqBYXgI/AAAAAAAAAGo/9R5OeUN8Gyc/s1600/birdsprite.png'; var targetElems=new Array('img','hr','table','td','div','input','textarea','button','select','ul','ol','li','h1','h2','h3','h4','p','code','object','a','b','strong','span');

var twitterAccount = &quot;http://twitter.com/TwitterKamu&quot;;

var tweetThisText = &quot; <data:blog.pageTitle/>: <data:blog.url/> &quot;;

tripleflapInit();

</script>

<!-- Twitter Bird Widget for Blogger edited by MonozCore -->

</b:if>

Kode yang berwarna biru berguna untuk pilihan animasi. Apabila sobat ingin mengganti animasi dengan Stickman sobat tinggal mengganti kode yang berwarna biru dengan kode untuk animasi Stickman.
Kode yang berwarna hijau merupakan kode untuk alamat akun twitter sobat. Silakan sobat isi sesuai dengan alamat akun twitter sobat. Caranya : ganti kode yang berwarna hijau dengan twitter.com/sobat yang mana sobat adalah alamat username twitter sobat.
Simpan kemudian lihat hasilnya.

Menampilkan Widget ini Pada Semua Halaman

Login ke blog anda.
Klik dashboard > design > edit HTML.
Cari potongan kode xml pada template blog sobat (tekan CTRL + F pada keyboard anda untuk menampilkan kotak pencarian di browser sobat untuk mempercepat pencarian).
```
</body>
```
Copy - Paste kode berikut ini tepat di bawah / di atas kode "</body>".

<!-- Twitter Bird Widget for Blogger edited by MonozCore -->

<script type='text/javascript' src='http://monozcore-project.googlecode.com/files/tripleflap.js'></script>

<script type='text/javascript'>

var birdSprite='http://2.bp.blogspot.com/-8OMXyMFgt_U/Tj6zeqBYXgI/AAAAAAAAAGo/9R5OeUN8Gyc/s1600/birdsprite.png';

var targetElems=new Array('img','hr','table','td','div','input','textarea','button','select','ul','ol','li','h1','h2','h3','h4','p','code','object','a','b','strong','span');

var twitterAccount = 'http://twitter.com/TwitterKamu';

var tweetThisText = 'Twitter - Twitter kamu https://twitter.com/TwitterKamu/';

tripleflapInit();</script>

<!-- Twitter Bird Widget for Blogger edited by MonozCore -->

Kode yang berwarna biru berguna untuk pilihan animasi. Apabila sobat ingin mengganti animasi dengan Stickman sobat tinggal mengganti kode yang berwarna biru dengan kode untuk animasi Stickman.
Kode yang berwarna hijau merupakan kode untuk alamat akun twitter sobat. Silakan sobat isi sesuai dengan alamat akun twitter sobat. Caranya : ganti kode yang berwarna hijau dengan twitter.com/sobat yang mana sobat adalah alamat username twitter sobat.
Simpan kemudian lihat hasilnya.

Pilihan Animasi

Burung Twitter

Gunakan Kode :
http://2.bp.blogspot.com/-8OMXyMFgt_U/Tj6zeqBYXgI/AAAAAAAAAGo/9R5OeUN8Gyc/s1600/birdsprite.png

Stickman Twitter

Gunakan Kode :
http://3.bp.blogspot.com/-NAKoyko-svs/Tj7Uc2htyvI/AAAAAAAAAGw/jeN3tnVdZfo/s1600/birdsprite_MonozCore_Stickman.png

Star Scream Twitter

Gunakan Kode :
http://3.bp.blogspot.com/-1dG05Y_qH3g/Tkq6eVlW5XI/AAAAAAAAAKY/HNy-cLcFGgc/s1600/StarScream.png

Bat Twitter

Gunakan Kode :
https://lh5.googleusercontent.com/-EnXkKay4ZWE/TlUem7_IG5I/AAAAAAAAAOk/rfRBs4panss/s800/MonozCore.blogspot.com_BatTwitter.png

SantaBird Twitter

Gunakan Kode :
https://lh6.googleusercontent.com/-hWgSLV-IZFE/TlU7h7lt9SI/AAAAAAAAAOw/DsMxhHAdeIU/s800/MonozCore.blogspot.com_SantaBirdTwitter.png

Dragon Twitter

Gunakan Kode :
https://lh5.googleusercontent.com/-FuWkS1def0c/TlZ7Api4tjI/AAAAAAAAAQg/3RFLnfqHpiE/s800/MonozCore.blogspot.com_Dragon_Twitter.png

DBZ Twitter

Gunakan Kode :
https://lh6.googleusercontent.com/-OG97ysrMZHc/TlZ1Agdp08I/AAAAAAAAAQY/0GbYuQmaFDM/s800/MonozCore.blogspot.com_DBZ_Twitter.png

Dracula Twitter

Gunakan Kode :
https://lh6.googleusercontent.com/-FPaxJ9tqw5s/Tv8FNwjXEoI/AAAAAAAAAsM/Dl163KLaang/s800/Drakula.png

Bagi yang ingin memberikan saran, kritik dan komentarnya saya persilakan, ga perlu malu sebab saya sudah siapkan kolom khusus di bawah postingan ini.

:: Semoga Bermanfaat ::

FB Users () Comment | Read Users (46) Comment

Comments

46 Comments

lbukhori says:
August 25, 2011 at 3:02 PM

wah,,, seru.. seru.. makasih info nya.. baru tau aq..
MonozCore says:
August 25, 2011 at 3:56 PM

Di follow ya biar makin seru n rame sekaligus ajang popularitas buat follower blog kalo perlu di twitt juga...Thanks buat komennya...

:j: Happy Blogging
Haikal Qilbari says:
August 25, 2011 at 10:03 PM

sangatt bermanfaat...!!

aq minta izin yaa..
boleh ga aq posting artikel ni di blogku??
aq sertain dah link blogmu

janjii
MonozCore says:
August 25, 2011 at 10:25 PM

silahkan... link blog ane jgn lupa dicantumin ya
sering2 mampir bwt liat up date nya
arusbudi says:
August 25, 2011 at 11:38 PM

keren2 ne mas,,,,, thank's infonya !!!!
MangDe | Blogger says:
August 27, 2011 at 4:57 PM

Mantaf sob... unik and kreatif skali.. *thumbs up*
Toko " TITIPAN KAWAN " says:
September 6, 2011 at 2:57 PM

Maaf Boss Blognya gak bisa dibaca terhalang Headlines Komersial
MonozCore says:
September 6, 2011 at 7:43 PM

@Titipan Kawan: Maaf sebelumnya jika terhalang komersial box, coba gunakan mozilla firefox jika ada komersial box tinggal klik (X) yang berwarna merah untuk menutupnya...
KhuntienBoyz says:
September 7, 2011 at 11:06 AM

weah, mantap gan. thanks telah mmpir. ini sngat menarik sekali.
http://aciu-top.blogspot.com/2011/05/membuat-widget-burung-twitter-terbang.html
Gigin says:
September 9, 2011 at 6:58 AM

terimakasih ini sudah ngasih tau widget twitter animasi yg lain
blogHacc says:
September 19, 2011 at 6:19 PM

Udh lama pengen punya Burung Twitter yg terbang setelah nanyak mbah Google disuruh kesini.:D

Mampir ke tempat saya ea. Disana mas akan disambut sama naga.. =))
Nur Khasanah says:
September 25, 2011 at 10:13 PM

wwaaahhhh... keren blog nya. mksh jugak atas info nya..
Farhan says:
October 15, 2011 at 1:11 PM

Thanks om :D keren ;)) saya memakainya yang STICKMAN :D
Jangan lupa FOLLOW ME @Nkindmore (promosi dikit ;;)
Sandika Sasmita says:
October 28, 2011 at 2:27 PM

Wahh bagus tapi kenapa edisi ironman tidak sekalian masuk sinii?
MonozCore says:
October 28, 2011 at 9:49 PM

@Sandika Sasmita: Sori bro edisi ironman belakangan buatnya jadi ga masuk postingan ini...
Andry Surya says:
November 5, 2011 at 4:38 PM

:ka: makasih infonya gan :ke:
Teguh says:
November 7, 2011 at 10:34 AM

sip
Teguh says:
November 7, 2011 at 10:35 AM

itumas cara bikin pop ups headlines gimana
MonozCore says:
November 7, 2011 at 8:02 PM

@teguh: ok... jika berminat nanti saya buatkan artikelnya...
Muhammad Iram says:
November 13, 2011 at 6:20 AM

Makasih atas infonya...:d: Nanti kunjungi balik ya di: http://iramblogs.blogspot.com ,jangan lupa follow ya...:kl:
Berbagi Informasi dan Pengetahuan says:
November 16, 2011 at 8:01 PM

waaaaaaaaahhhhhhhh.....
makasih banyak..
infonya.. ini sgt brmanfaat bgt buat sy yg baru brgbung d blgger.." :D
WhyTrick Community says:
November 23, 2011 at 12:56 PM

Gan izin copast yah?? thaks 4 infoo :)
Raka Andriansyah says:
November 26, 2011 at 10:36 AM
This comment has been removed by the author.
fhyen ervina says:
December 1, 2011 at 4:32 AM

hhmm creatif bgt....
thks bgt yaaa
kunjungi jg y blogku di
http://fhyenervhyn.blogspot.com
Criest Hariz (Rizal) says:
December 1, 2011 at 7:36 AM

krrrrreeeeeeeeeeeennnn Mz bro,http://lh4.ggpht.com/_UEOySJCSmVg/TC1_zL6GKxI/AAAAAAAAA8A/hhFDtKzpMJo/s800/ehsan02.gifhttp://lh4.ggpht.com/_UEOySJCSmVg/TC1_zL6GKxI/AAAAAAAAA8A/hhFDtKzpMJo/s800/ehsan02.gif
Cilla says:
December 21, 2011 at 10:38 PM

Thanks banget bos atas informasinya..
jus manggis says:
December 31, 2011 at 1:34 PM

mantap bro..
azzi maihendra lubis says:
January 8, 2012 at 5:41 AM

TERIMA kasih gan..
ni yang q cari cari...
:)...

jngn lupa kunjungin + follow blik ya gan..
http://ikazzi.blogspot.com/
wiratama yoruichi says:
January 30, 2012 at 8:05 AM

siep lah...
Ozanzt Arfianzt says:
February 1, 2012 at 12:17 AM

kalo aku caranya bukan pake "Edit HTML", tapi langsung buat widget.. sama aja yah?? :-/ (newbie blogger) :)

http://ozanisme.blogspot.com
Wahab says:
February 4, 2012 at 8:52 AM

Makasih Infox...
Darknest Faint says:
February 4, 2012 at 10:57 AM

gan klo mo ambil gambar sendiri isa ngaa gan....??
Monoz Core says:
February 4, 2012 at 11:05 AM

@darkest faint : bisa bro tinggal disesuaikan aja gambar dan ukuran softwarenya gunakan coreldraw ato kalo mo lebih gampang coba gunakan software yang saya buat aftershots image editor, disitu dah ada editor gambar buat bikin image animasi twitter bird.
Rahmat Faturohmah says:
February 18, 2012 at 9:17 PM

yang 'Twitter - Twitter kamu https://twitter.com/TwitterKamu/';
gimana sih ?
contoin yakk .
pusing yang 'Twitter - Twitter Kamu
Maksudnya apa itu ?
Monoz Core says:
February 18, 2012 at 9:34 PM

@Rahmat : https://twitter.com/TwitterKamu/, maksudnya TwitterKamu = nama akun (username) twitter kamu, misalnya akun (username) twitter saya monozcore jadi tinggal merubah tulisan twitterkamu menjadi monozcore, contoh :
https://twitter.com/monozcore/

oke...bro..gampangkan !!!
Rahmat Faturohmah says:
February 20, 2012 at 2:55 PM

trims admin =))
kalo caranya buat efek start giamana ?
Monoz Core says:
February 20, 2012 at 5:51 PM

Coba cek postingan http://monozcore.blogspot.com/2011/07/7-graphic-user-interface-for-blog.html
Rahmat Faturohmah says:
February 21, 2012 at 6:56 PM

susah ~x(
kalo cara masang emosticon kaskus gimana ?
saya ko gagal truss ,,
maaf sebelumnya ngerepotin
Bukhari%satu hati says:
February 21, 2012 at 9:24 PM

Kang makasi yah dah kasih petunjuk tapi bloger akang tetep yang terbaik,,kang follback yak
Mochamad Sulchan says:
March 4, 2012 at 10:59 AM

Nice Trik,
Mantab gan...
Salahuddin Al ayyubi says:
January 4, 2013 at 8:46 AM

MAS ditambah lagi dong yang lebih keren yang robot gitu
Monoz Core says:
January 4, 2013 at 9:36 AM

@Salahuddin Al ayyubi : untuk yang robot sudah pernah saya buat yaitu flying twitter bird ironman dan gundamz seperti yang saya gunakan di blog ini... untuk artikelnya silakan sobat cari di blog ini...
Salahuddin Al ayyubi says:
January 4, 2013 at 4:06 PM

Ijin copas nanti saya berikan sumbernya
Monoz Core says:
January 5, 2013 at 7:58 AM

@Salahuddin Al ayyubi: Silakan, saya ijinkan...
Samarth Agarwal says:
March 10, 2013 at 12:01 PM

How to change character of twitter flying bird please help me
Monoz Core says:
March 12, 2013 at 9:44 AM

@Samarth Agarwal : just change the blue text in above code with image sprites url....