Showing posts with label Widget Blog. Show all posts
Showing posts with label Widget Blog. Show all posts

Wednesday, 6 February 2013

Cara Membuat Twitter Badge Pada Blog

Leave a Comment
 Cara Membuat Screen Saver Pada Blog itu lah yang akan saya bahas pada artikel saya kali ini.
Disini saya akan memberikan tips untuk Membuat Twitter Badge Pada Blog dalam dua versi.
versi pertama yaitu dengan memakai kode HTML. Trik kali ini saya buat dengan bantuan teman - teman sesama programmer.




Cara Membuat Twitter Badge Di Blog

  • Masuk ke Dasbor
  • Rancangan
  • Elemen Laman
  • Tambah Gadget
  • HTML/Java Script
  • Copy-kan kode berikut :
<!-- twitter follow badge by upik's media -->
<script src='https://sites.google.com/site/luthfansite/Twitter.js' type='text/javascript'></script><script type='text/javascript' charset='utf-8'><!--
tfb.account = 'saya_programmer';
tfb.label = 'follow-us';
tfb.color = '#00bff3';
tfb.side = 'l';
tfb.top = 200;
tfb.showbadge();
--></script>
<!-- end of twitter follow badge -->

Catatan :
  •  Ganti saya_programmer , Dengan Username Twitter Anda ( Tanpa @ )
  •  Ganti follow-us , Dengan Kode :
  • follow-us , Hasilnya " Follow us "
  • follow-me , Hasilnya " Follow me "
  • follow , Hasilnya " Follow "
  • my-twitter , Hasilnya " My twitter "
  • Ganti #00bff3 Untuk Background Badge , Dengan Kode Warna Anda
  • Ganti l Untuk Letak Badge . Kode " l " Untuk Kiri Blog , Kode " r " Untuk Kanan Blog
  •  Ganti 200 , Untuk Ukuran Badge Anda Terhitung Dari Bagian Atas Blog
Lalu Klik Save Atau Simpan :D

 
Read More...

Thursday, 31 January 2013

Membuat Efek Zoom Gambar Saat Dilalui Cursor

Leave a Comment

Cara Membuat Efek Zoom Gambar saat Dilalui Cursor , masih sengit persaingan di Bisnis Online Daftar Gratis Bonus jutaan Rupiah yang baru berlangsung 1 minggu, tapi dengan adanya itu menambah kesibukan saya buat postingan, baik saya langsung aja jelasin Cara Membuat Efek Zoom Gambar saat Dilalui Cursor berikut :



Login ke Blogger
Pilih rancangan --> Edit HTML --> Centang Expand.
Kemudian letakkan CSS berikut diatas kode ]]></b:skin>


.upiksmedia img{
-webkit-transform:scale(0.3); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.3); /*Mozilla scale version*/
-o-transform:scale(0.3); /*Opera scale version*/
-webkit-transition-duration: 9.9s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
opacity: 0.7; /*initial opacity of images*/
margin: 0 10px 5px 0; /*margin between images*/
}

.upiksmedia img:hover{
-webkit-transform:scale(1.2); /*Webkit: Scale up image to 1.2x original size*/
-moz-transform:scale(1.4); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/
box-shadow:0px 0px 30px blue; /*Kode Css3 untuk efek shadow*/
-webkit-box-shadow:0px 0px 30px blue; /*Untuk safari*/
-moz-box-shadow:0px 0px 30px blue; /*Untuk Mozilla*/
opacity: 1;
}
Kemudian Save Template.

Untuk memanggilnya anda bisa memberikan perintah berikut :
 <div class="upiksmedia">
<img src="ULR GAMBAR ANDA"/>
</div>
Untuk peletakkan anda bisa letakkan di sidebar ataupun dipostingan,silahkan dikreasikan sendiri kode dan eefk"nya .
 
Read More...

Popup Facebook Like Box Dengan Timer CountDown Untuk Blogger

1 comment
Widget Popup Facebook Like Box adalah widget yang dilengkapi dengan timer atau waktu dengan 4 skin gambar yang berbeda-beda. Kotak like box popup ini akan muncul ketika halaman blog dibuka dan dirancang untuk tidak muncul kedua kalinya jika pengunjung sudah mengklik like atau suka pada box tersebut serta dilengkapi dengan tombol close pada sudut kanan atas.

Widget like box yang satu ini sangat berbeda dari widget like box facebook melayang karena like box melayang akan selalu muncul pada saat halaman dibuka atau direload. Berbeda dengan like box fans page facebook popup dengan timer yang dirancang khusus dan dilengkapi dengan timer untuk menutup sendiri pada saat countdown timernya sudah habis serta dilengkapi dengan script atau fitur pembaca cookies pada browser sehingga membuat like box yang satu ini tidak akan muncul untuk kedua kalinya jika like atau suka pada box tersebut sudah di klik.

Popup Facebook Like Box Dengan Timer CountDown Untuk Blogger


Setelah melihat demo di atas, mungkin sobat tertarik untuk memasangnya pada blog sobat dan jika iya, berikut kode dan cara meletakkan kode tersebut ke dalam template :
  • Login ke Blogger
  • Pilih Template » Edit HTML » Centang Expand Template Widget
  • Copy kode di bawah ini dan pastekan tepat di atas tag </body>
<!-- Upik's Media Likebox Facebook Code Start -->
<style>
#fblikepop { background-color: #fff; display: none; position: fixed; top: 200px; _position: absolute; width: 450px; border: 10px solid #6F6F6F; z-index: 200; -moz-border-radius: 9px; -webkit-border-radius: 9px; margin: 0pt; padding: 0pt; color: #333333; text-align: left; font-family: arial,sans-serif; font-size: 13px;}
#fblikepop body {background: #fff none repeat scroll 0%; line-height: 1; margin: 0pt; height: 100%;}
.fbflush { cursor: pointer; font-size: 11px !important; color: #FFF !important; text-decoration: none !important; border: 0 !important;}
#fblikebg { display: none; position: fixed; _position: absolute; height: 100%; width: 100%; top: 0; left: 0; background: #000000; z-index: 100;}
#fblikepop #closeable { float: right; margin: 7px 15px 0 0;}
#fblikepop h1 { background: #6D84B4 none repeat scroll 0 0; border-top: 1px solid #3B5998; border-left: 1px solid #3B5998; border-right: 1px solid #3B5998; color: #FFFFFF !important; font-size: 14px !important; font-weight: normal !important; padding: 5px !important; margin: 0 !important; font-family: &quot;Lucida Sans Unicode&quot;, &quot;Lucida Grande&quot;, sans-serif !important;}
#fblikepop #actionHolder {height: 30px;overflow: hidden;}
#fblikepop #buttonArea {background: #F2F2F2;border-top: 1px solid #CCCCCC;padding: 10px;min-height: 50px;}
#fblikepop #buttonArea a {color: #999999 !important;text-decoration: none !important;border: 0 !important;font-size: 10px !important;}
#fblikepop #buttonArea a:hover {color: #333 !important;text-decoration: none !important;border: 0 !important;}
#fblikepop #popupMessage {font-size: 12px !important;font-weight: normal !important;line-height: 22px;padding: 8px;background: #fff !important;}
#fblikepop #counter-display {float: right;font-size: 11px !important;font-weight: normal !important;margin: 5px 0 0 0;text-align: right;line-height: 16px;}</style>
<script src='http://www.google.com/jsapi'/><script>google.load(&quot;jquery&quot;, &quot;1&quot;);</script>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
 kakinetworkdotcom01username="Upik's Media",
 kakinetworkdotcom01title="Join us at Facebook!",
 kakinetworkdotcom01skin="01",
 kakinetworkdotcom01time="15",
 kakinetworkdotcom01wait="0",
 kakinetworkdotcom01lang="en"
//]]>
</script>
<script src='https://sites.google.com/site/luthfansite/Facebook.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
 $(document).ready(function(){$().kakinetworkdotcom({ closeable: true });});
//]]>
</script>
<!-- Upik's Media Likebox Facebook Code End --> 

Keterangan :
  • Upik's Media : Ganti dengan username fans page facebook yang sobat punya
  • Join us at Facebook : Silahkan disesuaikan
  • kakinetworkdotcom01time="15" : adalah waktu (seconds/detik) yang diperlukan sampai popupnya tertutup sendiri
  • Skin ="01" : Ganti dengan kode skin yang lain (01, 02, 03, 04). Contoh skinnya ada di bawah ini :
SKIN "01"
Cara Membuat Facebook Like Box Popup Dengan Timer Pada Blog

SKIN "02"

Cara Membuat Facebook Like Box Popup Dengan Timer Pada Blog

 SKIN "03"

Cara Membuat Facebook Like Box Popup Dengan Timer Pada Blog

SKIN "04"

Cara Membuat Facebook Like Box Popup Dengan Timer Pada Blog

  • Langkah terakhir, simpan template sobat...!!!
Semoga artikel kali ini bermanfaat dan jika ada saran ataupun kekurangan dari tutorial ini, mohon memberikan komentar di bawah. Terima kasih dan happy blogging...!!!
Read More...

Tuesday, 22 January 2013

Cara Membuat Screen Saver Pada Blog

Leave a Comment
Cara Membuat Screen Saver Pada Blog itu lah yang akan saya bahas pada artikel saya kali ini.
Disini saya akan memberikan tips untuk Membuat Screen Saver Pada Blog dalam dua versi.
versi pertama yaitu dengan memakai kode HTML. Trik kali ini saya buat dengan bantuan teman - teman sesama programmer.



Cara Membuat Screen Saver Pada Blog

  • Masuk ke Dasbor
  • Rancangan
  • Elemen Laman
  • Tambah Gadget
  • HTML/Java Script
  • Copy-kan kode berikut :
  <script type="text/javascript" src="https://sites.google.com/site/luthfansite/screen_upik.js"></script><style type='text/css'>div#energysaving, div#energysaving * { -moz-border-radius: 0; -webkit-border-radius: 0; border: 0; background: url(http://4.bp.blogspot.com/-i7sbf0snwiE/UP51MhfgWKI/AAAAAAAAA2Q/fKesEqyqa4o/s1600/screensaver.jpg) no-repeat center center fixed black; }div#energysaving p span {display:none;visibility:hidden;}</style> <br>
  • Klik Simpan / Save.

NB :
Gantilah kode yang berwarna merah dengan Url gambar screen saver anda.
Screensaver akan muncul setelah kurang lebih 25 detik tanpa aktivitas.
Read More...

Tuesday, 1 January 2013

Membuat Kotak Komentar Blogger Di Bawah Postingan

Leave a Comment
Akhirnya datang juga....
Setelah lama ditunggu-tunggu oleh para penggemar setianya, akhir blogger/blogspot menerbitkan juga comment box atau kotak komentar yang langsung muncul berada dibawah postingan. Kalau dulu hanya berupa link "Post a Comment", maka yang sekarang lain, yg sekarang kotak komentarnya langsung muncul persis dibawah postingan (seperti kotak komentar dibawah ini). Dengan adanya kotak komentar yang seperti ini, akupun rela mengganti kotak komentarku yang dulu (haloscan) dengan comentbox yang ini. Walaupun kotak komentar ini masih dalam draft tapi sudah bisa dinikmati.

Begini nih cara membuat kotak komentar blogger yang berada dibawah postingan.

1. Login ke http://draft.blogger.com, Ingat yang http://draft.blogger.com bukan blogger.com.
2. Trus ke menu Setting-->Comments. Kemudian ganti "Comment Form Placement" menjadi "Embedded below post" (lihat gambar dibawah)



3. Kemudian klik "Save Setting"

Sekarang coba kamu lihat blogmu dan coba di klik salah satu postinganmu kemudian lihat hasilnya, apakah sudah ada kotak komentarnya yg dibawah postingan atau belum. kalau sudah berarti langkahnya cukup disini. Kalau belum ikuti langkah berikut ini.
(ini karena kode HTML tiap2 template itu berbeda. Untuk template default dari blogger yang baru, kode HTMLnya sudah berubah, sedangkan template yg lama atau ambil dari luar ada yg belum dan ada juga yg sudah).

4. Selanjutnya pergi ke menu "Layout-->Edit HTML"
5. Beri tanda centang kotak "Expand widget templates".
6. Trus cari kode berikut ini :


<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a>
</p>
</b:if>
7. Kemudian ganti kode tersebut dengan kode dibawah ini:
<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/> <b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a>
</b:if> </b:if> </p> </b:if>
8. Lalu simpan template kamu.

Lihat deh hasilnya, coba kamu klik salah satu postingan kamu, maka dibawahnya akan muncul kotak komentar seperti punyaku ini (Bagi yang berhasil)

Read More...

Highlight Pada Script / Kode Di Postingan

Leave a Comment
Memberikan Highlight untuk script atau kode pada postingan akan lebih memperjelas pembaca. Contohnya bisa kamu lihat pada blogku ini. Setiap kali ada script/kode maka akan selalu ada highlight (kotak) yg akan membedakan dengan tulisan yg lain. Nha kamu mau tahu cara pembuatamnya?

Gini nih caranya :
1. Login ke blogger lalu pilih Layout-->Edit HTML
2. Kemudian copy kode dibawah ini lalu pasang di Script CSS kamu atau pasang sebelum kode ]]></b:skin>

.alert { background: #DDE4FF;
text-align: left;
padding: 5px 5px 5px 5px;
border-top: 1px dotted #223344;border-bottom: 1px dotted #223344;border-left: 1px dotted #223344;border-right: 1px dotted #223344;}
Kode yang berwarna merah (#DDE4FF) adalah warna background kotak highlight, kamu bisa menggantinya dengan kode warna yang lain yang cocok dengan background blog kamu. Untuk kode-kode warna bisa dicari di google.

3. Kalau sudah kemudian Simpan.

Cara Posting
Supaya kode/scriptnya nanti bisa ada kotak highlight-nya maka untuk memposting harus pake cara2 tersendiri. Yaitu dengan menambahkan kode ini <p class="alert"> sebelum kode/script yg akan diberi highlight. kemudian ditambahkan kode </p> diakhir script/Kode.

Dah gitu aja, gampang kan

Read More...

Cara Memasang Animasi Flash Di Blog

Leave a Comment
Untuk memasang flash ke dalam blog cukuplah mudah. Yang kamu perlukan yaitu file flash yang biasanya ber-extensi .swf lalu upload file tersebut ke hosting. misal di geocities.com ato 000webhost ato tempat hosting lainnya. File animasi flash tersebut bisa dijadikan hiasan pada blog ato bisa juga dijadikan hiasan di header sehingga membuat blog menjadi lebih animatif. Untuk memasang flash pada blog caranya sebagai berikut :

1. Login ke blogger kemudian pilih menu "Layout".
2. Kemudian klik link "Add a gadget" dimana akan ditempatkan animasi flash.
3. Pilih "HTML/Javascript" kemudian taruh script berikut :


<embed src="http://blogoholic.info/wellcome.swf" quality="high" bgcolor="white" width="500" height="100" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi? P1_Prod_Version=ShockwaveFlash"></embed>
CONTOHNYA :

* Ganti "http://blogoholic.info/wellcome.swf" dengan alamat file flash kamu yang telah ditaruh di hosting. * Ganti width="500" height="100 dengan ukuran dari file flashmu.
Read More...

Thursday, 6 December 2012

Cara Memasang Widget Translate Bahasa Pada Blog

Leave a Comment
Memasang translete pada blog sangat perlu karena mungkin saja ada pengunjung dari negara asing yang nyasar keblog anda, tapi yang harus diperhatikan agar tidak terjadi kesalahan translate maka blog anda harus menggunakan bahasa yang resmi, bukan bahasa pasaran atau gaul.
Nah caranya ikuti langkah-langkah berikut:
  • Seperti biasa sig in dulu ke blogger.
  • Masuk/ klik tombol layout/ tataletak.
  • Klik tombol elemen halaman/ page elemen=>tambah gadget=>HTML/ Java script
  • Beri nama/ isi titel dengan kalimat translate atau dengan kalimat yang anda sukai. Kemudian  Untuk Tampilan Pertma seperti berikut:
Google Translate Bendera

Copy kode berikut dan paste dikolom HTML/ Java Script.

<style>
.google_translate img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
border:0;
}
.google_translate:hover img {
filter:alpha(opacity=30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
.google_translatextra:hover img {
filter:alpha(opacity=0.30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
</style>
<div>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMN7-hEl0ko6i81COdUmOHUkrgvrQAyXGb9S-NZ3nHqo7Urb6QWjifJSNXS1PEPJdyDpzNXwRhNIzKn95fEaQ7EY4DarANp7KnCrKVjFDJy5NWYplXO4KFN0MRNmaSsK0sEhM9SdhF0YI/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNODrxtWaZfDwIxnAeGjw6s2BahuYC_A7F4wwf9xrVCDMMDh3D0LMNs1xbszfYpEnK2qU1ARDMeo-fFqXjUtcHTWLHTUu-lAuTUvSGloz5yoQsn2JoJmT29zushIVz0Ydjqd80XgHW14M/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJzjx2vHZomW09DYOmWTBEcsAzpnQIyGAiHqr3kh6cpr-DdLSnFwhuFpnfM8GhBOLSjSW5ha8S5AuElcKN-QvpoQ2ZK1n08HWfW9WUwsW3WUlH2VNJavT-WyfW0BuMAyHxKWSNTYUKvdLa/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiz3vmoJ59t39iLFx80rncU-eIJXczVykVeoPhmKxMzlt9HHTpOXXnHQnjI8zJKKfo-rejlS8dBxAntj9YmNbHClUD-XhqT0U5FtfBSuggfEXZM5dLQO4pPbzD8Im4ejgZorm6kzpv-Nvw/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXubUQ1mRI5HQjnToGgWHnKD8uZTPL-6ioms8nfNjWfDGN9VmefTtrwJwSFgI_l1_ZdyNooNmd4ARMF8fk_H2t7YcHsZEqzQ8Dw3eHe2J4FAgyx2K3QSIVr4uYKoOCAu82aXhBUS4ObgY/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO-qsmFwjJ-Qz0xSUVzJAuQTDWL2-3oors7RmVeWnvoYp6Dhoh1RPdoZYegKYOVMIHztmVfVCBb5hLeO71KcDRNaAzJ7dCu_6kds5vf9c8KRAmuSU7-6q6Oc1qzzJilnm4MJW2JUiPrK4/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<br /><br />
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMUDMNLDhE7txz3_XnguI7tMzFR8suUdS1tjRYIJgl8YsqkNgE0PIyMABHLfLYLkoguH_rLe_px-gQRYbXkBed4Uu5CIAX5zj5qUNQq8RIselucik-0FGDCrog_mPFy0yohaw6TqbtHks/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKjRchYCu_oYJvhQLORCo0mAd-uyBPtCnoafB2puZXRsxX5HQmIOJdxeZVZ_gZC9EwGQqNt9OP81v4U_bpr7BWKoDTZDu_t6KBo-X5JNtb5DQSQSXfA1LicvwzXLPZzijkNtu1a67FcqA/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk3q2EnQDfRAmbrNLUXveOMBS6i4mMIwO-ijmjUXMOD_uwzT5UvINg4HSFoKWauKz84BWmwqwanBLAyKXCmK6k54jZSujdMnv-g2JC5JvPiSIP5GwqB3Gy2_LVj2TEAP-ISv3ya8hDu9X4/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiOkzpdRsnX_HHwtdwepe1_Q-IXlzb6VwuVd7jTKvfAUVDdjQhZyEDyO5fPNBgP6HhUlb4JIvFSdXsc2Xm6F2OOFCoD-Z-yHtjrrLr5Z79UGGVIWa94gIeOYHooSHGj1jvnIGzdESdMd4/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjBRAurL3LsHrU0aympUMSDnyqB8HnjZMQmqA0My1EW1zHSmf9nkmbnpPES5KJB7ZbkrRPYkWtF4Gjj_BYYogDj7C1vKMTl6dDAXmhIOC64hDwJ3L3keoce6UvTz9k_1lQdqnWvDOVfnk/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeCJzMQ5WvDcNmRJghEJcHtbjMKifKtXYeRwjss4-eOXHg7H131yRos8cnMSw3c9yodbJtah6x6fWybOO4ZatPAeBP1QQOO106v2DtzlCaMlPb3WTm4Uxq8FdNkv-Us15z9gjrM5kXg3Y/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
</div> <div style="font-size:90%; text-align:right; text-shadow:2px 2px 2px #adadad;"><a href="
http://reseprahasiablogger.blogspot.com/2012/12/cara-memasang-widget-translate-bahasa.html" target="_blank" title="Google Translate">Get This Widget</a></div>

------------------------------------------------------------------------------------------------------------


Untuk tampilan kedua seperti berikut ini:

Google Translate Bendera

Copy kode berikut dan paste dikolom HTML/ Java Script.


<style>
.google_translate img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
border:0;
}
.google_translate:hover img {
filter:alpha(opacity=30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
.google_translatextra:hover img {
filter:alpha(opacity=0.30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
</style>
<div>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMN7-hEl0ko6i81COdUmOHUkrgvrQAyXGb9S-NZ3nHqo7Urb6QWjifJSNXS1PEPJdyDpzNXwRhNIzKn95fEaQ7EY4DarANp7KnCrKVjFDJy5NWYplXO4KFN0MRNmaSsK0sEhM9SdhF0YI/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNODrxtWaZfDwIxnAeGjw6s2BahuYC_A7F4wwf9xrVCDMMDh3D0LMNs1xbszfYpEnK2qU1ARDMeo-fFqXjUtcHTWLHTUu-lAuTUvSGloz5yoQsn2JoJmT29zushIVz0Ydjqd80XgHW14M/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJzjx2vHZomW09DYOmWTBEcsAzpnQIyGAiHqr3kh6cpr-DdLSnFwhuFpnfM8GhBOLSjSW5ha8S5AuElcKN-QvpoQ2ZK1n08HWfW9WUwsW3WUlH2VNJavT-WyfW0BuMAyHxKWSNTYUKvdLa/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiz3vmoJ59t39iLFx80rncU-eIJXczVykVeoPhmKxMzlt9HHTpOXXnHQnjI8zJKKfo-rejlS8dBxAntj9YmNbHClUD-XhqT0U5FtfBSuggfEXZM5dLQO4pPbzD8Im4ejgZorm6kzpv-Nvw/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXubUQ1mRI5HQjnToGgWHnKD8uZTPL-6ioms8nfNjWfDGN9VmefTtrwJwSFgI_l1_ZdyNooNmd4ARMF8fk_H2t7YcHsZEqzQ8Dw3eHe2J4FAgyx2K3QSIVr4uYKoOCAu82aXhBUS4ObgY/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO-qsmFwjJ-Qz0xSUVzJAuQTDWL2-3oors7RmVeWnvoYp6Dhoh1RPdoZYegKYOVMIHztmVfVCBb5hLeO71KcDRNaAzJ7dCu_6kds5vf9c8KRAmuSU7-6q6Oc1qzzJilnm4MJW2JUiPrK4/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMUDMNLDhE7txz3_XnguI7tMzFR8suUdS1tjRYIJgl8YsqkNgE0PIyMABHLfLYLkoguH_rLe_px-gQRYbXkBed4Uu5CIAX5zj5qUNQq8RIselucik-0FGDCrog_mPFy0yohaw6TqbtHks/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKjRchYCu_oYJvhQLORCo0mAd-uyBPtCnoafB2puZXRsxX5HQmIOJdxeZVZ_gZC9EwGQqNt9OP81v4U_bpr7BWKoDTZDu_t6KBo-X5JNtb5DQSQSXfA1LicvwzXLPZzijkNtu1a67FcqA/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk3q2EnQDfRAmbrNLUXveOMBS6i4mMIwO-ijmjUXMOD_uwzT5UvINg4HSFoKWauKz84BWmwqwanBLAyKXCmK6k54jZSujdMnv-g2JC5JvPiSIP5GwqB3Gy2_LVj2TEAP-ISv3ya8hDu9X4/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiOkzpdRsnX_HHwtdwepe1_Q-IXlzb6VwuVd7jTKvfAUVDdjQhZyEDyO5fPNBgP6HhUlb4JIvFSdXsc2Xm6F2OOFCoD-Z-yHtjrrLr5Z79UGGVIWa94gIeOYHooSHGj1jvnIGzdESdMd4/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjBRAurL3LsHrU0aympUMSDnyqB8HnjZMQmqA0My1EW1zHSmf9nkmbnpPES5KJB7ZbkrRPYkWtF4Gjj_BYYogDj7C1vKMTl6dDAXmhIOC64hDwJ3L3keoce6UvTz9k_1lQdqnWvDOVfnk/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeCJzMQ5WvDcNmRJghEJcHtbjMKifKtXYeRwjss4-eOXHg7H131yRos8cnMSw3c9yodbJtah6x6fWybOO4ZatPAeBP1QQOO106v2DtzlCaMlPb3WTm4Uxq8FdNkv-Us15z9gjrM5kXg3Y/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
</div>
<div style="font-size:90%; text-align:right; text-shadow:2px 2px 2px #adadad;"><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasang-widget-translate-bahasa.html" target="_blank" title="Google Translate">Get This Widget</a></div>

---------------------------------------------------------------------------------------------------------------

  • Save widget anda anda . Semoga bermanfaat!
Read More...

Cara Memasang Widget CCTV Di Blog

2 comments
Para sobat blogger tau kan apa itu CCTV? Iya semacam kamera pengintai gitu dehh.. , :D. Nah trus apa hubungannya cctv sama blog?? Kali ini akan saya jelaskan cara membuat cctv di blog .  Tapi perlu di ingat cctv ini  tidak berfungsi layaknya cctv yang asli, dengan kata lain tidak bisa merekam semua kejadian yang terjadi di dalam blog anda seperti layaknya cctv yang asli..hhehe..

INI CONTOHNYA :

Langsung saja , langkah-langkah cara membuat cctv di blog sebagai berikut :

1 . Buka akun Blogger anda ---> tambah widget ---> html / javascript
2 . Kemudian masukan kode berikut :
  
 *JANGAN SALAH COPY YA*

3.Lalu Klik Save Dan Lihat Hasilnya Di Blog Kalian !!!
   ~ GOOD LUCK~

Read More...

Wednesday, 5 December 2012

Cara Memasang Menu Accordion di Blog

Leave a Comment
Cara Memasang Menu Accordion di Blog - Cara Memasang, Membuat atau Membikin Menu Accordion di Blogspot ini adalah re-post dari posting lawas saya yang berjudul cara membuat menu accordion blogger yang nggak masuk ke hatinya om gugel. Karna itu diharapkan mudah - mudahan dengan Re-post ( posting ulang ) ini, artikel saya yang telah saya hapus tersebut bisa terindeks lagi meskipun dengan URL yang berbeda.

Menu Accordion adalah berupa susunan menu yang di susun secara vertikal, tentulah berbeda sekali dengan menu horisontal ( baca : cara membuat menu horisontal di blog )yang biasa sobat jumpai, mungkin ini adalah salah satu solusi menyembunyikan widget yang terlalu banyak di halaman blog sobat.  Sobat yang tertarik pasang menu accordion di blogger, silahkan ikuti tutorial berikut.

1. Logi ke akun blog sobat.
2. Klik rancangan --> Edit HTML
3. Kemudian letakkan kode berikut di atas kode ]]></b:skin>

#acc{background:#666;font:13px trebuchet ms;
line-height:1.2em;padding:10px;margin:0;}
#acc h3{background:-moz-linear-gradient(top,#ccc,#999);padding:5px 10px;margin:0;color:#222;
text-shadow:0px 1px 1px #fff;
border-bottom:2px solid #444;}
#acc h3 a{color:#555}
#acc h3 a:hover{color:#000}
#acc .post{background:#fff;color:#000;padding:10px;margin:10px 0px;display:none;
border-bottom:2px solid #222;}
#acc :target h3 + .post {display:block;height:150px;overflow:auto;}
#acc :target h3 a{color:#aa5500}


4. Klik save template dan kita akan menuju ke penambahan gadget.
5. Klik Rancangan --> Elemen laman--> Tambah gadget--> Pilih HTML/Javascript
6. Masukkan kode berikut ke dalam kotak yang di sediakan.
-----------------------------------------------------------------------------------------------------

<div id="acc">
<div id="isi1">
<h3><a href="#isi1">Judul 1</a></h3>
<div class="post">

Masukkan item anda disini,bisa berupa teks atau widget
</div>
</div>
<div id="isi2">
<h3><a href="#isi2">Judul 2</a></h3>
<div class="post">
Masukkan item anda disini,bisa berupa teks atau widget
</div>
</div>
<div id="isi3">
<h3><a href="#isi3">Judul 3</a></h3>
<div class="post">
Masukkan item anda disini,bisa berupa teks atau widget
</div>
</div>
</div>

-----------------------------------------------------------------------------------------

7. Klik save dan lihat hasilnya... Gimana?? sederhana dan mudah bukan??

SELESAI
Read More...

Tuesday, 4 December 2012

Cara Membuat Burung Twitter Terbang Di Blogspot

Leave a Comment
Cara membuat / memasang widget burung Twitter terbang di Blogger, mungkin trik ini sudah tidak asing lagi bagi sobat dan sudah banyak sekali saya melihat blog yang sudah memasang widget burung Twitter terbang ini dengan berbagai macam style dan warna burung Twitter yang berbeda-beda, sekarang saya akan mengulas kembali khusus buat teman-teman blogger yang baru membuat blog dengan platform blogspot


Memasang Burung Twitter Terbang di Blogspot
Twitter adalah layanan jejaring sosial yang sangat populer sekarang ini selain Facebook dan Google+ dan tidak salah banyak orang yang beramai-ramai untuk menjalin koneksi melalui Twitter apakah itu untuk keperluan bisnis maupun hanya sekedar berteman saja, nah bagi sobat yang mempunyai blog tidak ada salahnya memasang widget burung twitter terbang ini selain membuat blog sobat cantik dan unik, widget ini juga mempermudah sobat untuk menjalin pertemanan baru dengan pembaca blog sobat, hanya dengan sekali klik pada burung twitter yang terbang maka akan otomatis terhubung dengan profile Twitter sobat,
Ok tanpa panjang lebar mari kita kupas bersama-sama cara memasang widget ini

Pertama-tama silahkan login di Blogger

  • Klik Layout > Add Gadget > Html/Javascript
  • Copy paste kode di bawah ini ke kolom Html/javascript
<!-- floating twitter Bird -->
<script type="text/javascript" src="http://bloggerpeer.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjo0F1esNap0cPQiWie8LFQzdK9HbC5diC9_O9Pt9BMvynqQZW-siwdYlsw56GsaImty2mEtIQHPNyCou3TryWbMqheEXHIfXzdf1971dADdRZjkhaVRJXW73O6ITxLz2XEvXfXv6NVIGk/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/Username";
var tweetThisText = "Twitter - UserID http://reseprahasiablogger.blogspot.com/";
tripleflapInit();
</script>

---------------------------------------------------------

Warna Pilihan Burung Terbang Twitter

Rubah Warna Burung Twitter

Untuk membuat warna burung twitter yang lain sobat bisa mengganti kode yang berwarna merah diatas dengan kode-kode dibawah ini sesuai dengan warna pilihan yang sobat inginkan

Warna Kuning

  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMfCmSIbygf1eSiLGyb2r0rc4KDN_toRQt3d2FNpYee2q_c7FDwcGAi1Hogpm6Q3vzigwYpThlcpreE4ROgj2wJtP8XcDrpVHdC4ffCxXeGTz4dh1GWGjOgOF7-_9SRqnyanxqTTrjVMU/s1600/yellow+bird.png
Warna Hitam

  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrAuRA_fu4rw7bFvUq6Ea9bXisMogC9kKAxa23ul5gcOCDK1OeBEFBhOTE0CQipJQSki7qZT9EI61FOFjNsuhKjntzWvia2eemhzk5a9AF9I0jKBsEP9lhPLLRuVZ8SujfFNg-WVlSxO0/s1600/black+bird.png
Warna Biru

  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0tKcvhLi-NNkkplp2nm79mSfwtqttVugs3lb2yxDgWKS20q5arNMsu-gf1E1vvtsT2mkEJz7yHXSbgUJXDJ5rqDRD31PvgRBrnaLZdZu1KRJpt9zYGGT88JZRsYX6s8A80vUiMcmH9Nw/s1600/Blue+bird.png
Warna Coklat

  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgE1BX2SeM1eiPZRAjRHhcC7-_YnCVLsZQ0oBVQ0HI5gKbnVry_vDXce20jahw0bTCFSWt-zeShzlhvdplXKuGoDuQG31LN7o9njfHyvmd2c07kwJXPRSJVG_uWjIZzcvggyNax_-tpGq8/s1600/brown+bird.png
Warna Hijau

  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTnpGevwqabfCkMh9LZyAYSK5B8bP19eF9FfjTaToP87QH1L6jQ7j_gaFYhkS7cfkARO7YIUL3Ecm6B33chl5ybK59tyFtuYDmlqE3p-FJNakMX3zFoHgl7WWfyAhW9ldsCzN-9ri0nSc/s1600/Green+bird.png
Warna Ungu

  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlmL4j0dQxZsvEEezVWqIQ5yzFVy7Azc6KiUA9rbhArROf1JwN5rsPHpgQ2lCQE2iITeb_R4jl56dqUcwi5unpLxHx74JtkHphap-JZgitvasW19B9j6VCtFOWW3QFEcWkFkoYQM1SlB0/s1600/purple+bird.png
Warna Putih

  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgag7zYTXUXvbR6bXY0fFbmHdZGn2wF2tRl0vw40Sor7z3gXamoMa-SwMj566Rq2N0QTPAe8Gj7rJI0TCqfa3dAAa-RnoGUBkxmzSO6eKMcNpHI1vFcBLxy7vbbeylxhaYqmzY6Y4XdkAs/s1600/white+bird.png
Warna Merah

  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy5MnSW_y6QPXat3Gie9Hfrcn_2HqYKc5vs567FmeFAQAyiHpfpkqRdY1KraMf-CWl4N-ZYQYH4Zf6vtSgqeU36c2gu2nAHN2ooHRLLWfjT5qn7ERHCbfSYJodhBdxOFV_jybZ_b-c_lA/s1600/red+bird.png

Dan Terakhir Jangan Lupa Disimpan !!! GOOD LUCK !!!
Read More...

Membuat Animasi Follow Twitter Di Blog

Leave a Comment
Tips-tricks blogger kali ini mau share Widget-widget Follow Me on Twitter Blogspot, yang ternyata tidak cuma dalam bentuk gambar diam aja loh. Curi perhatian pengunjung blogmu dengan "Flash Animated Follow Me Twitter Bird' yang bisa gerak-gerak mengundang perhatian pengunjung.
Ada tiga jenis widget animated twitter bird yang bisa dipake, pilih salah satu, salah tiga juga boleh lah. Nih contohnya:

ANIMASI 1
Scriptnya:

<object data="http://www.buzzbuttons.com/BUTTON6/twitbutton.swf" height="80" type="application/x-shockwave-flash" width="180"><param name="movie"
value="http://www.buzzbuttons.com/BUTTON6/twitbutton.swf" />
<param name="allowscriptaccess" value="always"/><param name="menu" value="false"/><param name="wmode" value="transparent"/>
<param name="flashvars" value="username=SevFBLOG"/><a href="http://www.gamblinginsider.ca" title="gambling">gambling</a><embed src="http://www.buzzbuttons.com/BUTTON6/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="180" height="80" menu="false" wmode="transparent" flashvars="username=SevFBLOG"></embed></object>
ANIMASI 2
Scriptnya:
<object type="application/x-shockwave-flash" data="http://www.buzzbuttons.com/BUTTON3/twitbutton.swf" width="100" height="100"><param name="movie" value="http://www.buzzbuttons.com/BUTTON3/twitbutton.swf"></param><param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param><param name="wmode" value="transparent"></param><param name="flashvars" value="username=SevFBLOG"></param><a href="http://www.gamblinginsider.ca" title="online gambling insider.ca">online gambling insider.ca</a><embed src="http://www.buzzbuttons.com/BUTTON3/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="100" height="100" menu="false" wmode="transparent" flashvars="username= SevFBLOG"></embed></object>
ANIMASI 3
Scriptnya:
<object type="application/x-shockwave-flash" data="http://www.buzzbuttons.com/BUTTON8/twitbutton.swf" width="200" height="200"><param name="movie" value="http://www.buzzbuttons.com/BUTTON8/twitbutton.swf"></param><param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param><param name="wmode" value="transparent"></param><param name="flashvars" value="username=SevFBLOG"></param><a href="http://www.dreambingo.co.uk/" title="http://www.dreambingo.co.uk/">http://www.dreambingo.co.uk/</a><embed src="http://www.buzzbuttons.com/BUTTON8/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="200" height="200" menu="false" wmode="transparent" flashvars="username=SevFBLOG"></embed></object>
Cara memasang Widget Flash Animated Follow Me Twitter Bird:
1. Masuk ke dashboard > Design/Rancangan > Add/tambah gadget > Pilih HTML/Javascript.
2. Copy salah satu script di atas. Ganti SevFBLOG dengan nama account twitter-mu.
3. Paste ke dalam kotak HTML/Javascript dan save. Posisikan (drag and drop) gadget ke posisi yang diinginkan lalu save lagi.
4. Done!

Read More...

Cara Memasang Gambar Animasi Pada Blog

Leave a Comment
Cara Memasang Widget Animasi Yang Lucu dan Keren di Blog -
Banyak hal yang dapat membuat sebuah blog dikatakan menarik, selain dari isi content atau postingan , ternyata ada hal - hal lain yang bisa membuat si blog terlihat lebih menarik dan tentunya banyak pengunjungnya. Nah selain postingan, disain dan animasi / pernak - pernik blog ternyata dapat meningkatkan performa dari suatu blog.. ga percaya ? cobalah anda berkunjung kesuatu blog yang disainnya polos hanya berisikan artikel saja kemudian bandingkan dengan blog yang berisi postingan menarik dengan disain yang menarik pula . Pasti kita akan lebih betah berlama-lama di blog yang berisi artikel menarik dan disain / animasi yang menarik itu bukan ? tentunya. Dan, memberikan efek animasi di blog itu ga sulit kok, dan pilihan animasinya pun beragam bergantung selera. . nah dibawah ini ada beberapa contoh widget animasi nya. Kalo udah cocok, berikut langkahnya :

 Cara Memasang Widget Animasi Di Blog

1.Copy script yang ingin anda munculkan animasinya
2.Login ke Blog
3.Pilih Rancangan
4.Tambah gedget
5.Pilih edit html atau script,
6.Pastekan script tadi
7.Lalu save.. “pasti akan langsung  muncul animasi yang anda pilih tadi” 

selamat mencoba..

1.helicopter



<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:130px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020389.gif" title="widget animasi lucu bergerak atau gif"  alt="animasi bergerak naruto dan onepiece"/></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

2. Ekspresi muka


<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/742/th/74214.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">Ekspresi</a></center></small></div>
 
3. Kodok mata gede



<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/466/th/46606.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

4 Spiderman


<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/3/th/312.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

5.Pig


 <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/110/th/11046.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

6. Muka senyum



<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/197/th/19769.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

7. monyet


<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/458/th/45845.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

 8.Doraemon


 <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/1031/th/103123.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

9.Spongebob


 <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/1028/th/102882.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

10.Panda

 
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/212/th/21215.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

11.Monyet loncat


<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/539/th/53966.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

12.Anime cewek


<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/228/th/22801.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

13.Saringgan


<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/712/th/71266.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

14.Naruto berubah


<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/656/th/65649.gif" title="My widget" alt="animasi  bergerak gif" /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>

15.Gajah loncat


<div style="position: fixed; bottom: 0px; left: 20px;width:120px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" 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://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">Widget-Animasi</a></center></small></div>

16. Lumba lumba


<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:160px;"><a href="http://reseprahasiablogger.blogspot.com" 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://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">Widget Animasi</a></center></small></div>

17.Kucing tidur


<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:140px;"><a href="http://reseprahasiablogger.blogspot.com" 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://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">Widget Animasi</a></center></small></div>

18.Ayam betelur


<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:130px;"><a href="http://reseprahasiablogger.blogspot.com" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020541.gif" title="Click to get more." /></a><small><center><a href="http://reseprahasiablogger.blogspot.com/2012/12/cara-memasan-animasi-di-blog.html" target="_blank" title="Cara Memasang Widget Animasi">Widget</a></center></small></div>

Read More...