Cara Membuat Kotak Like Fanspage Melayang

Sering saya melihat sebuah blog atau website yang ketika membukanya tiba-tiba nongol kota fanspage like yang melayang, semula saya berfikir apa pengaruh nya buat nambah like fanspage hanya mengganggu saja, namun hal ini ada pengaruhnya buat nambah likers fanspage kita walaupun agak-agak sedikit mengganggu buat pengunjung, tapi toh kita memasangnya di blog kita sendiri, jadi sah-sah saja kita mau memasang nya atau tidak.

Bagaimana cara memasangnya ? copy paste kode dibawah ini.

/* Message Box */
#box-message {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#fff;
font:normal Dosis, Georgia, Serif;
color:#111;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
#box-message a.close {
position:absolute;
top:-10px;
right:-10px;
background:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#111;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:22px;
-moz-border-radius:22px;
border-radius:22px;
cursor:pointer;
}
#twitterx {
background: #EEF9FD;
padding: 10px;
text-align:center;
border: 1px solid #C7DBE2;
border-top: 0;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top Value When Page Loaded Completed
$('#box-message').animate({top:"50px"}, 1000);
// Remove Mailbox When Close Button On Click
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='box-message'>
<!-- HTML Start -->
<center>
<a class="murub">Kalau Bermanfaat,Silahkan Dilke Ia</a></center>
<center>

<div class="fb-page" data-href="https://www.facebook.com/yopiblog" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/yopiblog"><a href="https://www.facebook.com/yopiblog">Yopiblog</a></blockquote></div></div>

</center>
<!-- HTML End -->
<br/>
<div class="twitter">
<!-- Twitter --> <iframe title="" style="width: 250px; height: 20px;" class="twitterx-follow-button" src="http://platform.twitter.com/widgets/follow_button.html#_=1319978796351& align=&button=blue&id=twitter_tweet_button_0& lang=ID&link_color=&screen_name=yopi_bukhori&show_count=& show_screen_name=&text_color=" frameborder="0" scrolling="no"></iframe> </div>
<div style="text-align: center;">
<a href="https://yopibloger.blogspot.com/2016/02/cara-membuat-kotak-like-fanspage.html#more" target="_blank">Get This Widget</a></div>
<a class='close' href='#'>×</a>

Selanjutnya ubah text yang berwarna merah dengan kode kota fanspage dan nama twitter punya teman-teman sendiri, jika belum tahu bagaimana membuat kotak fanpage teman-teman bisa baca disini :

Cara Menambahkan Kotak Facebook Like Fans Page Di Blog

Lalu buka blog teman-teman yang ingin dipasang kota fanspage melayang, kemudian pilih menu tata letak

Kemudian pilih tambahkan gadget

Pilih HTML/Java Script

Paste kode diatas kemudian klik simpan

Dan selesai, jika teman-teman merasa artikel ini bermanfaat silahkan share, jika ada pertanyaan silahkan tanyakan di kolom komentar dan jangan lupa di like fanpage nya ya :) wassalam.

Berbagi :