Plugin Sosial

Tombol Bagikan

Dengan tombol Bagikan, orang dapat menambahkan pesan yang sudah dipersonalisasi ke tautan sebelum membagikannya di linimasa, di grup, atau kepada teman mereka melalui Pesan Facebook.

Jika aplikasi native Anda adalah untuk iOS atau Android, kami menyarankan Anda menggunakan Dialog Bagikan native di iOS dan Dialog Bagikan native di Android.

Jika situs web Anda tidak memerlukan tombol untuk membuka dialog bagikan atau tombol yang disediakan Facebook tidak cocok dengan desain situs web Anda, Dialog Bagikan Web juga disediakan untuk membagikan tautan. Perhatikan bahwa Anda tidak perlu menggunakan fitur Facebook login atau meminta izin tambahan melalui tinjauan aplikasi untuk menggunakan plugin ini.

Langkah demi Langkah

1. Pilih URL atau Halaman

Pilih URL dari situs web atau Halaman Facebook yang ingin Anda bagikan.

2. Konfigurator Kode

Tempelkan URL ke Konfigurator Kode dan sesuaikan layout dari tombol bagikan. Klik tombol Get Code untuk menghasilkan kode tombol bagikan.

3. Salin & Tempelkan snippet HTML

Salin dan tempelkan snippet ke dalam HTML situs web tujuan.

Konfigurator Tombol Bagikan

URL untuk membagikan
Tata letak
Ukuran Tombol
Dapatkan Kode

Contoh Kode Lengkap

Salin & tempelkan contoh kode ke situs web Anda. Sesuaikan nilai data-href ke URL situs web. Selanjutnya, gunakan tanda meta og:*** untuk menyesuaikan cuplikan tautan. og:url dan data-href harus 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="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>(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 = "https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v3.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<!-- Your share button code -->
<div class="fb-share-button" 
data-href="https://www.your-domain.com/your-page.html" 
data-layout="button_count">
</div>

</body>
</html>

Pengaturan

Pengaturan Atribut HTML5 Keterangan Default

href

data-href

URL absolut halaman yang akan dibagikan.

Versi XFBML dan HTML5 default untuk URL saat ini.

lazy

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).

false

layout

data-layout

Pilih salah satu dari beragam tata letak yang tersedia untuk plugin. Bisa jadi salah satu box_count, button_count, button.

icon_link

mobile_iframe

Berhenti Didukung

data-mobile_iframeJika diatur ke true, tombol bagikan akan membuka dialog bagikan di iframe (bukannya popup) di bagian atas situs web Anda di perangkat seluler. Opsi ini hanya tersedia di perangkat seluler, bukan desktop. Untuk informasi lebih lanjut, lihat Dialog Bagikan Web Seluler.false

size

data-size

Tombol ditawarkan dalam 2 ukuran, yaitu large dan small.

small

Topik Terkait

Pertanyaan Umum Plugin SosialDialog BagikanBerbagi untuk WebmasterSDK Facebook untuk JavaScript