Jumat, 21 Oktober 2016

Membuat aplikasi like di website

 

Tombol Suka untuk Web

Satu klik pada tombol Suka akan 'menyukai' beberapa bagian konten di web dan membagikannya di Facebook. Anda juga dapat menampilkan tombol Bagikan di samping tombol Suka untuk memungkinkan orang menambahkan pesan pribadi dan menyesuaikan dengan siapa mereka akan membagikan.
Konfigurator Tombol SukaContoh KodePengaturanMenyesuaikan BahasaPertanyaan Umum

Langkah Praktis

1. Pilih URL atau Halaman

Pilih URL dari situs web atau Halaman Facebook yang ingin Anda gunakan dengan tombol suka.

2. Konfigurator Kode

Tempelkan URL ke konfigurator kode dan sesuaikan pengaturan seperti width tombol suka Anda. Klik tombol Get Code untuk membuat kode tombol suka Anda.

3. Salin & Tempelkan snippet HTML

Salin dan tempelkan snippet ke dalam HTML situs web tujuan.

Konfigurator Tombol Suka

URL untuk Menyukai
Width
Tata letak
Jenis Tindakan
Ukuran Tombol

Contoh Kode Lengkap

Salin & tempelkan contoh kode ke situs web Anda. Sesuaikan nilai data-href ke URL situs web Anda. Berikutnya, gunakan tag meta og:*** untuk menyesuaikan pratinjau tautan Anda. og:url dan data-hrefharus menggunakan URL yang sama.
<html>
<head>
 <title>Your Website Title</title>
    <!-- You can use open graph tags to customize link previews.
    Learn more: https://developers.facebook.com/docs/sharing/webmasters -->
 <meta property="og:url"           content="http://www.your-domain.com/your-page.html" />
 <meta property="og:type"          content="website" />
 <meta property="og:title"         content="Your Website Title" />
 <meta property="og:description"   content="Your description" />
 <meta property="og:image"         content="http://www.your-domain.com/path/image.jpg" />
</head>
<body>

 <!-- Load Facebook SDK for JavaScript -->
 <div id="fb-root"></div>
 <script>(function(d, s, id) {
   var js, fjs = d.getElementsByTagName(s)[0];
   if (d.getElementById(id)) return;
   js = d.createElement(s); js.id = id;
   js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1";
   fjs.parentNode.insertBefore(js, fjs);
 }(document, 'script', 'facebook-jssdk'));</script>

 <!-- Your like button code -->
 <div class="fb-like" 
  data-href="http://www.your-domain.com/your-page.html" 
  data-layout="standard" 
  data-action="like" 
  data-show-faces="true">
 </div>

</body>
</html>
Menyesuaikan Pratinjau Tautan

Pengaturan

Selain pengaturan di atas, Anda juga dapat mengubah hal berikut:
PengaturanAtribut HTML5DeskripsiDefault
actiondata-actionKata kerja yang akan ditampilkan di tombol. Dapat berupa like ataurecommendlike
colorschemedata-colorschemeSkema warna yang digunakan plugin untuk setiap teks di luar tombol itu sendiri. Dapat berupa lightatau dark.light
hrefdata-hrefURL absolut halaman yang akan disukai.URL saat ini.
kid_directed_sitedata-kid-directed-siteJika situs web atau layanan online Anda, atau bagian dari layanan Anda, ditujukan untuk anak-anak yang berusia di bawah 13 tahun,Anda harus mengaktifkan inifalse
layoutdata-layoutPilih salah satu dari beragam tata letak yang tersedia untuk plugin. Dapat berupastandard,button_count,button, ataubox_count. LihatPertanyaan Umumuntuk penjelasan selengkapnya.standard
refdata-refLabel untuk melacak referal harus kurang dari 50 karakter dan dapat berisi karakter alfanumerik dan beberapa tanda baca (saat ini +/=-.:_). LihatPertanyaan Umumuntuk penjelasan selengkapnya.Tidak Ada
sharedata-shareTentukan apakah ingin menyertakan tombol bagikan di samping tombol Suka. Ini hanya berfungsi dengan versi XFBML.false
show_facesdata-show-facesMenentukan apakah akan menampilkan foto profil di bawah tombol (hanya tata letak standar) atau tidak. Anda harus mengaktifkan ini di situs yang ditujukan untuk anak-anak.false
sizedata-sizeTombol ditawarkan dalam 2 ukuran, yaitularge dan small.small
widthdata-widthLebar plugin (hanya tata letak standar), sesuai dengan lebar minimal dan default. Harap lihat Pengaturan Tata Letak di bawah untuk perincian selengkapnya.Lihat standard diPengaturan Tata Letak

Pengaturan Tata Letak

Terdapat opsi berikut:
Tata LetakUkuran Default
standardLebar minimal: 225 piksel.
Lebar default: 450 piksel.
Tinggi: 35 piksel (tanpa foto) atau 80 piksel (dengan foto).
box_countLebar minimal: 55 piksel.
Lebar default: 55 piksel.
Tinggi: 65 piksel.
button_countLebar minimal: 90 piksel.
Lebar default: 90 piksel.
Tinggi: 20 piksel.
buttonLebar minimal: 47 piksel.
Lebar default: 47 piksel.
Tinggi: 20 piksel.

Menyesuaikan Bahasa

Anda dapat menyesuaikan bahasa Tombol Suka dengan memuat SDK JavaScript Facebook dengan versi yang telah dilokalkan. Ketika memuat SDK, sesuaikan nilai js.src untuk menggunakan lokale Anda: Cukup ganti en_US dengan bahasa Anda, mis. fr_FR untuk bahasa Prancis (Prancis):
js.src = "//connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v2.8“; 
Lokale yang didukung tercantum di file XML Lokale Facebook. Anda mungkin harus menyesuaikan lebar Plugin Sosial untuk menampung bahasa yang berbeda. Anda dapat menemukan informasi selengkapnya di halaman Pelokalan & Terjemahan kami.
Latest
Next Post

0 komentar: