Cara Memasang Widget Facebook Melayang HTML







Untuk mendapatkan banyak traffic sebuah situs salah satunya adalah melalui sosial media seperti facebook, twitter, google plus jadi sangat baik untuk menghubungkan blog, wordpress, website dengan media sosial. Adapun kegunaan menampilkan / menambahkan fan page facebook pada blog yaitu agar pengunjung dapat menyukai fanspage kita tanpa terkecuali, semakin banyak yang like maka akan semakin bagus karena setiap kali sobat share artikel / postingan di fanspage fb maka akan muncul juga di beranda orang yang sudah like fanspage sobat secara otomatis jadi sangat baik buat sobat memasang fanspage facebook ini dengan cara membuat gadget baru pada layout dan memasukkan beberapa script kode.

Cara Membuat Fanspage Float Di Blog :

Buat pop up Fanspage FB seperti diatas yaitu dengan cara masuk menu Layout atau Tata Letak dan klik Tambahkan gadget
Kemudian klik tombol tambah pada HTML/Javascript
Setelah itu masukkan semua kode berikut ke dalam kotak konten :

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
<style>
#fanback {
display:none;
background:rgba(0,0,0,0.8);
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
z-index:99999;
}
#fan-exit {
width:100%;
height:100%;
}
#fanbox {
background:white;
width:420px;
height:270px;
position:absolute;
top:58%;
left:63%;
margin:-220px 0 0 -375px;
-webkit-box-shadow: inset 0 0 50px 0 #939393;
-moz-box-shadow: inset 0 0 50px 0 #939393;
box-shadow: inset 0 0 50px 0 #939393;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin: -220px 0 0 -375px;
}
#fanclose {
float:right;
cursor:pointer;
background:url(http://3.bp.blogspot.com/-NRmqfyLwBHY/T4nwHOrPSzI/AAAAAAAAAdQ/8b9O7O1q3c8/s1600/fanclose.png) repeat;
height:15px;
padding:20px;
position:relative;
padding-right:40px;
margin-top:-20px;
margin-right:-22px;
}
.remove-borda {
height:1px;
width:366px;
margin:0 auto;
background:#F3F3F3;
margin-top:16px;
position:relative;
margin-left:20px;
}
</style>
<script type='text/javascript'>
//<![CDATA[
jQuery.cookie = function (key, value, options) {
// key and at least value given, set cookie...
if (arguments.length > 1 && String(value) !== "[object Object]") {
options = jQuery.extend({}, options);
if (value === null || value === undefined) {
options.expires = -1;
}
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}
value = String(value);
return (document.cookie = [
encodeURIComponent(key), '=',
options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}
// key and possibly options given, get cookie...
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
};
//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_user_login') != 'yes'){
$('#fanback').delay(100).fadeIn('medium');
$('#fanclose, #fan-exit').click(function(){
$('#fanback').stop().fadeOut('medium');
});
}
$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });
});
</script>
<div id='fanback'>
<div id='fan-exit'>
</div>
<div id='fanbox'>
<div id='fanclose'>
</div>
<div class='remove-borda'>
</div>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?
href=https://www.facebook.com/Ziomagz&width=402&height=255&colorscheme=light&show_faces=true&border_color=%23E2E2E2&stream=false&header=false'
style='border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;'></iframe>
</div>
</div>
 Ganti tulisan yang berwarna BIRU Menjadi URL dari fanspage facebook kalian

 4.Terakhir klik tombol Simpan setelan.. Selesai

Demikian Cara memasang fanpage facebook melayang di blog jika ada yang salah atau kalian tidak mengerti kalian bisa berkomentar.

0 Response to "Cara Memasang Widget Facebook Melayang HTML"

Post a Comment

Gunakan Kolom Komentar Dengan Baik, Jika Ada hal Yang Kurang Jelas Silahkan Bertanya.

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel