Tombol Suka untuk Web

Perubahan Plugin Sosial di Wilayah Eropa

Anda mungkin mulai melihat beberapa dampak pada Plugin Sosial karena permintaan persetujuan cookie yang diperbarui yang akan ditampilkan kepada orang-orang yang menggunakan produk Facebook di Wilayah Eropa. Kami tidak akan lagi mendukung Plugin Sosial "Suka" dan "Komentar" untuk pengguna Wilayah Eropa, kecuali jika keduanya 1) Masuk ke akun Facebook mereka, dan 2) telah memberikan persetujuan untuk kontrol "Cookie Aplikasi dan Situs Web". Jika kedua persyaratan ini terpenuhi, pengguna akan dapat melihat dan berinteraksi dengan plugin seperti tombol "Suka" atau "Komentar". Jika salah satu persyaratan di atas tidak terpenuhi, pengguna tidak akan dapat melihat plugin.

Wilayah Eropa adalah daftar negara tertentu yang meliputi:

Uni Eropa (EU): Austria, Belgia, Bulgaria, Kroasia, Republik Siprus, Republik Ceko, Denmark, Estonia, Finlandia, Prancis, Jerman, Yunani, Hongaria, Irlandia, Italia, Latvia, Lituania, Luksemburg, Malta, Belanda, Polandia, Portugal, Rumania, Slowakia, Slovenia, Spanyol, Swedia
Non-Anggota Uni Eropa, tetapi di wilayah Hanya EEA/EFTA atau Serikat Pabean: [Hanya EEA/EFTA] Islandia, Liechtenstein, dan Norwegia; Swiss: [Serikat Pabean Uni Eropa] seluruh Kepulauan Channel, Pulau Man, Monako; Pangkalan kedaulatan Kerajaan Inggris Raya di Siprus; [Serikat Pabean Eropa] Andorra, San Marino, Kota Vatikan.
Non-anggota Uni Eropa, tetapi bagian dari Wilayah Terluar Eropa (OMR): Martinik, Mayotte, Guadeloupe, Guyana Prancis, Réunion, Saint-Martin, Madeira, Azores, Kepulauan Canaria.
Inggris Raya (semua Kepulauan Britania)

Mendapatkan Tombol Suka yang Disesuaikan

Gunakan Konfigurator Tombol Suka untuk mendapatkan kode Tombol Suka untuk disisipkan ke halaman web.

Tetapkan URL halaman web tempat tombol Suka
Sesuaikan tombol Suka
Lihat cuplikan tombol
Klik Dapatkan Kode, lalu salin dan tempel kode ke halaman web

Konfigurator Tombol Suka

URL untuk Menyukai

Width

Tata letak

standard

Jenis Tindakan

Ukuran Tombol

small

Sertakan Tombol Bagikan

Dapatkan Kode

Gunakan menggunakan tanda grafik terbuka untuk mengedit cuplikan tautan. Tanda og:url dan atribut data-ref harus berupa URL yang sama.

Contoh Kode Lengkap

Diformat agar mudah dibaca.

<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="https://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="https://www.your-domain.com/path/image.jpg" />
</head>
<body>

  <!-- Load Facebook SDK for JavaScript -->
  <div id="fb-root"></div>
  <script async defer crossorigin="anonymous" 
        src="https://connect.facebook.net/en_US/sdk.js#xfbml=1
             &version={graph-api-version}
             &appId={your-facebook-app-id}" 
        nonce="FOKrbAYI">
  </script>

  <!-- Your like button code -->
  <div class="fb-like" 
       data-href="https://www.your-domain.com/your-page.html" 
       data-width=""
       data-layout="standard" 
       data-action="like" 
       data-size="small"  
       data-share="true">
  </div>

</body>
</html>

Atribut HTML5 Tombol Suka

Atribut HTML5	Deskripsi
`data-action`	Kata kerja yang akan ditampilkan di tombol tersebut. Dapat berupa `like` (default) atau `recommend`.
`data-colorscheme`	Skema warna yang digunakan plugin untuk teks di luar tombol itu sendiri. Dapat berupa `light` (default) atau `dark`.
`data-href`	URL halaman web yang akan disukai.
`data-kid-directed-site`	Jika situs web atau layanan online, atau bagian layanan Anda, ditujukan untuk anak-anak berusia di bawah 13 tahun Anda harus mengaturnya menjadi `true`. Nilai default-nya adalah `false`.
`data-layout`	Pilih salah satu dari beragam tata letak yang tersedia untuk plugin. Dapat berupa salah satu `standard` (default), `button_count`, `button` atau `box_count`. Lihat Pertanyaan Umum untuk detail selengkapnya.
`data-lazy`	`true` berarti menggunakan mekanisme pemuatan lazy-loading untuk browser dengan mengatur atribut iframe `loading="lazy"`. Efeknya adalah browser tidak me-render plugin jika tidak dekat dengan viewport dan mungkin tidak pernah terlihat. Dapat berupa salah satu dari `true` atau `false` (default).
`data-ref`	Label untuk melacak perujuk harus kurang dari 50 karakter dan dapat berisi karakter alfanumerik dan beberapa tanda baca (saat ini +/=-.:_). Lihat Pertanyaan Umum untuk detail selengkapnya.
`data-share`	Menentukan apakah menyertakan tombol bagikan selain tombol Suka, `true` atau `false` (default). Ini hanya berfungsi dengan versi XFBML.
`data-size`	Tombol ditawarkan dalam 2 ukuran, yaitu `large` dan `small` (default).
`data-width`	Lebar plugin (hanya tata letak standar), sesuai dengan lebar minimal dan default. Lihat tabel Pengaturan Tata Letak untuk detail selengkapnya.

Pengaturan Tata Letak

Pengaturan Tata Letak bersifat opsional.

Tata Letak	Ukuran Default
`standard`	Lebar minimal: 225 piksel. Lebar default: 450 piksel. Tinggi: 35 piksel (tanpa foto) atau 80 piksel (dengan foto).
`box_count`	Lebar minimal: 55 piksel. Lebar default: 55 piksel. Tinggi: 65 piksel.
`button_count`	Lebar minimal: 90 piksel. Lebar default: 90 piksel. Tinggi: 20 piksel.
`button`	Lebar minimal: 47 piksel. Lebar default: 47 piksel. Tinggi: 20 piksel.

Mengubah Bahasa

Anda dapat mengubah bahasa Tombol Suka dengan memuat Facebook SDK for JavaScript dengan versi yang sudah dilokalkan. Ganti en_US dengan bahasa Anda, misalnya, fr_FR untuk Prancis (Prancis).

js.src = "https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&version={graph-api-version} />";

Lebar Plugin Sosial mungkin perlu disesuaikan untuk mengakomodasi berbagai bahasa.