Facebook Like Dan Twitter Follow Box Melayang New Style

Membuat Facebook Like Dan Twitter Follow Box Melayang. Huahahaha...akhirnya experimen widget Mas Yusa berhasil alias sukses :D. Kali ini Mas Yusa akan share widget lagi (Tentunya halal bro..!), widget melayang yang Mas yusa share kali ini tidak menggunakan script Jquery (Selamet deh berat blog anda) Hahaha. Mas yusa terinpirasi widget facebook like box melayang dari sobat planktoon.blogspot.com yang enggak makai jquery. Sebenarnya widgetnya hampir sama dengan bang planktoon, tapi ada tambahan dari saya, yaitu twitter follow box yang sangat keren (di desain mirip facebook like box)

KLIK DISINI UNTUK DEMO

Untuk Screen Shootnya :

 

Nah, untuk yang tertarik...langsung aja simak caranya :

• Masuk akun Blogger anda
• Masuk Rancangan/Tata Letak
• Klik Add widget->HTML/Java Script
• Masukan kode di bawah ini :

<!-- Script kotak like Facebook dan Twitter Follow box 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/AVvXsEh8F1mmLp-oYHhuYd-BrIS8Y84VbAhwqqVysY0XoBvcQC_CbpiLpDxr7Wm__2VhyphenhyphenOSRXua07a3Dc6gb63H8A7kT1V1EOkljbRmVB1Hw68c7frYwsci2o9hN5U6sXCZxXljOPBlBPBJk2zl6/s1600/close3.png" /></a></div>
<center>
<div style="background: #fff;">

<iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/MasyusaBlogspotcom/317602688268316&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp; connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 230px; width: 300px;background:#fff;"></iframe>

<script type="text/javascript"
src="http://s.moopz.com/fanbox_init.js"></script><div
id="twitterfanbox"><script
type="text/javascript">fanbox_init("yusa_syihab");</script
type="text></div
id="twitterfanbox">

</div>
</center></td>
</tr>
</table>
</div>
<!-- akhir -->

• Note : Untuk yang berwarna BIRU, ganti dengan url Facebook Fanpage blog anda. Dan untuk yang berwarna MERAH ganti dengan ID Twitter anda (Tidak pakek @).
• Lalu Simpan.

Jika tidak berhasil, mari bertanya VIA KOMENTAR DIBAWAH... :D
Jangan lupa klik iklan Mas Yusa ... :)

Tweet

Baca Peraturan Copy Paste !

Anda sedang membaca artikel tentang Facebook Like Dan Twitter Follow Box Melayang New Style dan anda bisa menemukan artikel Facebook Like Dan Twitter Follow Box Melayang New Style ini dengan url http://masyusa.blogspot.com/2012/07/membuat-facebook-like-dan-twitter.html, Anda boleh menyebar luaskannya atau mengcopy paste-nya jika artikel Facebook Like Dan Twitter Follow Box Melayang New Style ini sangat bermanfaat bagi teman-teman Anda, namun jangan lupa untuk meletakkan link postingan Facebook Like Dan Twitter Follow Box Melayang New Style sebagai sumbernya. Jika tidak saya akan laporkan Google ! Yusa Syihab Akbar

About Me-->