Showing posts with label twitter. Show all posts
Showing posts with label twitter. Show all posts

Sunday, May 19, 2013

Cara Memasang Widget Melayang Share Button Facebook, Twitter dan Google di Blog


Kreasi | Informasi | Beberapa hari ini saya blogwalking  ke sebuah blog, dan saya melihat sesuatu yang unik di blog sahabat tersebut. Saya menemukan widget melayang share botton facebook, twitter dan google. Kemudian saya mencoba memasangnya, karena widget ini akan memudahkan pengunjung blog kita untuk menshare apa yang ada di blog kita. Dan hal ini juga akan berdampak positif bagi blog kita. Ini bisa menjadi media marketing gratis buat para blogger, untuk itu saya akan share kepada para sobat blogger sekalian tentang cara membuat widget melayang share botton

Berikut cara pemasangannya :




  1. Login ke akun blog anda
  2. Pilih rancangan=>>tambah gadget
  3. Pilih Html/Java script
  4. Copy kode Html di bawah ini
  5. Pastekan di Html/ Java Script tadi
  6. Simpan/save
  7. Selesai

Kode Widget Share button melayang

<!--Widget Share Button Melayang Start-->


<style>

#pageshare {position:fixed; bottom:15%; right:10px; float:left; border: 1px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#eff3fa;padding:0 0 2px
0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style>
<div id='pageshare' title="bagikan ke teman anda">
<div class='sbutton' id='gb'><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class='sbutton' id='rt'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></div>
<div class='sbutton' id='gplusone'><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class='sbutton' id='su'><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<div class='sbutton' id='digg' style='margin-left:3px;width:48px'><script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script><a class="DiggThisButton DiggMedium"></a></div>
<div class='sbutton' id='fb'><a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script></div><br/><div style="clear: both;font-size: 9px;text-align:center;"><a href=http://gedesitdownblog.blogspot.com/2013/05/cara-memasang-widget-melayang-share.html" target="blank" title="Cara Memasang Widget Share Button"><font color="blue">[Get Widget]<font></font></font></a></div></div>


<!--Widget Share Button Melayang End-->



Penting : untuk tulisan warna hijau anda dapat mengeditnya sesuai keinginan anda. Dan tulisan warna merah bisa anda hapus jika anda ingin tampilan yang sederhana. Hasilnya bisa anda lihat seperti gambar di atas postingan ini.

Demikian informasi tentang cara memasang widget melayang share button facebook, twitter, google, stumbleupon dan digg sebagai kreasi pada blog, khususnya di blogspot. Selamat mencoba, semoga bermanfaat!



                                                                             

Sunday, March 24, 2013

Cara Membuat atau Memasang Followers Twitter's Box di Blog

Inspirasi | Selamat siang sobat...setelah agak lama blogroll di blog sahabat, akhirnya saya menemukan artikel ini ; cara membuat kotak followers twitter di blog-mu.... nah.. kotak follower ini nantinya akan menampilkan beberapa follower kita, tombol follow dan jumlah follower kita. Kurang lebih hasilnya akan seperti ini :

Langsung ke tutorialnya.. cekidot :
  • loggin ke blog kalian masing-masing
  • pilih rancangan
  • pilih tambah gadget ---> lalu pilih menu html/javascript
  • masukkan kode dibawah ini, di kotak yang disediakan
<iframe name="fbfanIFrame_0" allowtransparency="true" src="http://s.moopz.com/connect.html?user=nofalsama77" class="FB_SERVER_IFRAME" style="width: 300px; height: 250px; border-style: none;" frameborder="0" scrolling="no"></iframe><script type="text/javascript">fanbox_init("nofalsama77");</script>
keterangan :

  • ganti ID twitter yg berwarna merah, dengan ID twitter sobat !
  • ganti lebar ( width: 300px ) dan tinggi ( height: 250px ) dengan selera sobat 
tinggal di save !!!
---sekian--- selamat mencoba, semoga berhasil--- :)

Saturday, March 16, 2013

Cara Memasang Burung Twitter di Blog

Kreasi | Selamat sore sobat...Kali ini kita akan bahas bersama, cara membuat / memasang widget burung Twitter terbang di Blog ini yang saya namakan Gede Sitdown Blog.  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 seperti saya in, hehehe.... 

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.
Okay tanpa panjang lebar mari kita kupas bersama-sama cara memasang widget di bawah 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/AVvXsEhGnArpE_Il8jyCUM3SyY63e3t48fF415q4W-fQt3PeKImxrKjkzmHj1L2QVQR4pZva-w1cMUECdakLr53J7tfyM0ccjH5WHrPIhPmjHkTVFWw5hzCcZzKVogZzu_x9LKJY8-WnIPPxBgc/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://bloggerpeer.blogspot.com/";
tripleflapInit();
</script>

  • Ganti kode yang berwarna biru dengan nama pengguna (username) akun Twitter sobat
  • Simpan dan lihat hasilnya

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/AVvXsEhxCTFUWOYHP2Cpwunvlz10h7LQyKkmhPf3SF9ZBOrj-aEjs4RBcLPTEqRu8TUQcbpPOiKevCVS7rnrsL42DE0sDfTNWJv0w2mLyNGaMSSA0_GjrvCtkPM_mOf4aq57gtAsb6PkEosemVM/s1600/yellow+bird.png
Warna Hitam
  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvZxgFgVwIIXYsCQgkgwoFprT4JTYMO3FzKs8_pgcBXZadZ-nItmCd_M-VHW_FrYlqJ2zFHtNTPGoZjyvK40_YeORSkNr3HCdd8DewvqnwbChuVyyojm9gRJVs8XA7N7isvFESaCdyd8c/s1600/black+bird.png
Warna Biru
  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2yKvUEgIcAmSPfWKKILR4GnkBd7VZ0lTL1zQWOReW863l_lybj0i0IBbFmLXKTdC0IQoNO38q83DBI_OepT0-OsQ2l5Tb5L-DYOHfgeXjVBirPPaA_oDgpOzJQReok2QXdgviNTdIQ5k/s1600/Blue+bird.png
Warna Coklat
  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhzuksA-eDsWl0dw2pckmWY_yppuS4q0Cl3kMIq56z73HONhbZQSR7J_e3ftIY_76XJiBiRENZMjOvI6tVngcEZ8mPLSE9wvu7ggezME_JciLiaoqxUmd1z0m88exdZDgNuxfjYDuYFQs/s1600/brown+bird.png
Warna Hijau
  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbYsPj6RU1ubqNZ3T4aEsWMa1QfNjxzug0pLNNcSYF1Od2ymeZxMtiNslzmSkseRKQJGFyH55Ski1UrXvj1a3Xl8EXUIdHzPzQBCkqG4yYnWuCRLCXfj9a7AQmqOmtc_US9lxXRPPfUUM/s1600/Green+bird.png
Warna Ungu
  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY4FqpNW0x4v5LJdVZxxLjsPnE6CN3A_Hk0gqP2tIVGs5MAlrKhzfaVYilrWj6xuxf8EJ-gqlunVzB5oLpmWqBF37zlbaKeiSloT_8kcmQ-7tVpSpNYyOAXX2h2XRrErNlNJmTbuUEr38/s1600/purple+bird.png
Warna Putih
  • https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjY6n3Vf1nAeppYUsq2K9F9kEHTYdHkcLVxuYFO3nZHlsS3g12SBYe63oYI0aCS7DqFMfxIB_ODAbNNhB1yInDvZxij1tfIDyunP1b4fyOz9Fflm8O3VEarqpsKtz_cH5R5SnPO8ZiZp64/s1600/white+bird.png
Warna Merah

Disqus Shortname

Ad Inside Post

Comments system