3 Cara Membuat Panspage Melayang Di Blogg
Baik kali
ini kita akan membahas tentang bagaimana cara membuat fanspage melayang atau
yang sering di sebut like box melayang pada blog yang kita miliki.
disini kami akan memberikan 3 contoh fansapage melayang do blogger, dengan ukuran yang berbeda-beda sesuai dengan yang anda ingingkan. Dan cara memasangnya di blog anda.
disini kami akan memberikan 3 contoh fansapage melayang do blogger, dengan ukuran yang berbeda-beda sesuai dengan yang anda ingingkan. Dan cara memasangnya di blog anda.
Cara
pemasangan fanpage sangatlah beragam, yang salah satuya yaitu memanfaatkan
skrip box layang , yang
tujuannya hanya agar fanspage atau halaman kita dapat dilihat oleh pengunjung
blog kita, dan terlihat lebih keren dan bagus.
Cara ini
juga merupakan sebagian dari trik promosi fanspage yang sering di gunakan oleh
para pebisnis fanspage. Apalagi blog dan website ,yang memiliki visitor tinggi sangat
mempengaruhi jumlah like fanspage, semakin bayak visitor maka jumlah persentase
like akan semakin besar.
Dengan demikian fanspage kita akan terkenal dan memiliki
jangkauan yang luas.
Jumlah like
fanspage sangat mempengaruhi kinerja fanspage semakin banyak like fenspage maka
jangkauan promosi akan semakin luas.
Untuk
membuat fanspage melayang kita hanya membutuhkan scrip yang bisa membuat halaman fanspage kita melayang ketikta
seorang membuaka blog kita , maka halaman fanspage kita akan muncul secara
otomatis dan melayang.
Scrif like
box bisa kita dapatkan dengan sangat mudah dan gratis di mbah google yang di posting oleh para blogger bloger mania di
blog mereaka dan slahsatunya artikel ini yang membahas tentang cara membuat
fanspage melayang.
Namun
dalalam hal ini kita harus pandai- pandai memilih skrip yang akan kita gunakan. yang terpenting skripnya harus ringan, tidak memperlambat
proses loading pada blogg.
Dengan demikian pengunjung kan betah ,tidak membuat pengunjung jenuh atupun bosan
kelamaan menunggu loading.
ya kurang lebihnya sih bagaimana agar pengunjung merasa nyaman mampir di blog kita. cobak kita bayangin seandainya anda membuaka sebuah blog yang loadingnya sangat lama, bagaimana perasaan anda..? pastinya sih ogah tuk membukanya.
Tapi tenang
di sini kami telah menydiakan beberapa like box yang cukup ringan, yang tidak memperlambat proses
loading pada blog dan juga scrip memiliki ukuran yang responsip sesuai
besarnya ketika anda membukanya di deskop,handpone, maupun tablet.
Berikut scripnya:
Kami memberikan tiga scrip like box yang berbeda ukuran yang bisa anda pilih sesuai keinginan anda.
#1 Fanspage Melayang Untuk Blog Berita
<style type='text/css'>/* 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">LIKE UNTUK MELANJUTKAN</a></center><center><iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/redaksi45/?ref=hl&width=292&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=false&appId=371524026202784" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe></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=fujianto21&show_count=& show_screen_name=&text_color=" frameborder="0" scrolling="no"></iframe> </div><div style="text-align: center;"><a href="http://fujianto21-chikafe.blogspot.com/2013/10/cara-membuat-fanspage-melayang-di-blog.html" target="_blank">Get This Widget</a></div><a class='close' href='#'>×</a></div>
Cara Memasang
Langkah
pertama yang kita lakuan iallah.
1. Buka dasbor
anda untuk masuk ke akun blog
2. Setelah
anda masuk ke akun blog anda, lalu pilih tataletak > gadged "untuk menambahkanya"
Maka akan
tampil banyak pilihan yang di sediakan oleh pihak blogger
3. Pilih adeit
html /java skrip > Maka akan
tampil halaman baru
4. Copy kode
scrip di atas lalu pastekan di halaman html/java scrip > lalu simpan. begitu pula untuk scrip- scrip selanjutnya.
Nah disinah
bagian terpenting yaitu cara mengedit skrip tersebut agar fanspage kita bisa tampil di blog ataupun
website kita.
1.
silahkan kopy kode scrip di atas lalu pastekan
di halaman Html/ java scrip
Perhatian !!!
- tulisan yang berwarna merah dalah alamat halaman atau fanspage anda. ingat URL halaman anda bukan Url blog.
- Tulisan yang berwarna biru adalah kata – kata apa yang ingin anda kutipkan untuk menarik orang untuk me nyaukai fansapage anda.
- tulisan yang berwarna hijau adalah alamat Twiter, jika kamu memiliki twiter maka taruhlah link ttwiter anda, yang akan menapilkan berapa jumlah follwers anda di twiter dan mempermudah aorang untuk mengikuti artikel mu di twiter.
#2 Like box Kecil
Like box ini akan tampak lebih kecil,contoh :
<!-- FB melayang tombol close --!><style type='text/css'>#kotak-facebook {position:fixed !important;position:absolute; /* IE6 */bottom:-1000px;right:40%;margin:0px 0px 0px -182px;width:310px;height:auto;padding:16px;-webkit-box-shadow: 0px 0px 7px #222;-moz-box-shadow: 0px 0px 7px #222;box-shadow: 0px 0px 7px #222; background-color:#FFFFFF; font:normal 1em Cambria,Georgia,Serif;color:#111;-webkit-border-top-left-radius: 20px;-webkit-border-bottom-right-radius: 20px;-moz-border-radius-topleft: 20px;-moz-border-radius-bottomright: 20px;border-top-left-radius: 20px;border-bottom-right-radius: 20px;}#kotak-facebook a.close {position:absolute;top:-10px;right:-10px;background:#333;font:bold 16px Arial,Sans-Serif;text-decoration:none;line-height:22px;width:22px;text-align:center;color:#fff;border:2px solid #fff;-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;cursor:pointer;}</style><script type='text/javascript'>$(window).bind("load", function() {// animasikan nilai top saat halaman telah selesai dimuat$('#kotak-facebook').animate({bottom:"50px"}, 1000);// hilangkan kotak pesan saat tombol (x) di klik$('a.close').click(function() {$(this).parent().fadeOut();return false;});});</script><div id='kotak-facebook'><p style=" margin-right:10px; font-size:15px; color:#000000;">Silahkan Di Klik Tombol Likenya,<blink> Like This !!!</blink> </p><!-- Mulai --!>
<div class="fb-like-box" data-href="https://www.facebook.com/aboutdoublr" data-width="300" data-height="250" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="false" data-show-border="true"></div>
<!-- Selesai --!><a class='close' href='#'>×</a><p style=" float:right; margin-right:35px; font-size:10px;" >Powered By <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://kumpulan-adsen.blogspot.com/">Blogger Widget</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://bos-tutorial.blogspot.com/2013/07/inilah-memasang-widget-like-box.html">Get This Widget</a></p></div>
Cara Memasang
Panduan Mengedit :
scrip di ata akan tampil seperti gambar di bawah, terliahat
kecil dan imut, Like box ini juaga akan melayang dari atas ke bawah.
- kode warna hijau ganti dengan scrip kode fanspage anda yang bisa anda proleh di menu editor fanspafe. berbeda dengan kode yang pertama karna kode yang pertama hanya menggunakan link url fanspge sata tanpa harus mengambil kode crip.
- untuk mendapatkan kode scrip Fanspge anda silahkan kunjungi situs Facebook developers atau bisa anda copy url berikul :https://developers.facebook.com/docs/plugins/page-plugin
- Kode warna merah adalah kata- kata apa yang akan anda gunakan untuk mangajak oarang untuk memberikan jempolnya pada panspage anda.
#3 Like Box / Fanspage Blogger Responsif
<style type='text/css'>/* 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><iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/Cirebon.Chikafe?ref=hl&width=292&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=false&appId=371524026202784" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe></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=fujianto21&show_count=& show_screen_name=&text_color=" frameborder="0" scrolling="no"></iframe> </div><div style="text-align: center;"><a href="http://fujianto21-chikafe.blogspot.com/2013/10/cara-membuat-fanspage-melayang-di-blog.html" target="_blank">Get This Widget</a></div><a class='close' href='#'>×</a></div>
Cara Memasang
Pada scrip yang ke tiga ini peroses pengeditannya harus hati hati jangan sampe ada yang ke hapus gan bisa jadi brabe gan..
- Warna merah ganti dengan Pesan yang anda inginkan
- warna hijau URL fanspage anda
- Warna biru Usename Twitter anda
Sekian dari kami " Cara membuat Fanspage Melayang di blogg " semoga bermanfaat, jika ada kata- kata kami yang kurang berkenan mohon di maafkan ,dan jika ada hal-hal yang kurang jelas silahkan tinggalkan komentanya di bawah ini ataupun anda bisa menghubungi kami melalui Facebook/ Fanspage kami di Balog18 .
