Latest News

Membuat Widget Like Box Facebook Melayang Ala Strukturkode

Widget Like box facebook yaitu kotak suka untuk halaman facebook milik kita yang sanggup kita pasang sebagai widget pada blog, ini yaitu prakarsa facebook yang menyajikan arahan widget untuk like box facebook tersebut, arahan widget like box facebook dibentuk sebagai salah satu media yang cukup mudah untuk mempromosikan halaman facebook, semoga mendapat penggemar yang menyukai halaman facebook tersebut, untuk menambah penggemar terhadap halaman tersebut salah satu cara yang cukup efektif yaitu dengan  memasang arahan widget like box facebook di blog yang kita miliki. dengan demikian halaman facebook kita akan mendapat banyak penggemar, apalagi pengunjung blog yang kita miliki sangat banyak, semakin banyak visitor maka peluang untuk mendapat klik suka pada halaman facebook melalui like box facebook tersebut akan semakin banyak.

Sebenarnya ada beberapa hal yang harus kita perhatikan sebelum memutuskan untuk memasang widget like box facebook pada blog,  bila like box tersebut memang kita butuhkan sebaiknya kita pasang, namun disarankan tata letak likebox facebook jangan hingga menggangu kenyamanan pengunjung,


Ciri Widget Like box facebook ala struktur arahan

Like box facebook ala struktur arahan kebetulan dibentuk dengan konsep tidak menggangu kenyamanan pengunjung, hukum main widget untuk like box facebook tersebut yaitu sebagai berikut:

#1. Likebook facebook akan muncul di sudut kanan bawah secara slide dari bawah keatas, alasanya yaitu semoga likebox facebook tersebut tidak menghalangi dan menggangu pandangan pengunjung.

#2. Like book facebook akan muncul  20 detik kemudian sesudah halaman blog final di load, ini juga untuk memberi kenyamanan pada para pengunjung, saat pengunjung mengunjungi blog, pengunjung tidak eksklusif di suguhkan tampilan likebox facebook, 20 detik pertama sesudah halaman final di load, pengunjung akan disuguhkan artikel yang mereka temukan, selang 20 detik kotak like box gres akan muncul secara otomatis di sudut kanan bawah slide ke atas, dengan begitu kotak like box tersebut tidak akan menggangu kenyamanan pengunjung, dan jka menghendaki pengunjung  bisa  klik tombol suka pada widget likebox tersebut, atau pengunjung juga sanggup menutup tampilan kotak likebox tersebut secara langsung.

#3. Like book facebook yang dibentuk melibatkan framework jquery sebagai pendukungnya, oleh alasannya yaitu itu kita harus meload library jquery dalam arahan widget tersebut,

KODE WIDGET

Kode dibawah ini yaitu kode widget untuk menciptakan like box facebook melayang ala struktur arahan yang muncul di sudut kanan bawah slide ke atas:
<style type='text/css'>
/* Message Box */
#box-message {
position:absolute;
bottom:-1000px;
right:10px;
width:300px;
height:auto;
padding:10px;
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:1px;
-moz-border-radius:1px;
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;
}
</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({bottom:"10px"}, 20000);
// Remove Mailbox When Close Button On Click
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='box-message'>
<!-- HTML Start -->
<center>
--LETAKAN KODE LIKE BOX FACEBOOK ANDA DISINI--
</center>
<!-- HTML End -->
<a class='close' href='#'>&times;</a>
</div>

CARA MENDAPATKAN KODE LIKE BOX FACEBOOK

Untuk mendapat arahan like box facebook, silahkan anda login terlebih dahulu ke akun facebook anda, bila anda belum punya akun facebook silahkan anda daftar buat akun facebook terlebih dahulu, kemudian itkuti langkah-langkah berikut:

#1. Masuk ke halaman https://developers.facebook.com/

#2. Cari Gambar The Like Button, kemudian klik tombol "Learn More", ibarat gambar dibawah ini:

 yaitu kotak suka untuk halaman facebook milik kita yang sanggup kita pasang sebagai widget  Membuat Widget Like Box Facebook melayang ala strukturkode

#3. Pada bilah sajian sisi kiri,  pilih sajian Sharing > Social Plugin > Like Box, akan disajikan tampilan ibarat gambar dibawah ini:
 yaitu kotak suka untuk halaman facebook milik kita yang sanggup kita pasang sebagai widget  Membuat Widget Like Box Facebook melayang ala strukturkode
Silahkan lakukan konfigurasi sebelum menggenerate arahan like box facebook, atur ibarat dibawah ini:
a. Isi kotak Facebook Page URL (1) dengan url halaman yang akan anda promosikan, caranya:
  • Masuk ke halaman anda, pilih sajian profile di samping kiri sajian beranda, silahkan klik sajian tersebut, biasanya nama menunya sesuai dengan nama akun untuk halaman tersebut
  • Kopi alamat url pada address kafetaria browser anda, dan paste di kotak Facebook page URL ibarat terlihat pada gambar 1 diatas.
b. Width dan height bisa anda input untuk mengatur lebar dan tinggi kotak like box, atau biarkan saja apa adanya untuk mendpatkan ukuran bawaan dari kotak tersebut

c. Color Scheeme, silahkan pilih warna kotak like box yang anda sukai.

d. Biarkan setingan lainnya apa adanya atau silahkan anda atur sendiri

Jika sudah tekan tombol "Get Code" untuk mendapat kode like box facebook, anda akan mendapat tampilan ibarat terlihat pada gambar dibawah ini:


 Pilih Tab IFrame, ibarat yang diperlihatkan pada gambar diatas, kemudian copy arahan yang muncul. Kembali ke arahan widget, silahkan modifikasi arahan widget di atas ganti goresan pena warna ungu: -LETAKAN KODE LIKE BOX FACEBOOK ANDA DISINI-- dengan arahan like box facebook yang sudah anda copy sebelumnya.

CARA MEMASANG LIKE BOX FACEBOOK PADA BLOG

Jika anda sudah melengkapi arahan widget diatas dengan arahan like box facebook halaman anda, kini kita pasang arahan tersebut pada blog anda, silahkan ikuti langkah-langkah dibawah ini:


#1. Masuk ke akun blogspot Anda

#2. Pada bilah sajian sisi kiri, silahkan pilih sajian Tata Letak.

#3. Silahkan klik Tambah Gadget, pilih saja tambahkan gadget untuk area di sidebar

#4. Pilih gadet HTML/JavaScript, kemudian kopikan arahan widget yang sudah anda lengkapi dengan arahan like box facebook pada kotak isian yang tersedia, kemudian pilih simpan.

Sampai tahap diatas seharusnya anda sudah berhasil memasang arahan widget like box facebook pada blog anda, untuk melihat akibatnya silahkan anda masuk ke halaman blog anda, kotak like box facebook akan muncul dalam waktu 20 detik sesudah halaman final di load, kotak keluar slide di sudut kanan bawah.

DEMO:

Demo ibarat terlihat pada halaman blog sturktur arahan ini.

MODIFIKASI ULANG WIDGET KOTAK LIKE BOX FACEBOOK ANDA

Mengatur waktu kemunculan
Untuk mengatur waktu muncul silahkan anda ganti angaka 20000 yang berwarna biru dengan waktu yang anda inignkan, 20000 berarti kotak like box tersebut gres akan keluar 20 detik sesudah halaman blog tersebut final diload, silahkan atur sesuai dengan yang anda kehendaki.

Agar Kotak Like box muncul di sudut kiri bawah
Untuk menciptakan kotak like box facebox tersebut muncul dari sebelah kiri bawah layar, slide dari bawah ke atas silahkan anda ganti arahan merah right:10px; menjadi left:10px;

Agar Kotak Muncul di layar sudut Kanan Atas
Untuk menciptakan kotak like box facebook muncul melayang di sudut  kanan atas, slide dari atas ke bawah, silahkan ganti arahan warna merah yang bertuliskan bottom:-1000px; dengan arahan top:-1000px; kemudian ganti juga arahan dengan warna biru bertuliskan bottom:"10px" dengan arahan top:"15px"

Agar Kotak muncul di  layar sudut kiri atas
Untuk menciptakan kotak like box facebook, melayang dan muncul di sudut kiri atas, slide dari atas ke bawah,  silahkan ganti arahan merah yang bertuliskan right:10px, menjadi arahan left:10px;  kemudian ganti juga arahan bottom:-1000px menjadi arahan top:-1000px; kemudian ganti juga arahan dengan warna biru bertuliskan bottom:"10px" dengan arahan top:"15px"

 Demikian artikel sederhana mengenai Membuat Widget Like Box Facebook melayang ala strukturkode, selamat mencoba dan semoga bermanfaat. 


0 Response to "Membuat Widget Like Box Facebook Melayang Ala Strukturkode"

Total Pageviews