Friday, February 1, 2013

Cara Membuat Kotak Like Facebook Melayang


Cara Membuat Kotak Like Facebook Melayang Diblog ini sebenarnya sedikit jail, maksudnya sifatnya memaksa pengguna mau tidak mau harus melihat dan me-Like halaman kita karena posisinya melayang dan menutupi halaman blog kita. Namun jangan Khawatir, jika pengunjung tidak tertarik untuk me-like-nya juga bisa di close.

Jika tertarik ingin mencoba, silahkan ikuti langkah-langkah membuat Kotak Like Facebook Melayang berikut ini :

  • Login Ke Akun Blogger
  • Kemudian arahkan ke Layout » Add a Gadget » HTML Java Script
  • Silahkan Copy Paste Kode Berikut ini :
<style type="text/css">
#topbar{
position:absolute;
padding-left:260px;
background-color: transparancy;
width: 300px;
visibility: hidden;
z-index: 100;
}
</style>
<script type="text/javascript">
var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session
var startX = 30 //set x offset of bar in pixels
var startY = 5 //set y offset of bar in pixels
var verticalpos="fromtop" //enter "fromtop" or "frombottom"
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<br />
<div class="clear">
</div>
<div id="topbar">
<div style="text-align: right;">
<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeO0EaLWXqTe3YAZCLgjy_fHRRtNCvc3HyFkT08EoSk3pebWy09PqNzCOBlCACY7qnxfEStqAwwWLaw7edI82StZ2NFKo-QoMbQCc39G8vruQvRDmvJG0Q-MkIF4LVNkEgnKD6yDT5JvfU/s1600/close3.png" /></a></div>
<center>
<div style="background: #fff;">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FFsGalery&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false&amp;appId=335968309757980" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</div>
</center>
</div>

NB : Ganti Kode yang berwarna merah dengan Script Like Box Halaman Facebook anda
  • Simpan dan Selesai
Selamat Mencoba, semoga berhasil..
Jika ada yang kurang jelas, silahkan titipkan Komentar dibawah ^_^

Read more ...

Cara Pasang Widget Facebook PopUp Like Box (Timer)


Cara Pasang Widget Facebook PopUp Like Box (Timer) - Kali ini saya kembali dengan artikel berkategorikan "Widget" dan yang pastinya bermanfaat bagi sahabat ANVITY Blog | Internet Learning. Widget yang akan saya bahas hari ini adalah widget "FBLikes Pro" yang menurut saya sangat spesial dan menarik. Check it now!

- kembali ke laptop -

FB Like Box ANVITYSalah satu Blogger Professional dan pemilik blogkakiheboh asal Indonesia ini telah menerbitkan widget ciptaannya. Banyak kalangan masyarakat baik dari Indonesia maupun Luar Negeri yang minat dengan widget menarik ini. Yangmembuat saya menganggap widget ini spesial adalah teknik tampilan border yang mirip seperti Facebook dan juga fitur timer atau penghitung mundurnya. Kalian juga dapatmengatur berapa lama timer akan berjalan (dalam detik) dan juga dapat mengatur  berapa lama widget ini akan tampil ketika blog di load (dalam menit), baik itu setelah 1 menit atau langsung tampil. Pada widget ini juga dapat mengganti background dengan keempat kode gambar (.js). Loading widget ini juga sangat cepat memungkinkan tidak ada beban apapun pada berat loading blog.

Untuk cara pembuatan dan pemasangannya silahkan ikuti langkah-langkah di bawah ini.
1. Pastikan kalian sudah login ke akun Blogger.
2. Masuk ke halaman "Template" dan klik "Edit HTML"
3. Cari kode </body> (gunkan Ctrl+F untuk mempermudah)
4. Salinlah kode/script dibawah ini dan letakan tepat diatas kode </body>
<script type='text/javascript'>
//<![CDATA[
      KNFBFansPRO='ANVITY Blog'
//]]> </script>
<style>#fblikepop{background-color:#fff; display:none; position:fixed; top:200px;_position:absolute; /* hack for IE 6*/width:470px;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;border-radius: 9px}
#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; /* hack for IE 6*/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:18px !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:28px;overflow:hidden;}
#fblikepop #buttonArea{background:#F2F2F2;border-top:1px solid #CCCCCC;padding:10px;min-height:45px;}
#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://mybloggertricks.googlecode.com/files/jquery.js' type='text/javascript'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/>
<script src='http://anvity-host.googlecode.com/files/anvity-likebox2.js' type='text/javascript'/>
<script language='javascript'>
//<![CDATA[
$(document).ready(function(){
$().KNFBFansPRO({
timeout: 30,
wait: 0,
url: 'http://www.facebook.com/anvity',
closeable: true });
});
//]]>
</script>
<div id='fbtpdiv'/>
5. Save Template. Done!

Edit Kode/Script Widget FB LikeBox

Pemasangan widget belum selesai sampai disini. Ada lagi yang perlu di edit pada kode diatas.
  1. Ganti kata ANVITY Blog dengan kata yang akan tampil di bagian atas widget, misalnya "Join ANVITY Blog on Facebook"
  2. Ganti angka 30 dengan angka yang akan mengatur berapa lama widget itu akan tampil (dalam detik)
  3. Ganti angka 0 dengan angka yang akan mengatur lamanya widget ini akan tampil ketika blog baru di load (dalam menit)
  4. Ganti anvity dengan username FansPage atau jika belum mempuyai username pada FansPage, gunakan ID FansPage (ihat pada address bar browser kamu)
  5. Terakhir, ganti juga true dengan false jika tanda X (close) ingin dihilangkan.

Mengganti Gambar Background Widget FB LikeBox

Sahabat juga dapat mengganti gambar background widget. Silahkan ganti tulisan yang berwarna merah pada kode widget diatas dengan kode-kode gambar dibawah ini.
Facebook Like Box Timer ANVITY
Background ini sudah terpasang di kode widget di atas.
http://anvity-host.googlecode.com/files/anvity-likebox2.js
Facebook Like Box Timer ANVITY
http://anvity-host.googlecode.com/files/anvity-likebox4.js
Facebook Like Box Timer ANVITY
http://anvity-host.googlecode.com/files/anvity-likebox3.js
Facebook Like Box Timer ANVITY
http://anvity-host.googlecode.com/files/anvity-likebox.js
Kurasa sampai disini, jika masih ada masalah dan perlu ditanyakan berikan komentar. Happy Blogging and Enjoy it!

Read more ...

Cara Membuat Spoiler (AutoHide) di Blog


Berhubung ada sahabat blogger yang bertanya bagaimana Cara Membuat Spoiler di Blog seperti dalam postingan blog, maka kali ini saya akan mensharenya. Spoiler atau AutoHide sering kita jumpai jika sobat sering berkunjung di situs2 forum seperti kaskus yang membuat AutoHide untuk memaksimalkan ruang postingan jika terdapat tulisan, foto, link yang banyak demi menghemat tempat. Atau biasanya ada juga blogger yang jail dengan bermaksud untuk membuat pembaca menjadi penasaran akan isinya. 
Cara Membuat Spoiler di Postingan Blog sendiri sangat mudah sekali. Yang perlu kita lakukan hanya memasang kode script pada postingan yang ingin dipasang AutoHide. Dari pada penasaran baiknya kita langsung praktekan saja dibawah ini, sebelumnya berikut contoh Spoiler (Buka Tutup) yang saya terapkan pada beberapa tulisan di blog ini :

Berikut caranya :
1. Seperti biasa Login ke akunnya masing2
2. Buat Entri Baru/New Post = Membuat postingan
3. Jika sudah, pada menu Entri, Pilih mode penulisan HTML (Bukan Compose) jika ingin menerapkan Spoiler/AutoHide. Jika dipasang pada Mode Compose maka tidak akan berfungsi code scriptnya.
4. Lalu copas Script dibawah ini pada postingan yang akan dipasang autohide
<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Judul Spoiler</b>: <input value="Buka" style="margin: 0px; padding: 0px; width: 55px; font-size: 12px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">
Letakkan teks atau kode script (gambar atau video), link di sini  <br>
</div>
</div>
</div>
5. Kita dapat merubah Judul Spoiler, Buka, Tutup dengan bahasa kita masing2, dan Letakkan Teks, gambar, video, kode2 script, atau link yang ingin dimasukkan didalam Spoiler
6. Publikasikan ! dan lihat hasilnya
Contoh yang saya buat :


Cantik-cantik tapi ko gini ya ??:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvEU5BGBK_TTSr1_FCTl8t40vqZI4WU-tUzPXmRkR0oBKcEeY6C8cQDaXkyfidRY78rd3y9gmsFOZI-t_SLumk_nArbZB7P8Jq08v426J2CeCLPx-4erH-KwT1_UXci-q15290DyChnQ/s320/hahaa+asmirandah+kena+editan+photosoper.jpg


Read more ...
© 2011 copyright www.gadogado29.com edited by GadO - GadO Blog
Beberapa Artikel Dimuat Dari Berbagai Sumber

February 2013