Widget siap pasang

Widget Cek Kode Pos – langsung tampil dan responsif.

Perkaya situs atau landing page Anda dengan pencarian kode pos seluruh Indonesia. Widget kami ringan, mendukung mode gelap, otomatis menyesuaikan tinggi iframe, dan dapat dikustom melalui atribut data-*.

Coba snippet Lihat dokumentasi
Live preview

Kenapa widget cek kode pos ini cocok untuk semua platform?

  • Cukup satu snippet HTML Embed pada WordPress, Blogger, Wix, Notion, Shopify, hingga proyek static HTML tanpa konfigurasi tambahan.
  • Responsif & ringan Ukuran skrip < 35 KB, otomatis menyesuaikan tinggi iframe, serta memanfaatkan caching CDN.
  • Mudah dikustom Atur warna utama, mode tema, radius sudut, sampai pencarian otomatis menggunakan atribut data-*.

Kode HTML siap tempel

<div class="coid-widget" data-mode="kodepos" data-path="/widget/kodepos-card" data-theme="auto" data-primary="#2563eb" data-credit-outside="true"></div>
<script async src="https://cek-ongkir.id/static/widget/embed.js"></script>
Contoh favorit: data-primary="#0ea5e9" data-theme="dark" data-query="jakarta selatan" data-auto-search="true"

Cara pasang

  1. Salin snippet HTML di atas.
  2. Tempel ke blok Custom HTML / Code di platform Anda.
  3. Simpan perubahan — widget langsung aktif dan mengikuti tema situs.

Tidak perlu query versi (?v=...); berkas akan otomatis diperbarui melalui cache busting.

Atribut data-* yang tersedia

Sesuaikan tampilan & perilaku widget menggunakan parameter berikut.

Nama atribut Contoh Fungsi
data-mode kodepos Wajib untuk mengaktifkan mode pencarian kode pos.
data-path /widget/kodepos-card Paksa iframe memuat kartu kode pos (aman untuk cache skrip versi lama).
data-theme light / dark / auto Mengatur tema widget agar mengikuti situs Anda.
data-primary #2563eb Menentukan warna utama tombol dan aksen.
data-query bandung wetan Prefill kata kunci pencarian (opsional).
data-auto-search true Otomatis menjalankan pencarian saat halaman dimuat (butuh data-query).
data-radius 20 Atur radius sudut iframe dalam piksel.
data-border false Sembunyikan border default iframe.
data-credit-outside false true menampilkan kredit di luar iframe, false memindahkan ke dalam.
data-min-height 420 Menetapkan tinggi minimum iframe agar layout stabil.
data-lang id Mengatur bahasa antarmuka (default: id).

Contoh penggunaan cepat

Landing page wilayah Prefill data-query agar pengunjung langsung melihat hasil untuk kota tertentu.
Blog panduan Aktifkan data-auto-search supaya hasil otomatis muncul saat halaman dibuka.
Halaman bantuan Gunakan data-credit-outside="false" agar kredit tetap rapi di dalam iframe.
FAQ Widget Kode Pos

Pertanyaan umum sebelum memasang Widget Cek Kode Pos

Temukan jawaban favorit seputar pemasangan, kustomisasi, hingga performa SEO agar pencarian kode pos di situsmu berjalan tanpa hambatan.

Platform apa saja yang mendukung widget kode pos?

Widget siap tempel ini dapat dipasang di WordPress, Blogger, Elementor, Wix, Squarespace, Webflow, hingga situs custom berbasis PHP atau React. Tempel snippet pada blok Custom HTML atau langsung di template Anda.

Apakah widget sudah responsif untuk layar mobile?

Ya. embed.js memastikan tinggi iframe mengikuti konten dan lebar container, sehingga tampilan search dan hasil kode pos tetap rapi di smartphone maupun desktop.

Bagaimana cara mengatur warna dan tema widget?

Gunakan atribut data-theme untuk memilih auto, light, atau dark, ubah warna utama melalui data-primary, dan atur sudut kartu dengan data-radius. Widget mengikuti font default situs agar tampak native.

Apakah widget mempengaruhi kecepatan halaman?

Ukuran script < 35 KB, diload secara async, dan tidak memblokir proses render. Tempatkan snippet mendekati akhir konten untuk menjaga LCP dan skor Core Web Vitals tetap optimal.

Bisakah menampilkan lebih dari satu widget kode pos?

Bisa. Tambahkan beberapa div.coid-widget dengan konfigurasi berbeda seperti data-query atau data-province. Script akan menginisialisasi seluruh widget tanpa konflik.

Apakah pencarian bisa diprefill dan otomatis jalankan?

Anda dapat menggunakan data-query untuk kata kunci awal dan data-auto-search=\"true\" agar hasil muncul langsung ketika halaman dimuat, cocok untuk landing page promosi wilayah tertentu.

Apakah widget aman untuk SEO?

Widget ditampilkan melalui iframe dengan dukungan lazy loading sehingga tidak mengubah struktur heading dan konten utama. Mesin pencari tetap fokus pada teks situs Anda.

Bagaimana jika membutuhkan bantuan pemasangan?

Tim kami dapat dihubungi lewat [email protected] atau melalui preview widget kode pos. Sertakan URL situs agar pengecekan lebih cepat.