Kamis, 19 Juli 2012

Cara Membuat / Memasang Burung Twitter Terbang di Blog

Cara Membuat Burung Twitter Terbang di Blog - Lebih suka mana?? ngetweet apa ngeblog?? kalo ane sih kedua - duanya.. Kali ini ane akan kasih tahu bagaimana cara memasang burung twitter terbang atau melayang - layang atau mondar - mandir di blog sobat. Bagi sobat yang tertarik untuk memasang burung twitter terbang atau melayang - layang ini, silahkan ikut tutorial berikut .

1. Log in ke akun blog sobat.
2. Klik Rancangan --> Elemen Laman --> Tambah Gadget --> Pilih HTML/Javascript

Masukkan Script berikut ke dalam kotak yang telah di sediakan.

<!-- floating twitter Bird -->
<script type="text/javascript" src="http://tateluproject.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbp4qlqzd3IQjjreg4kdmaGs8Q1YgKxwHZMeqLeuuPrACHkJbd-FFGs6gBHfNwKUmJQ7R9xjnyCqd8lTMqjLot4yDa-7uBGd3qLz8o4A-neqmAqrTlknh7dP4DsD_NWzp1Rt2Kpjj2WsE/s1600/burung+twitter+terbang.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/deactivatednumi";
var tweetThisText = "Twitter - UserID http://bloggerpeer.blogspot.com/";
tripleflapInit();
</script>


3. Klik save / simpan.

Tambahan:
Ganti tulisan yang berwarna merah dengan warna icon twitter kesukaan sobat.

Warna Kuning

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhamKctufuBqzDatTIUDNOO11XN3M-pyppSzMN7mcoe7o2pj1JpkdG0KxcVEGtrYo-Dt3DZma0SPFKHwASr0XKj5xKIdtMlryemqgRdgOGHrEQvVaXj6wKPspGZJXHIxIZTCr5hc5Z20FU/s1600/yellow+bird.png

Warna Hitam

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijRsq6H92_npiV9Bc9pgN9sHYCBpqWGv91Kirc6xvSXOvSZsmXWQTnZTPCH0KiKLrqSIy6RsRcIJQI7wE7MHyPTHe-TusOz1guiDe4Mxe2RNkdLd3ddEcw_nMESWAs2zQUxI-tiVLb_9Q/s1600/black+bird.png

Warna Biru

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyIDqDkt-mb-YMapUO4ZdIsJp7y_Rq8gpsFskbJHagoAeFWLuYO1d4oLMbY1i1BuLvzJ-FW0bEfWHgHIClGGBozuR0Pk4AZ0aERgPNb4d8nKPAr4GsdsKAOmhf1m8l4f-M6EOEcclkHL0/s1600/Blue+bird.png

Warna Coklat

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgduphmPkzOcp3RTcit5ZJdlWPTt1VitBx5zBtE4gITmellyVHH7N6MXv5z5QB6wVeFCUX5R98116G_g_i3VbwbFsxFHvxp_ZTwV05YNIMPMiulCZxK9uhO1_faDnSza_l2fuRIGnl1RxI/s1600/brown+bird.png

Warna Hijau

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUbm8Q94H3CbZiB_m647DhI5oAyLqSelUFpaiuzGSUlc0zBeDdi8Oq0wiw8AhawCyCzSKVDfxe8eXH5PQ9xy9SlM6OaMLFW_zkqUk7MrFpIvUzb6SHoMQRtUrxBM6yWus7H2oAShdXicA/s1600/Green+bird.png

Warna Ungu

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmA-ywlyiD-7wrx0UKcYAbsotajOvr5Rn1tVc0dAos1HcUyQWMBqIc6MWOrPHEIeNfRC8Bh6pgMY7Ncc2PTeNDOvxnNhFTfPuCsC9VeZDZ_NVQp07Hv296pXpyDqII2PPDsYgFbCPFg-0/s1600/purple+bird.png

Warna Putih

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhwheXXpOT45UFm-r_5qibXG32Tk9sc1eA6YBd72hasRJwo6rYOkh0qW0Xkyal0xXJhVIJ4EQwgKGSAAd-zUwUO_evEwgN3x9Vul3TIXR9zn88he70DDN8g5snCEYMfh6l9wEX0azrTKI/s1600/white+bird.png

Warna Merah

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB-dwxkMOU9oyQbEEEQ-FH_TTKS-p102ho7dYeL1LK9aSDq6YwVYi5Klr0ntVMdqsfhQd6HQcZbr_xHJs9I0yoe4yGWYfH3b7Cm7fBBLRsvXVf_S4-9oGok5C_fiSP2xZwk85Q_XxAFFY/s1600/red+bird.png

Ganti Tulisan yang berwarna biru dengan username twitter sobat.


Semoga membantu!!

Cara Memasang Lagu di Blog

Cara Memasang Lagu di Blog - Bagaimana cara sobat menghias blog sobat?? Sudahkan sobat memasang widget Mp3 di blog sobat?? kalo belum dan sobat ingin memasangnya, berikut ada tutorial yang bisa sobat ikuti sebagai panduan memasang lagu di blog.
Lagu / Mp3 adalah salah satu widget blog yang biasa di pasang untuk mengusir kepenatan dalam ngeblog. Widget ini banyak di gunakan oleh para blogger newbie ( pemula ) dalam menghias blog. Sekedar info, bahwa mungkin widget ni akan sedikit menambah beban loading blog sobat, itulah sebabnya mengapa para blogger yang sudah lama ngeblog ( Blogger Senior ) jarang menggunakan widget ini.

Tapi bagi sobat yang tertarik memasangnya kali ini saya akan kasih tutorial nya. Silahkan ikuti Cara Memasang lagu di Blog ( Blogspot ) berikut.

1. Sign up ke MixPod dengan  mengisih data - data yang diminta seperti gambar berikut. Kemudian Klik Sign Up.


2. Kemudian sobat akan tampilan berikut.


3. Seperti pada gambar, langkah tersebut sobat lewati dengan mengklik No thanks, go to my account.
3. Kemudian Klik Create Playlist.


4. Selanjutnya sobat akan di mintah untuk memilih lagu untuk di masukkan dalam playlist.


5. Cari lagu yang sobat inginkan dan klik tanda plus (+) untuk memasukan lagu ke playlist, kemudian klik Costumize untuk mengatur tampilan Mixpod nya.



Di dalam menu costumize, sobat akan melihat 3 pilihan menu. antara lain, Skins, Color & Style dan Setting. atur sesuai keinginan.

 6. Klik Save Playlist kemudian beri judul dan deskripsi untuk playlistnya. misalnya..
Title : lagu
Deskripsi : Laguku


7. Ambil Scriptnya dengan meng klik Save (get code) dan pasangkan di HTML/Javascript blog sobat.
 Caranya, Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript--> Masukkan kodenya ke dalam kotak yang di sediakan. Klik sa

Kumpulan Efek - Efek Blog ( Lengkap )

Kumpulan Efek - Efek Blog ( Lengkap ) - Memang selalu ada cara untuk mempercantik penampilan blog. Setelah sebelum memposting cara memasang animasi di blog, kali ini saya akan kasih sobat berbagai macam / jenis efek - efek blog yang bisa di pasang di blog.

Sebelum kita masuk ke intinya, terlebih dahulu saya ingatkan pada sobat  bahwa efek, animasi dan widget - widget serupa akan menambah beban loading blog sobat, jadi mohon di perhitungkan sebelum sobat memasang efek ini. Efek yang akan saya posting kali ini, akan saya bagi 2 yaitu efek ringan ( loading ringan ) dan efek menegah hingga berat. ( kayak tinju aja.. ) .

Sobat yang tertarik memasangnya silahkan ikuti tutorial memasang efek - efek pada blog berikut.

A. Efek Ringan
Mungkin Ini adalah efek yang biasa sobat lihat saat sobat blogwalking.

1. Efek salju berjatuhan
<script src='http://tateluproject.googlecode.com/files/snow.js' type='text/javascript'></script>

2. Efek hati bertaburan
<script src='http://tateluproject.googlecode.com/files/lovingheart.js' type='text/javascript'></script>

3. Efek bintang bertaburan
<script src='http://tateluproject.googlecode.com/files/bintang.js' type='text/javascript'></script>

4. Efek kembang api
<script src='http://tateluproject.googlecode.com/files/kembangapi.js' type='text/javascript'></script>

5. Efek Gelembung
<script src='http://tateluproject.googlecode.com/files/efek-gelembung.js' type='text/javascript'></script>

5. Efek Kupu - Kupu Terbang
<script language="JavaScript1.2" src="http://imtikhan.googlecode.com/files/Kupu-kupu1.js"></script>

Cara pemasangan :
  1. Klik rancangan --> Edit html
  2. Letakkan script efek di atas kode </body>
  3. Klik Save

B. Efek Menengah - Berat
Efek ini saya ambil dari http://www.netdisaster.com. Untuk demo dari salah satu script berikut, silahkan lihat di sini.. DEMO

1.Meteor Jatuh
<script language="javascript">
nd_mode="meteor";
nd_control="on";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

 2. Banjir
<script language="javascript">
nd_mode="flood";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

 3. Bunga Mekar
<script language="javascript">
nd_mode="flowers";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

4.  Bom Atom
<script language="javascript">
nd_mode="bomb";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

5. Ufo
<script language="javascript">
nd_mode="ufo";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

6. Graffity
<script language="javascript">
nd_mode="graff";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

7. Shaver
<script language="javascript">
nd_mode="shaver";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

8. Gun
<script language="javascript">
nd_mode="gun";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

9.Bloody gun
<script language="javascript">
nd_mode="blood";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

10. Paint ball
<script language="javascript">
nd_mode="paint";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

11. Chainsaw
<script language="javascript">
nd_mode="chainsaw";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

12. Dinosaur
<script language="javascript">
nd_mode="dino";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

13. Lebah
<script language="javascript">
nd_mode="wasp";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

14. Lalat
<script language="javascript">
nd_mode="fly";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

15. Semut
<script language="javascript">
nd_mode="ants";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

16. Siput
<script language="javascript">
nd_mode="snail";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

17. Cacing
<script language="javascript">
nd_mode="worms";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

18. Mold
<script language="javascript">
nd_mode="mold";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

19. Bayi merangkak
<script language="javascript">
nd_mode="baby";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

20. Telur mata sapi
<script language="javascript">
nd_mode="eggs";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

21. Kopi tumpah
<script language="javascript">
nd_mode="coffee";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

22. Terbakar
<script language="javascript">
nd_mode="burn";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

23. Tomat
<script language="javascript">
nd_mode="tomato";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

24. Creampie
<script language="javascript">
nd_mode="creampie";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

25. Murka
<script language="javascript">
nd_mode="god";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

26. Sapi Jorok
<script language="javascript">
nd_mode="cow";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

27. Anjing Jorok
<script language="javascript">
nd_mode="dog";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

28. Kencing Sembarangan
<script language="javascript">
nd_mode="pee";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

Cara pemasangan :
  1. Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript
  2. Masukkan script efek di dalam kotak yang di sediakan
  3. Klik save dan lihat hasilnya.
Tambahan :
Efek yang ke 2 berbeda dengan efek yang pertama. di efek ke 2, efek bisa dimatikan secara manual, sedangkan yang pertama sebaliknya ( tidak bisa dimatikan selama masih memasang scriptnya ).  so, pilih mana yang terbaik menurut sobat.. salam..

Cara Membuat Buku Tamu Auto Hide di Blog

buku tamu cbox
Cara Membuat Buku Tamu / Guestbook Auto Hide di Blog - Apa kabar sobat blogger??? Pertama - tama saya memohon maaf atas komentar - komentar sobat blogger yang belum sempat saya balas sebelumnya, karena hidungku ( mampet ), aktivitas blogging ku terhenti hampir seminggu. Setelah sebelumnya memposting artikel cara memasang artikel acak di blog, kali ini dengan hidung yang masih cenat - cenut saya akan menjawab permintaan dari salah satu sobat blogger yang meminta cara membuat buku tamu auto hide di blog seperti yang tampak di sidebar blog ini.

Auto hide Shuotbox adalah efek yang akan membuat buku tamu muncul tanpa di klik dan tersembunyi tanpa di klik pula ( di lewati pointer mouse ), hanya beda sedikit dengan buku tamu show / hide. Sobat yang tertarik memasang widget ini, silahkan masukkan kode berikut di HTML/Javascript blog sobat.

<style type="text/css">
#gb{
position:fixed;
top:20px;
z-index:+1000;
}* html #gb{position:relative;}

.gbtab{
height:150px;
width:50px;
float:left;
background:url('http://i1108.photobucket.com/albums/h405/christian410/ghtrf.png') no-repeat;
}

.gbcontent {
float:left;
border:1px solid #000000;
-moz-border-radius-bottomleft:5px;
-webkit-border-radius-bottomleft:5px;
-o-border-radius-bottomleft:5px;
-khtml-border-radius-bottomleft:5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-topleft: 5px;
background: #F2F2F2; url() no-repeat bottom;
padding:10px;
}

</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 51-w) : moveGB(30-w, 0);
gb.opened = !gb.opened;
}function moveGB(x0, xf){

var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 25 ? 25 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 5);}
}</script>

<div id="gb">
<div class="gbtab" onmouseover="showHideGB()"> </div>

<div class="gbcontent">
<center>
<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div id="cboxdiv" style="text-align: center; line-height: 0">
<div><iframe frameborder="0" width="300" height="275" src="http://www4.cbox.ws/box/?boxid=4100717&amp;boxtag=ebc39c&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain4-4100717" style="border:#FFFFFF 1px solid;" id="cboxmain4-4100717"></iframe></div>
<div><iframe frameborder="0" width="300" height="75" src="http://www4.cbox.ws/box/?boxid=4100717&amp;boxtag=ebc39c&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform4-4100717" style="border:#FFFFFF 1px solid;border-top:0px" id="cboxform4-4100717"></iframe></div>
</div>
<!-- END CBOX -->
<br />
<div style="text-align:center">
<span style="float:right; color:#000000;">Get this <a target="_blank" href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-buku-tamu-auto-hide-di.html"> widget! </a></span>
</div>
</center></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (50-gb.offsetWidth).toString() + "px";
</script>

</div>
 

Caranya :
  1. Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript
  2. Masukkan kodenya di kotak yang di sediakan.
  3. Klik Save 
Tambahan :
Ganti kode yang berwara biru dengan kode buku tamu milik sobat. Sobat yang belum punya buku tamu silahkan buat terlebih dahulu di cbox ( seperti blog ini) , fibox, shoutchamp atau pada penyedia chatbox gratisan lainnya.

Cara Membuat Artikel Tidak Bisa di Copy Paste

Cara Membuat Artikel Agar Tidak Bisa di Copy Paste - Apalah yang paling menjengkalkan hati seorang blogger selain ketika artikelnya di Copas ( salin ) tanpa seizinnya. Bayangkan saja sob, artikel yang dengan susah payah di ketik dengan bercucuran keringat dan menguras otak ( hehe.. berlebihan ya?? ) akhirnya harus ada duplikatnya tanpa se izin dari yang empunya artikel.
Meskipun tak sedikit yang tidak mempermasalahkan tindakan Copy paste artikel ini, namun yang namanya mencuri hasil karya tanpa ada ijinnya tetap saja dianggap sebagai tindakan kurang sportif.. sebetulnya saya sendiri tidak mempermasalahkn tindakan copy paste terutama yang lakukan di blog ini, asalkan sobat menyertakan link aktif artikel yang di copas sebagai sumbernya, kira - kira dengan cara seperti itulah kita bisa saling menghargai hasil ketikan jari sesama blogger. Berikut beberapa teknik anti Copas yang bisa saya share untuk sobat blogger.

Gunakan script berikut untuk meletakkan link sumber ( link source ) otomatis ketika di copas
Letakkan script berikut di atas kode <body> kemudian di save.
<script type="text/javascript"> if(document.location.protocol=='http:'){ var Tynt=Tynt||[];Tynt.push('cXIEhKYVSr4lJ5adbi-bpO');Tynt.i={"ap":"Sumber :"}; (function(){var s=document.createElement('script');s.async="async";s.type="text/javascript";s.src='http://infonetmu.googlecode.com/files/sumber-otomatis.js';var h=document.getElementsByTagName('script')[0];h.parentNode.insertBefore(s,h);})(); } </script>

Catatan :
Ubah tulisan berwarna biru sesuai keinginan. misalnya "artikel bersumber dari"

Namun jika sobat blogger memang sama skali tak mentolerir tindakan ini atau memang tidak mau artikelnya sampai di duplikat orang lain, maka bisa sobat siasati dengan memasang 2 trik anti copas ( disable klik kanan ) berikut.

Membuat Artikel Tidak Bisa di Copas 

1. Trik Pertama :

1. Klik rancangan -->Edit HTML
2. Cari dan ganti kode <body> dengan kode berikut
<body onmousedown="return false" oncontextmenu="return false" onselectstart="return false" >

3. klik save


2. Trik Ke Dua :
Menonaktifkan klik kanan sekaligus mengeluarkan pesan peringatan seperti gambar berikut.

Caranya :
1. Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript
2. masukkan kode dalam kotak yang di sediakan
<script>
var pesen="Tidak diperbolehkan klik kanan oleh admin!";
///////////////////////////////////
function clickIE4(){if (event.button==2){alert(pesen);return false;}}
function clickNS4(e){if (document.layers||document.getElementById&&!document.all){if (e.which==2||e.which==3){alert(pesen);return false;}}}
if (document.layers){document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS4;}
else if (document.all&&!document.getElementById){document.onmousedown=clickIE4;}
document.oncontextmenu=new Function("alert(pesen);return false")
</script>
 catatan:
 Ubah tulisan yang berwarna merah dengan pesan peringatan yang di inginkan.

3. klik save

Silahkan pilih yang mana yang di rasa lebih baik, apakah sobat memperbolehkan Copas tapi harus ada link sumbernya, atau sama sekali tidak ingin ada yang meng-copas artikelnya.

Cara Membuat Menu Navigasi Horisontal CSS3

Cara Membuat Menu Navigasi Horisontal Animasi CSS3 - Tutorial kali ini saya pastikan akan membuat tampilan blog sobat lebih bergairah, setelah beberapa waktu yang lalu menerbitkan artikel tentang membuat menu horisontal animasi menyamping ( KWICKS ) kali ini kembali saya akan memposting artikel serupa namun berbeda. Bedanya dimana?? nanti sobat blogger yang nilai sendiri. Silahkn ikuti tutorial singkat berikut untuk membuat menu animasi mendatar dengan CSS3.

DEMO

1. Login ke akun blogger sobat
2. Klik Rancangan --> Edit HTML
3. Letakkan kode berikut di atas kode ]]></b:skin>
.Hansuperanima{
        position:relative;
        margin:15px 0 0 10px;
        overflow:hidden;
        margin:0;
        float:left;
        padding:0;
        background:#1d1d1d url(https://lh6.googleusercontent.com/-Rf9nVjhGRBo/T2XE4tDyeSI/AAAAAAAAAcI/80Id8S5lkdE/h120/bgTitik2AnimaV21H21.gif);
}
ul#superAnima{
        width:599px;
        margin:10px 0 20px;
        padding:0;
        margin:3px 4px 3px 4px;
        clear:both;
        float:left;
}
ul#superAnima li{
        margin:0;
        padding:0;
        overflow:hidden;
        float:left;
        height:40px;
}
ul#superAnima li a.anima{
        padding:10px 10px;
        font:10px Arial;
        float:left;
        color:white;
        text-decoration:none;
        text-transform:uppercase;
        text-shadow:1px 1px 1px #000;
        clear:both;
        height:18px;
        line-height:20px;
        background:white url(https://lh4.googleusercontent.com/-a0zdLvnsQE8/T2XFNjkIrWI/AAAAAAAAAcQ/rrmwCSZMx3k/h120/gradBlueH2V53.gif) top left repeat-x;
        text-align:center;
        transition:all 1.2s ease-in-out;
        -o-transition:all 1.2s ease-in-out;
        -moz-transition:all 1.2s ease-in-out;
        -webkit-transition:all 1.2s ease-in-out;
        -ms-transition:all 1.2s ease-in-out;
        font-weight:bold;
        border:1px solid #999;
}
ul#superAnima li a.anima:hover{
        transform:scale(1.0) rotate(0deg) translate(0, -40px);
        -o-transform:scale(1.0) rotate(0deg) translate(0, -40px);
        -moz-transform:scale(1.0) rotate(0deg) translate(0, -40px);
        -webkit-transform:scale(1.0) rotate(0deg) translate(0, -40px);
        -ms-transform:scale(1.0) rotate(0deg) translate(0, -40px);
}
ul#superAnima li a.anima span{
        padding:10px 9px;
        color:transparent;
        opacity:0.2;
        filter:alpha(opacity=20);
        border:2px solid transparent;
        transition:all 1.6s ease-out;
        -o-transition:all 1.6s ease-out;
        -moz-transition:all 1.6s ease-out;
        -webkit-transition:all 1.6s ease-out;
        -ms-transition:all 1.6s ease-out;
        transform:scale(8.0) rotate(0deg) translate(0,-10px);
        -o-transform:scale(8.0) rotate(0deg) translate(0,-10px);
        -moz-transform:scale(8.0) rotate(0deg) translate(0,-10px);
        -webkit-transform:scale(8.0) rotate(0deg) translate(0,-10px);
        -ms-transform:scale(8.0) rotate(0deg) translate(0,-10px);
}
ul#superAnima li a.anima span:hover{
        opacity:1.0;
        filter:alpha(opacity=100);
        padding:4px 9px;
        height:18px;
        transform:scale(1.0) rotate(0deg) translate(0,0);
        -o-transform:scale(1.0) rotate(0deg) translate(0,0);
        -moz-transform:scale(1.0) rotate(0deg) translate(0,0);
        -webkit-transform:scale(1.0) rotate(0deg) translate(0,0);
        -ms-transform:scale(1.0) rotate(0deg) translate(0,0);
        color:#FF0;
        border:2px solid #000;
        background:#555;
        text-shadow:1px 1px 1px #000;
        box-shadow:1px 2px 15px #fff, 0px -1px 3px red, -2px -2px 2px orange, -3px 3px 3px yellow;
        border-radius:4px;
}
ul#superAnima li{
        border:1px solid transparent;
        background:#CC9933 url(https://lh4.googleusercontent.com/-Tk55wbQOL_s/T2XGvQfF2WI/AAAAAAAAAcY/1_THN4F2g7A/h120/gradOrangeBlackV45H2.gif);
}
ul#superAnima li:hover{
        background:#000 url(https://lh6.googleusercontent.com/-Rf9nVjhGRBo/T2XE4tDyeSI/AAAAAAAAAcI/80Id8S5lkdE/h120/bgTitik2AnimaV21H21.gif);
        border:1px solid #777;
}
Catatan:
Sesuaikan kode angka yang berwarna biru dengan ukuran template.

4. Klik save dan lanjut ke tahap ke 2.
5. Klik Rancangan --> Elemen laman
6. Klik Tambah Gadget tepat di bawah header dan kemudian pilih HTML/Javascript..


7. Masukkan kode berikut kedalam kotak HTML/Javascript.
<div class="Hansuperanima">
<ul id="superAnima">
<li><a class="anima" href="http://christiantatelu.blogspot.com">Home<br /><br /><span>Home</span></a></li>
<li><a class="anima" href="http://christiantatelu.blogspot.com/feeds/comments/default">Comment<br /><br /><span>Comment</span></a></li>
<li><a class="anima" href="http://christiantatelu.blogspot.com">Christian Tatelu<br /><br /><span>Christian Tatelu</span></a></li>
<li><a class="anima" href="http://facebook.com/csnice">My Facebook<br /><br /><span>My Facebook</span></a></li>
<li><a class="anima" href="http://twitter.com/deactivatednumi">My Twitter<br /><br /><span>My Twitter</span></a></li>
<li><a class="anima" href="http://christiantatelu.blogspot.com/feeds/posts/default">Feed Blog<br /><br /><span>Feed Blog</span></a></li>
</ul>
</div>

Silahkan ubahsuaikan semua kode yang bercetak tebal ( bold ) sesuai keinginan. Sekian tutorialnya dan semoga membantu..

Cara Menampilkan Rating Bintang di Hasil Pencarian Google

Cara Menampilkan Rating Bintang di Hasil Pencarian Google - Setelah sekian lama mencari artikel tentang cara menampilan rating star di hasil percarian google, akhirnya ane dapat juga tutorialnya. Caranya sangat mudah dan berbeda dengan tutorial lain yang pernah saya coba sebelumnya yang tentuhnya nggak berhasil, entah mungkin karna masalah template atau apalah  ..ane nggak tahu..

Untuk bisa menampilkan rating bintang ini, sobat terlebih dahulu harus memiliki akun di google plus dan sudah harus terhubung dengan blog sobat dengan cara mengklaim sebagai kontributor untuk blog sobat tersebut. Masih bingung? Khusus yang belum punya akun di google plus, entar akan ane posting tutorialnya.

Sekedar tambahan, rating bintang ini nantinya akan dimunculkan di hasil pencarian untuk artikel - artikel blog sobat terutama artikel yang baru diposting sesaat setelah mengikuti dan memasang ratting bintang di tutorial kali ini..

Cara Menampilkan Rating Bintang di Google
1. Login ke akun blog sobat2. Klik Rancangan --> Edit HTML --> Centang kotak kecil di samping tulisan Expand Template widget
3. Letakkan kode berikut tepat diatas kode <b:skin><![CDATA[/*
<b:if cond='data:blog.url == data:blog.homepageUrl'><link href='https://plus.google.com/110332182798805450378' rel='publisher'/>
</b:if>
catatan:
ganti angka berwarna biru dengan Url google plus milik sobat.

4. Kemudian letakkan kode berikut sesudah kode <body>
<div><div itemscope='' itemtype='http://data-vocabulary.org/Review'>

dan tag penutup </div></div> sebelum tag penutup </body>

5. Cari kode <data:post.body/> dan letakkan kode berikut tepat dibawahnya.
Description: <span itemprop="description"><data:post.title/></span>
Rating: <span itemprop='rating'>4.5</span>
Reviewer: <span itemprop='reviewer'><data:post.author/></span> -
ItemReviewed: <span itemprop='itemreviewed'><data:post.title/></span>
Tambahan:
Kode <data:post.body/> akan berjumlah 2 jika sobat telah memasang readmore, pilih kode yang ke 2.

6. Klik save dan lihat hasilnya disini!

Jika pemasangnya berhasil, maka sobat akan melihat tampilan seperti gambar berikut.

Agar Blog Banyak Pengunjung

Agar Blog Banyak Pengunjung - Wah.. udah lama nich nggak posting.. Mengawali pagi yang cerah ini, kali ini saya akan memposting tentang cara agar blog banyak pengunjung. Visitor adalah harga mati dalam dunia blog.. Betul? Untuk apa kita mengoptimasi template , memakai beribu hiasan di blog, dan menulis artikel se orisinil mungkin yang nantinya hanya kita sendiri yang menikmatinya ? Blog kita butuh dipromosikan.. Promosi bisa dilakukan dengan berbagai cara.. Diantaranya
1. Memperkenalkan blog ke Berbagai Search engine ( khususnya Google, yahoo, dan Bing). Klik disini!
2. Memperkenalkan Blog ke Blog yang lain ( dalam hal ini "Blogwalking" ).
3. Memperkenalkan Blog ke Jejaring Social ( Khususnya Facebook dan Twitter).
4. Memperkenal Blog Ke Forum - Forum Online.
5. Memperkenalkan Blog Ke Social Bookmarking

Dan untuk satu hal penting yang menjadi hidup matinya blog, yaitu BACKLINK. Backlink itu akan ada dengan sendirinya jika sobat melakukan ke 5 langkah di atas... Sekian....

Dipersilahkan bagi para sobat blogger yang ingin memberi masukkan atau tambahan mengenai postingan di atas...

Cara Memasang TV di Blog

tv online
Cara Memasang Tv Online Streaming di Blog - Selalu ada yang baru di dunia blog, setelah bisa memasang animasi di blog, memasang lagu di blog, kini dengan kecanggihan teknologi sobat bisa memasang TV online di blog ( nonton sambil ngeblog ) entah itu RCTI, SCTV, TRANS TV, TRANS 7, GLOBAL TV, MNC TV, KOMPAS TV, INDOSIAR, ANTV, TV ONE, dan lain - lain. Tutorial yang seperti ini bisa dengan mudah sobat temukan di google dengan kata kunci "cara pasang tv ( televisi ) di blogspot". Berikut tutorial cara pasang TV di blog bagi sobat yang berminat.

A. Untuk memasang TV Online di sidebar blog, sobat ikuti tutorial berikut.

1. Log in ke akun blog sobat
2. Klik Rancangan --> Elemen laman --> Tambah gadget --> pilih HTML/Javascript
3. Masukkan kode berikut ke dalam kotak yang di sediakan.
<div id="NamaTV"></div><div id="TVstyle"></div><div class="tvborder"><iframe id="fsTVframe" scrolling="no" frameborder="0" name="TVPlayerWb" allowtransparency="true"></iframe></div><ul id="fsTVOnline"></ul><div class="clear"></div><span id="TVsource"></span><a id="wb_tvauth" href="http://www.warungbebas.com">Warung Bebas TV Streaming</a><script src="http://javascript-share.googlecode.com/files/wb.js"></script><script type="text/javascript">wb.tv_setting={channel_start:7,player_width:300,player_height:215,icon_width:40,float_icon:true};</script><script src="http://javascript-share.googlecode.com/files/wb_tv_online_indonesia_2_0.js"></script>

4. klik save

B. Untuk cara pemasangan di halaman postingan berikut tutorialnya .

1. Login ke akun blog sobat
2. Klik Entri baru kemudian beri judul sesuai keinginan. Misalnya Nonton TV Online
3. Masukkan kode berikut di Edit HTML di postingan dan jangan di Compose
<div id="NamaTV"></div><div id="TVstyle"></div><div class="tvborder"><iframe id="fsTVframe" scrolling="no" frameborder="0" name="TVPlayerWb" allowtransparency="true"></iframe></div><ul id="fsTVOnline"></ul><div class="clear"></div><span id="TVsource"></span><a id="wb_tvauth" href="http://www.warungbebas.com">Warung Bebas TV Streaming</a><script src="http://javascript-share.googlecode.com/files/wb.js"></script><script type="text/javascript">wb.tv_setting={channel_start:7,player_width:300,player_height:215,icon_width:40,float_icon:true};</script><script src="http://javascript-share.googlecode.com/files/wb_tv_online_indonesia_2_0.js"></script>

4. Klik Terbitkan Entri dan lihat hasilnya..

Tambahan :
Atur ukuran width ( lebar ) dan Height ( tinggi ) TV online sesuai keinginan.

Cara Membuat Teks Berjalan di Blog

tulisan berjalan
Tulisan berjalan
Cara Membuat Teks Berjalan di Blog - Pernah tidak sobat melihat tulisan / teks yang mondar - mandir di suatu blog?? saya rasa pasti sudah pernah.. namanya marquee sob! fungsinya sebenarnya hanyalah sebagai hiasan di blog, hampir sama dengan headline news ( baca : memasang headline news di blog ) cuma yang ini lebih mudah ngaturnya, terutama dalam mengatur gerakan / prilaku teks yang di inginkan. Sobat yang tertarik membuat tulisan yang mondar - mandir ini, silahkan ikuti terus tutorialnya.

Cara Membuat Tulisan Berjalan di Blog

1. Tulisan bergerak dari kanan ke kiri
 <marquee direction="left" scrollamount="2" align="center">Contoh Tulisan Berjalan</marquee>
 hasilnya
Contoh Tulisan Berjalan

2. Tulisan bergerak dari kiri ke kanan
 <marquee direction="right" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>
 hasilnya
Contoh Tulisan Berjalan

3. Teks bergerak bolak balik ( mondar - mandir ) dari kiri ke kanan
<marquee direction="left" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>
hasilnya
Contoh Tulisan Berjalan


4. Teks bergerak bolak balik ( mondar - mandir ) dari kanan ke kiri
<marquee direction="right" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>
hasilnya
Contoh Tulisan Berjalan


5. Teks bergerak dari atas ke bawah
 <marquee direction="down" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>
 hasilnya
Contoh Tulisan Berjalan

6. Teks bergerak dari bawah ke atas
 <marquee direction="up" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>
hasilnya
Contoh Tulisan Berjalan

7. Teks bergerak mondar- mandir dari atas ke bawah
 <marquee direction="up" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>
hasilnya
Contoh Tulisan Berjalan

8. Teks bergerak zig - zag ( diagonal ) memantul
 <center><marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right" behavior="alternate"> Contoh Tulisan Berjalan </marquee></marquee></center>
 hasilnya


Contoh Tulisan Berjalan

9. Teks bergerak zig - zag ( diagonal ) tembus
 <center><marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right"> Contoh Tulisan Berjalan </marquee></marquee></center>
hasilnya


Contoh Tulisan Berjalan

Cara memasang :
1. Login ke akun blog sobat
2. Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript
3. Masukkan kode marquee dari salah satu tulisan berjalan diatas
4. Klik save dan lihat hasilnya.

tambahan :
  • Direction : untuk mengatur pola gerakan teks (left, right, up dan down)
  • Scrollamount : untuk mengatur kecepatan gerakan teks. Naikkan angkanya ( dari 2 menjadi 3 ) untuk mempercepat gerakan dan sebaliknya.
  • Behavior ( scroll/slide/alternate ): untuk mengatur prilaku gerakan.
  • Untuk menambahkan background, padding, border, color, dll pada marquee, silahkan sisipkan  kode marquee antara kode berikut
<div style="background: #000000; border: 2px solid #FF0000; color: white; font-size: 20px; font-weight: bold; letter-spacing: 0.5em; padding: 15px;">
<marquee direction="left" scrollamount="6" align="center">Contoh Tulisan Berjalan</marquee>
</div>

hasilnya :
Contoh Tulisan Berjalan

  • Untuk menyisipkan link pada marquee, gunakan kode berikut :
<div style="background: #FFFFFF; border: 2px solid #FF0000; color: black; font-size: 20px; font-weight: bold; letter-spacing: 0.2em; padding: 15px;">
<marquee direction="left" scrollamount="6" align="center"><a href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-teks-berjalan-di-blog.html"/>Cara Membuat Teks Berjalan di Blog</a></marquee>
</div>
catatan :
ganti tulisan yang berwana biru dengan Url yang di inginkan.
hasilnya :
  • Contoh lain penggunaan link pada marquee yaitu dengan menggunakan kode berikut :
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="100" align="center">
<a href=" http://christiantatelu.blogspot.com/2012/03/cara-membuat-permalink-di-blog.html/">cara membuat permalink di blog</a><br/>
<a href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-logo.html">cara membuat logo</a><br/>
<a href="http://christiantatelu.blogspot.com/2012/03/blog-di-blogspot-dan-blog-di-wordpress.html">blog di blogspot dan blog di wordpress</a><br/>
</marquee>
catatan :
kode yang di cetak tebal adalah perintah pada teks untuk terhenti ketika di lewati pointer
Hasilnya :

Sekian posting cara bikin tulisan berjalan nya....

Minggu, 15 Juli 2012


Membuat Efek 3D kubus, lingkaran, tabung pada Foto

Publish: 04 September 2007 | Author & Copyright: Adam | Status: FREE tutorial

Membuat efek 3D pada Foto secara kubus Lingkaran dan tabung bisa dilakukan dengan photoshop dan caranya pun mudah...

Dalam Belajar Photoshop kali ini kita akan mempelajarinya. Photoshop yang saya gunakan Photoshop 7

Langkah-langkahnya:

1. Jalankan program photoshop. file --> Open atau tekan [ctrl] + [O] Setelah itu carilah gambar yang akan diubah, Sebagai contoh disini saya menggunakan foto saya:

Klik gambar untuk memperbesar tampilan - download gambar --> versi Zip file
Ukuran 800 x 600 pixels

2. Kita mulai membuat efek 3D
Caranya:
masuk ke menu utama, pilih Filter –-> Render –-> 3D Transform
Di dalam 3D Transform ada
- Selection tool (V)
- Direct Selection tool (A)
- Cube tool (M)
- Sphere tool (N)
- Trackball tool (N)
dan banyak lagi

3. Masih di dalam table dialog 3D Transform
Jika membuat bentuk kubus 3D klik Cube tool (M) dan jika membuat lingkaran 3D Klik Sphere tool (N), Klik gambar Foto anda Sambil Tekan Kebawah untuk Memperbesar kubus atau lingkaran
Note: untuk memindahkan posisi kubus, atau lingkaran klik Pan camera tool (E)

Contoh Hasil

Menarik bukan...

Banyak cara, dan mudah silakan anda mencoba terus, dan menurut pengalaman saya belajar design grafis itu, lebih mudah dari internet ketimbang dari buku-buku, awal sayabisa design grafis dari situs ini , dan itu juga belum lama loh, thx semoga bermanfaat
SEMOGA BERMANFAAT

Manipulasi Foto Menjadi Efek Kamera Infrared

Publish: 08 November 2007 | Author & Copyright: Johan | Status: FREE tutorial

Pernah lihat uji nyali,uka-uka atau sejenisnya? Tapi sayangnya kita tidak membahas itu, rekaman gambar adegan tersebut menggunakan kamera inframerah, disini saya akan menjelaskan cara mengubah foto berwarna kita sehingga menjadi berefek kamera inframerah menarik bukan...

Sabar... Untuk metode kali ini kita perlu sesajen, yaitu kopi manis ditambah dengan roti kering... Wah Cocok!!! Jangan Lupa Muzic...

Ok... berikut Langkah-langkahnya:

1. Jalankan program photoshop. file --> Open atau tekan [ctrl] + [O] Setelah itu carilah gambar yang akan diubah, Sebagai contoh disini saya menggunakan foto Kucing saya [bukan kucing garong lo...]

Kamu bisa download klik aja download gambar --> versi Zip file
Ukuran VGA 640 x 480 pixels

2. Kita mulai membuat efek Neon Glow
Caranya:
masuk ke menu utama, pilih Filter –-> Artistic –-> Neon Glow...
Atur seperti ini

Lalu OK

3. Sekarang tinggal Effek Pencahayaan
masuk ke menu utama, pilih Image –-> Adjusment –-> Hue/Saturation...
Setting seperti ini

dan OK

Dan hasilnya belajar photoshop kali ini...
kucing
Wah kok jadi serem gini... Kucing kesayanganku... ^.^
SEMOGA BERMANFAAT

Efek Rekaman Video Rusak pada Foto

Publish: 19 Desember 2007 | Author & Copyright: Johan | Status: FREE tutorial

Foto Efek, Merupakan suatu yang tidak ada habisnya untuk diexplore. Kali ini Kita akan memberikan efek yang menurut saya sederhana namun terkesan futuristik dan imajinatif, efek ini bisa disebut efek rekaman video rusak pada Photoshop Tutorial

Atau pernah liat TV trus ada gangguan sinyal maka di layar biasanya gambar akan tampil bergaris-garis...

Menarik bukan? Menarik becak.. Menarik Bemo.. Menarik.. Wis pokoknya menarik lah..

berikut Langkah-langkahnya:

1. Jalankan program photoshop. file --> Open atau tekan [ctrl] + [O] Setelah itu carilah gambar yang akan diubah, Sebagai contoh disini saya menggunakan foto ---> ehm... ehm... Sayang bukan pacar saya, Gak tau siapa yang penting mau jadi model di www.ilmugrafis.com

Kamu bisa download klik aja download gambar --> versi Zip file
Ukuran 665 x 582 pixels [Lumayan... buat dicetak]

2. Buat Project baru / Kanvas baru
Caranya:
Pada menu utama pilih File --> New
Atau pakai shortcut keyboard [ctrl] + [ N]
Atur seperti ini:

Klik [OK]

beri warna bagian atas dg hitam dan dan bagian bawah dg putih
Tips: Untuk proses Selection gunakan Rectangular Marquee Tool - Lalu gunakan Fill Tool untuk Pewarnaan
Hasilnya:

Project baru

3. Membuat Pattern
Caranya:
Masih dengan gambar hitam putih tersebut
Pada menu utama pilih Select --> All
Setelah itu
pilih Edit --> Define Pattern
Fiuh akhinya jadi deh pattern
Kegunaannya --> Sebagai effek garis

4. Kembali ke gambar yang akan diberi efek [wanita cantik model belajar-grafis tadi...]
Pertama: Gunakan jurus ninja... Duplikat Layer
Caranya: Pada Menu Utama pilih Layer --> Duplicate Layer...
Selanjutnya: Menu Utama pilih Layer --> Layer Style --> Pattern Overlay...

Atur seperti ini

Lalu tekan [OK]
Tips: Ubah Scale untuk memperoleh mengatur tingkat keburaman

5. Hasilnya:
video rusak
Wah... Video Rusak... Help..Help..
SEMOGA BERMANFAAT

Memanipulasi Gambar dengan LAYER MASK

Publish: 29 Januari 2008 | Author & Copyright: Irvan | Status: FREE tutorial

Salam Kenal… Aku numpang post tutorial memanipulasi gambar dengan LAYER MASK ya mas..sapa tau dengan berbagi ilmu Photoshop bisa bermanfaat untuk orang lain dan kelak kita bisa mendapatkan pahala dari yang kuasa.. amien…

Langkah-Langkahnya:
1. Sediakan dua gambar yang pengen kamu gabungkan


2. Buatlah file baru dengan ukuran sesuai dengan keperluan kamu [CTRL + N]

3. Masukkan dua gambar tadi kedalam file yang baru yang kamu buat dengan menggunakan Move Tool, secara otomatis jumlah layer pada window layer akan bertambar menjadi tiga layer

4. Pastikan posisi layer sesuai dengan gambar keterangan di atas atau gambar yang akan digradien dengan MASK berada pada posisi paling atas

5. Klik pada Layer yang akan kamu gradient dengan mask, kemudian klik icon Add Layer Mask pada Window Layer hingga pada layer tersebut muncul Layer Mask Tumbnail..(lebih jelasnya lihat gambar dibawah..)


6. Pilih Gradien Tool pada window tools, kemudian anda buat gradient pada gambar dengan cara menarik garis dari atas kebawah atau sebaliknya hingga anda mendapatkan hasil yang sesuai dengan keinginan anda..

Hasilnya:

Selamat Mencoba...

Menghilangkan Jerawat Dengan Photoshop

Publish: 08 Februari 2008 | Author & Copyright: Irvan | Status: FREE tutorial

Disini kita akan mencoba menghilangkan jerawat dengan cepat dan mudah tanpa banyak biaya...

Hanya dengan belajar ilmu photoshop

mari kita buktikan...

Langkah-Langkahnya:

1. Kita akan mencoba pada gambar yang telah tersedia di atas.
Anda bisa download atau save as gambar di atas.

2. Buka file gambar yang sudah kamu sediakan Klik pada Healing Brush Tool (dengan otomatis kursor akan berubah menjadi bentuk Lingkaran)

Posisi Healing Brush Tool pada jerawat

3. Atur diameter/besar lingkaran Healing dengan ukuran jerawat (untuk mengganti ukuran anda Klik Kanan pada layar kerja kemudian atur besar Diameternya)
Contoh:

Setting Healing Brush Tool

4. Tekan tombol Alt sampai kursor berubah seperti lambang SnapShot kemudian klik pada bagian wajah yang paling bersih atau tanpa jerawat (pilih pada bagian dengan kontras warna yang sama dengan bagian jerawat), lepas tombol Alt kemudian anda tinggal klik pada bagian wajah yang berjerawat hingga bersih..

Jerawat Hilang (dalam 7 menit - With Belajar-Grafis Miracle...)

5. Agar gambar lebih cerah atur contras warna dengan melakukan langkah sbb:
= Pilih menu Image > Adjustments > Curves : ganti nilai input dan output
Sebagai rekomendasi ganti dengan * input : 99 *out put : 146 atau atur sesuai dengan selera anda.

rekomendasi setting

Hasilnya:

The Power of Desain Grafis - www.ilmugrafis.com
Kulit Lebih Putih tanpa kosmetik


Selamat Mencoba...

Lighting Effect Pada Foto

Publish: 18 Februari 2008 | Author & Copyright: Irvan | Status: FREE tutorial

Setiap kita membuat sebuah hasil karya berupa FOTO, rasanya kurang asyik jika kita hanya mengandalkan efek pencahayaan murni dari sinar matahari atau lampu, disini penulis akan mencoba berbagi pengetahuan tentang efek pencahayaan yang disediakan Photoshop.

Langkah-langkahnya:

1. Sediakan gambar ato foto yang ingin kamu edit. Contohnya seperti gambar di bawah ini :

Gambar ini saya ambil dari
http://linuxgembel.wordpress.com/category/nice-music/

2. Klik Menu FILTER – RENDER – LIGHTING EFFECTS, maka akan muncul window baru seperti dibawah ini


3. Anda tinggal memilih STYLE yang cocok untuk Efek Lighting pada foto anda..salah satu contohnya BLUE OMNI yang dapat memberikan kesan sorot lampu warna biru sehingga membuat foto anda terasa lebih garang.. setelah itu anda tinggal menambahkan Teks untuk menambahkan fariasi pada gambar.

Salam Rock Stars

Selamat Mencoba...

Efek Butiran - Butiran Air Membasahi Foto

Publish: 28 Februari 2008 | Author & Copyright: Johan | Status: FREE tutorial

Efek butiran - butiran air membasahi foto? tenang.. tenang.. ini cuman rekayasa photoshop aja, jangan dikira prakteknya menyiram foto dengan air betulan, nanti gak malah bagus eh jd rusak...

Oh iya hampir lupa, hari ini kan (premiernya movie Ayat-Ayat Cinta...), trus apa hubungannya dengan ilmu photoshop?
Ya cuma ngasih info aja, hwe3x...

Ok, tanpa banyak chit-chat ini langkah-langkahnya:

1. Buka Gambar yang akan diedit dengan photoshop
Bisa foto kamu atau pemandangan alam, atau barangkali belum punya gambar untuk diedit? silahkan mencari di search engine, disini saya menggunakan gambar pantai...

(beautiful scene)

2. buat lingkaran dengan Elipse Tool
catatan: foreground dan background harus putih


Hasilnya:


3. Selelah itu klik kanan dan pilih Rasterize Layer...

4. Waktunya memberi efek...
Menu - Layer - Layer Style - Blending Options...
Centang Drop Shadow dan Inner Shadow

dan

[OK]
Lalu pada pallete - ubah ke mode Multiply


5. Yup Hasilnya...

Hehehe... Tinggal perbanyak aja tetesan airnya... beres dah...

dengan belajar photoshop Hasilnya????? anda bisa mengutak-atik lagi dan ini hasil dari penulis

Pantai yang indah... Hawaiii.... kapan bisa berlibur ke situ??? ;P

Selamat Mencoba...
dan Semoga Bermanfaat...

Gonta Ganti Warna Rambut Sesuka Hatimu

Publish: 2 Mei 2008 | Author & Copyright: Irvan | Status: FREE tutorial

Tutorial kali ini kita akan mencoba editing pada warna rambut.. kita dapat mengganti warna rambut sesuai dengan suasana hati...ada yang perlu kamu ingat, tidak semua warna rambut bisa dirubah, biasanya warna hitam polos sulit untuk diwarna kecuali rambut tersebut memiliki higlight…

ini dia Langkah - langkahnya photoshop tutorial :
1. Buka File gambar diatas dengan Photoshop:

Kamu bisa donlot disini : http://wallpaperstock.net/alexis-bledel-wallpapers_w5529.html 2. Seleksi bagian rambut pada gambar menggunakan POLYGONAL LASSO TOOL


3. Klik pada Menu SELECT > FEATHER (isi Feather Radius : 10 px ) OK

4. Klik Menu IMAGE > ADJUSTMENTS > VARIATIONS

Kamu tinggal klik pada salah satu warna atau lebih untuk mendapatkan warna yang seseuai…klik ORIGINAL untuk mengembalikan pada warna asli gambar….
Selamat Mencoba dan Jangan Lupa Komentarnya…

LinkWithin

Related Posts Plugin for WordPress, Blogger...