Memasang Widget

Widget ProofKit menampilkan testimoni project Anda di website. Ada dua cara memasang: kode embed langsung (universal) atau integrasi platform (WordPress, Shopify, dll).

1. Ambil kode embed

1. Buka dashboard → Project → pilih project Anda.
2. Klik Widget (atau Embed).
3. Pilih tipe widget (lihat Tipe Widget):
   • wall — dinding testimoni (default)
   • rating — ringkasan rating bintang
   • fomo — popup notifikasi
   • stats — penghitung statistik
4. Pilih bahasa: id (Indonesia) atau en (English).
5. Salin kode yang ditampilkan.

2. Dua metode embed

Metode 1 — iFrame (paling universal)

<iframe
  src="https://proofkit.web.id/api/widget/NAMA-SLUG?type=wall&lang=id"
  style="width:100%;border:0;min-height:200px;overflow:hidden;"
  id="proofkit-frame"
  loading="lazy"></iframe>
<script>
window.addEventListener('message', function (e) {
  if (e.data && e.data.type === 'proofkit:resize') {
    var f = document.getElementById('proofkit-frame');
    if (f) f.style.height = e.data.height + 'px';
  }
});
</script>

Metode 2 — JS Loader (satu baris)

<script async src="https://proofkit.web.id/embed.js?slug=NAMA-SLUG&type=wall&lang=id&height=400"></script>

Parameter	Nilai	Default
slug	Slug project Anda	wajib
type	wall, rating, fomo, stats	wall
lang	id, en	id
height	100–2000 px	400

Ganti NAMA-SLUG dengan slug project Anda (bagian akhir dari https://proofkit.web.id/c/{slug}).

3. Tempel ke website

• WordPress → pakai plugin resmi (shortcode atau blok Gutenberg).
• Shopify → pakai snippet Liquid.
• Webflow / Wix / Squarespace / Framer / Carrd → pakai embed HTML.
• Website custom → tempel kode di atas langsung ke HTML.

Auto-resize

Widget menyesuaikan tinggi otomatis: halaman iframe mengirim pesan proofkit:resize dan script di halaman Anda memperbarui tinggi iframe. Pastikan script listener ikut terpasang (sudah termasuk di kode embed).