Hallo Sobat Blogger Sudah Lama gak blogging nih...kangen bangeeeet...(sumpe dech....) oh ya kali ini saya akan membuat tutorial Cara Memasang Widget Like Box FB Keren Di Blog Like Box Facebook ini saya dapatkan saat saya mencari di mesin pencari Google dan sedikit saya rubah.a
Ok....Langsung Aja...!
1. Login Ke Blogger
2. Pilih Tata Letak
3. Klik Tambah Gadget/add gadget
4. Kemudian Pilih HTML/Javascript
5. Masukan Kode/Script Di Bawah Ini:
<!-- Script kotak like Facebook Melayang -->
<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">
<table border="1" bgcolor="FFFFFF">
<tr>
<td>
<div style="text-align: right;">
<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRjA8vK1NJGx4i1RTeRJhW9UMo08xYhraRsdB41hG2YARTsnNX3S-EZBB3lRnGczg67glhyphenhyphenkSbL01vDBPzO2VSpA-q4EBeqt0WlYW9mO1OoKoJaj9H7QpJ5hvqI80Onbv86OAWOBeHJ3FQ/s1600/close3.png" /></a><blink>Klik Like yah..?</blink></div>
<center>
<div style="background: #fff;">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlog-Anak-PS&width=260&height=290&colorscheme=light&show_faces=true&border_color=grey&stream=false&header=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:260px; height:290px;" allowtransparency="true"></iframe>
</div>
</center></td>
</tr>
</table>
</div>
<!-- akhir -->
NB: Sebelum kode diatas diletakan kedalam widget sobat,terlebih dahulu sobat harus letakan script ini terlebih dahulu kedalam Template sobat, berikut script nya letakan dibawah tag <body>:
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/id_ID/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
1. Kode Yang Berwarna Biru adalah keseluruhan dari code like box yg di dapat dari FB Pages.
2. Kode Yang Berwarna Merah Silahkan Ganti Dengan Alamat Facebook Anda.
6. Klik Simpan Dan SELESAI...!
Demikian Tutorial Yang saya buat dengan sepenuh hati saya semoga bermanfaat untuk sobat blogger semua...Salam Blogging..!
Ok....Langsung Aja...!
1. Login Ke Blogger
2. Pilih Tata Letak
3. Klik Tambah Gadget/add gadget
4. Kemudian Pilih HTML/Javascript
5. Masukan Kode/Script Di Bawah Ini:
<!-- Script kotak like Facebook Melayang -->
<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">
<table border="1" bgcolor="FFFFFF">
<tr>
<td>
<div style="text-align: right;">
<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRjA8vK1NJGx4i1RTeRJhW9UMo08xYhraRsdB41hG2YARTsnNX3S-EZBB3lRnGczg67glhyphenhyphenkSbL01vDBPzO2VSpA-q4EBeqt0WlYW9mO1OoKoJaj9H7QpJ5hvqI80Onbv86OAWOBeHJ3FQ/s1600/close3.png" /></a><blink>Klik Like yah..?</blink></div>
<center>
<div style="background: #fff;">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlog-Anak-PS&width=260&height=290&colorscheme=light&show_faces=true&border_color=grey&stream=false&header=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:260px; height:290px;" allowtransparency="true"></iframe>
</div>
</center></td>
</tr>
</table>
</div>
<!-- akhir -->
NB: Sebelum kode diatas diletakan kedalam widget sobat,terlebih dahulu sobat harus letakan script ini terlebih dahulu kedalam Template sobat, berikut script nya letakan dibawah tag <body>:
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/id_ID/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
1. Kode Yang Berwarna Biru adalah keseluruhan dari code like box yg di dapat dari FB Pages.
2. Kode Yang Berwarna Merah Silahkan Ganti Dengan Alamat Facebook Anda.
6. Klik Simpan Dan SELESAI...!
Demikian Tutorial Yang saya buat dengan sepenuh hati saya semoga bermanfaat untuk sobat blogger semua...Salam Blogging..!
Thanks sudah berbagi ilmunya, sukses selalu...
ReplyDeletethanks gan buat ilmu nya nya
ReplyDeleteThanks, sukses untuk blognya....
ReplyDeleteLam kenal aja...
ReplyDeleteOkey, thanks infonya...
ReplyDeletethank's, ane bisa pake.. tapi kenapa yah pas di close, di samping alamat blognya ada tulisan /#close ... tau gak cara ilanginnya
ReplyDeletetolong pencerahannya yah!!
Itu sih ga apa-apa,kan gk da pengaruhnya kan..?
DeleteIya mang setelah saya coba kembali script nya mang gitu, sekarang saya sudah perbaiki,maaf silakan dicoba lagi.Thanks...!
Deletewokeh,,
ReplyDeleteKeren sob, terima kasih ilmunya...
ReplyDeleteSama-sama sobat...
DeleteBagus dan lengkap tutornya..
ReplyDeleteterima kasih akan saya coba dulu..
:)
Bisa dipasang di WP/Wordpress juga gak ya ?
ReplyDeletehabisnya keren bro...Thanks !
kereennnn...... thanks yeahhh bwt infonya :) jaya terus.
ReplyDeleteGak jalan Gan :(
ReplyDeletemuakasih gan...ane pake cara agan di blog ane ..
ReplyDeleteOkay silakan, semoga berhasil sukses,thanks.
DeleteMantab..thanks Scriptnya.. :)
ReplyDeleteCaranya gimana
ReplyDeletetolong pencerahannya
di copy semua ??
ReplyDeleteSilakan semoga sukses dan berhasil,thanks.
Deletenice info nya :)
ReplyDeleteMa kasih sob buat ilmunya.
ReplyDeleteSalam sukses selalu...
Sama-sama ,sukses juga buat sobat...thanks.
Deletegood,,,,,
ReplyDeleteKeren widgetnya
ReplyDeleteinformasi yang sangat bermanfaat buat blogger semua
salam sejahtera blogger
maannteepp broo...
ReplyDeletethnks gan
ReplyDeletesip keren. terimakasih banyak bos tutorialnya. setelah saya tertapkan akhirnya berhasil. ternyata tidak sesuliat yang saya bayangkan.
ReplyDeleteOkay sob sama-sama dan sukses slalu...
Deletemakasih sob
ReplyDeletetahnks soob
ReplyDeleteWah kok saya gagal terus yah .
ReplyDeleteudah ikutin langkah" nya
Tapi cuma dapet box kosong berisikan "Close"
Di HTML saya gak ada <Body
adanya <Body...Blablaba sama </Body
Mohon pencerahannya
Ada yg terlewatkan....apa sudah memasukan script fb pages dalam template sobat..? kalau sudah.., apa script FB pages yg di ambil dari FB sudah benar, soalnya ada banyak jenis script disana, kalau sudah betul pasti sobat berhasil...!!thanks.
DeleteTHANK'S INFO NYA..
ReplyDeleteDAH SYA COBA GMPANG TRNYATA..
NICE BLOG...
Thank's ya Sob atas Ilmu nya :D
ReplyDeletemaaf ya body uda CTR F masi ga' ketemu gimana ya tlongin nie
ReplyDeleteKalau tag body gak ketemu cari saja tag /head pasti dibawahnya ada tag body ....THKS semoga berhasil..
Deleteterima kasih sudah dipraktekkan dan berhasil. Klik like balik ya disini : www.facebook.com/AmisamShop atau kunjungi sini dan klik like : www.kaosanakqu.com
ReplyDelete#Ilmu yang bermanfaat termasuk amal jariyah
thanks udah mau berbagi sob :)
ReplyDeletevickzkater.blogspot.com << blog teknologi dan tutorial Android
Sama-sama N sukes clalu...!
Deleteartikel yg menarik gan..lam kenal dari newbie
ReplyDeletehttp://pucukpucuk.blogspot.com/
Knl balik sob,..!
Deleteini dia artikel yang di cari cari :D
ReplyDeletesalam kenal kk
visit : http://gameane.blogspot.com/
Akhirnya dapat juga artikelnya . . thanks, ane uda bisa coba . .
ReplyDeletejgn lupa mampir : http://indovedia.blogspot.com/
Seharusnya memang setiap blog memasang facebook fan page untuk meningkatkan traffic dan memudahkan artikel blog dibagi
ReplyDeleteTips nya kereenn... Googling sana sini ketemu dimari.. Thanks infonya..
ReplyDeleteBelajar toefl last post Unreal Conditional