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, kita akan memasang fanspage facebook secara
melayang di halaman / page blog yang bentuknya keren dan menggunakan
tombol close jadi pengunjung tidak akan terganggu oleh gadget likebox
fans page fb ini. 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 Facebook Melayang Di Blog Terbaru,
Silahkan ikuti tutorial langkah langkah berikut lengkap beserta gambarnya buat sobat yang ingin memasang like box fans page fb melayang pada blogspot.
Cara Membuat Lika Fan Page Facebook Di Blogger Secara Float :
1. Bikin pop up Fanspage FB seperti diatas yaitu dengan cara masuk menu Layout atau Tata Letak dan klik Tambahkan gadget
2. Kemudian klik tombol tambah pada HTML/Javascript
3. Setelah itu masukkan semua kode berikut ke dalam kotak konten :
#Ganti tulisan warna merah dengan alamat fanspage facebook sobat
4. Terakhir klik tombol Simpan setelan.. Selesai
6. Berikut adalah tampilan blog yang berhasil dipasang like box fanspage facebook keren yang melayang saat awal membuka blog :
Nah itulah bagaimana cara membuat fanspage facebook melayang di blog dengan mudah dan cepat.
Cara Membuat Fanspage Facebook Melayang Di Blog Terbaru,
Silahkan ikuti tutorial langkah langkah berikut lengkap beserta gambarnya buat sobat yang ingin memasang like box fans page fb melayang pada blogspot.
Cara Membuat Lika Fan Page Facebook Di Blogger Secara Float :
1. Bikin pop up Fanspage FB seperti diatas yaitu dengan cara masuk menu Layout atau Tata Letak dan klik Tambahkan gadget
2. Kemudian klik tombol tambah pada HTML/Javascript
3. 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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmLLZKkHGEnQ7XRKTGx2jRkMFMJMkdDqqwSkYc5mQZHTfaQNu29tsf5nWQm6TPt89AvMrpxGin47UFzLeSJkzDVVXMhx-s6HGQ0B-fAUL9CKZCz0XGUDYQYMmD-kEwvR5LWMJbIHehpk5O/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/CilacapVoEmotionz/&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>
<center>
<span id="linkit"><a href="https://goo.gl/1hk8xa">Get This Widget</a></span></center>
</div>
</div>
#Ganti tulisan warna merah dengan alamat fanspage facebook sobat
Jika sudah sobat bisa langsung klik Simpan..
4. Terakhir klik tombol Simpan setelan.. Selesai
6. Berikut adalah tampilan blog yang berhasil dipasang like box fanspage facebook keren yang melayang saat awal membuka blog :
Nah itulah bagaimana cara membuat fanspage facebook melayang di blog dengan mudah dan cepat.
Baca juga Trick and Tips Blog Lainya di bawah ini :
Cara membuat blog Download MP3 di Blogspot
Cara Mudah Membuat Sitemap di Blogger
Cara memasang atau memasukan widget lagu ke blog
Cara Menambahkan Elemen Halaman Atau Kolom Full Widgets Pada Sidebar
Cara Membuat & Memasang Kotak Berlangganan Responsive
Cara Memasang Widget Media Sosial di Sidebar Blog
Cara Menampilkan Widget Recent Posts
Promosi Facebook Page dengan Conversion Box
Related Post dengan Gambar Thumbnail untuk Blogger
Featured Post with Thumbnail Image for Blogger
Cara Membuat Sidebar Multi Tab di Sidebar Blog
Cara Membuat Navigasi Halaman Blog Pake Angka/Nomor
Widget Recent Posts Blogger Berdasarkan Label Atau Kategori
Widget Popular Posts Dengan Grid Layout Style
Cara Membuat Automatic Featured Posts Slider Dengan JQuery
Menyusun Gambar Sejajar Pada Postingan
Cara Membuat Kotak Pencarian (Search Box) Di Blog Keren Terbaru
Cara Membuat Iklan Melayang Di Bawah Blog Dengan Tombol Close
Cara Membuat Fanspage Facebook Melayang Di Blog Terbaru
Cara Membuat Popular Post Warna Warni Di Blog Terbaru
Cara Mengatur Jumlah Postingan Di Halaman Utama Blog
Cara Membuat link di HTML (tag)
Cara Membuat Garis Batas Horizontal di Blogger
Membuat Tab View Menu Tanpa Edit HTML di Blogspot
Cara memasang video Youtube di blog
Cara Membuat Tulisan/Link Agar Bisa di Klik
Membuat Popular Post Hanya Tumbnail
Membuat Slide Show Gambar di Halaman Posting Blogger
Cara Membagi Postingan Menjadi 2 Halaman di Blogspot
CARA POSTING DALAM HALAMAN BERBEDA DI BLOGGER
Cara Mengganti Warna Background Judul Sidebar Blog
Cara Membuat Label atau Kategori di Blog
Cara Membuat Isi Halaman Blog Berdasarkan Label
Cara Membuat Menu dan Submenu Navigasi pada Template Bawaan Blog
Cara Memasang Widget di Blog
Cara menambahkan daftar bacaan blog
CARA MELAKUKAN REDIRECT 301 (PENGALIHAN URL)
Cara Memasang Breadcrumb blog
Cara Menggunakan Menu Impor Blog di Blogger
Cara Mengalihkan Alamat Blog Lama Ke Blog Baru
Cara Membuat Kotak Komentar Facebook di Blog
Cara Membuat Menu Spoiler Pada Postingan Blogger
Cara Membuat Widget Recents Post / Artikel - Bergerak
Cara Mengganti Domain Blogspot menjadi .Com - (Custome Domain)
Cara Membuat Link / Tautan Antar Halaman
Cara Memasukkan Postingan di Menu dan Sub Menu
Cara Membuat Widget Recent Post Dengan Gambar
Cara Menambahkan Gambar Di Postingan Blog
SELAMAT MENCOBA
No comments:
Post a Comment