Cara menambahkan popup ke situs Framer tanpa developer
Panduan langkah demi langkah untuk popup di Framer: pasang satu baris, tulis modal di editor Clew, dan tentukan kapan muncul — setelah beberapa detik, saat di-scroll, atau pada kunjungan ulang — tanpa menyentuh tema lagi.
- Waktu
- ● 10 menit
- Harga
- Uji coba gratis 14 hari, tanpa kartu
- Siapa yang mengerjakan
- Editor situs Framer
Contoh: popup di Framer
Sebuah startup meluncurkan versi 2 dan situsnya dibuat di Framer. Selama lima detik pengunjung melihat beranda baru; lalu modal “v2 sudah rilis — tonton tur 90 detik” muncul sekali, dengan tautan ke video peluncuran.
Format ini termasuk dalam paket Pro. Setiap akun baru dimulai dengan uji coba gratis 14 hari dengan semua format dan aturan audiens, tanpa kartu. Setelah uji coba berakhir, tidak ada yang dihapus dan yang sudah dipublikasikan tetap tampil; tur dan tooltip tetap gratis di paket Free.
Cara menambahkan popup di Framer, langkah demi langkah
- Langkah 01
Salin snippet Clew Anda
Buat akun gratis (atau masuk), tambahkan situs Anda, lalu buka Ringkasan di admin. Klik baris pada kartu Belum ada sinyal dari widget. untuk menyalinnya: baris itu sudah berisi kunci situs asli Anda, bukan placeholder.
<!-- Clew: ganti TEMPEL_KUNCI_SITUS_ANDA dengan kunci situs dari Admin > Ringkasan --> <script src="https://tryclew.io/widget/TEMPEL_KUNCI_SITUS_ANDA.js" async></script>

Langkah 1 · ilustrasi skematis - Langkah 02
Buka Site settings → Custom code
Di proyek Framer Anda buka Site settings dan bagian Custom code. Fitur ini butuh paket situs berbayar.

Langkah 2 · ilustrasi skematis - Langkah 03
Tempel di akhir head
Tempel baris Clew ke End of <head> tag lalu simpan.

Langkah 3 · ilustrasi skematis - Langkah 04
Publikasikan
Klik Publish. Kode berjalan di situs yang dipublikasikan, bukan di pratinjau canvas.

Langkah 4 · ilustrasi skematis - Langkah 05
Tulis popup di Clew
Di Clew buka Alur → + Alur baru, lalu atur Format ke Jendela modal. Tambahkan satu langkah: judul singkat, satu atau dua kalimat, dan di Teks link / URL link isi teks tombol serta halaman yang dibukanya. Modal tidak butuh selector: selalu tampil di tengah.

Langkah 5 · ilustrasi skematis - Langkah 06
Tentukan di mana, kapan, dan untuk siapa tampil
Di editor yang sama, isi Di mana ditampilkan (URL halaman), Kapan ditampilkan, Target audiens, dan Frekuensi. Ini pengaturan untuk contoh di atas:
Pengaturan Nilai Format Jendela modal Di mana ditampilkan (URL halaman) Path persis /Kapan ditampilkan Setelah N detik: 5 detik Target audiens Tanpa aturan: semua yang membuka halaman Frekuensi Sekali per pengunjung 
Langkah 6 · ilustrasi skematis - Langkah 07
Publikasikan dan cek di situs live
Ubah Status menjadi Terbit lalu simpan. Buka halaman di jendela privat: Clew mengingat siapa yang sudah melihat item “sekali”, jadi browser yang biasa Anda pakai mungkin melewatinya. Tayangan, penyelesaian, dan titik berhenti muncul di statistik.

Langkah 7 · ilustrasi skematis
Jebakan umum: popup di Framer
Framer berpindah halaman tanpa reload penuh
Berpindah antarhalaman tidak memuat ulang dokumen. Widget mengikuti perubahan rute ini sendiri, jadi popup yang terikat ke URL halaman tetap muncul saat pengunjung tiba di sana.
Nama class hasil generate
Nama class Framer seperti framer-1x2y3z bisa berubah setelah diedit. Modal tidak butuh selector; jika nanti Anda menambahkan tooltip, cek lagi di Kesehatan setelah publish ulang.
Jangan ditumpuk dengan popup bawaan builder
Jika tema atau plugin sudah menampilkan popup newsletter atau cookie di halaman yang sama, pengunjung melihat dua lapisan. Matikan salah satunya atau beri Clew pemicu lain (scroll atau kunjungan kedua).
Tanya jawab
Bisakah saya mengubah teks tanpa publish ulang di Framer?
Bisa. Popup ada di Clew: edit dan simpan, dan situs live menampilkan teks baru pada tampilan halaman berikutnya.
Apakah skor kecepatan Framer turun?
Baris ini async dan memuat skrip kecil tanpa dependensi setelah halaman; tidak memblokir rendering.
Bisakah popup hanya tampil di satu halaman?
Bisa. Pasang baris kode di seluruh situs, lalu pilih Path persis atau Bagian berdasarkan prefiks di Di mana ditampilkan (URL halaman). Popup tidak akan muncul di halaman lain.
Apakah popup gratis?
Format modal termasuk dalam Pro; akun baru mendapat uji coba 14 hari dengan semua fitur, tanpa kartu. Tur dan tooltip gratis di paket Free.
Tombolnya mengarah ke mana?
Ke halaman mana pun yang Anda isi di URL link. Halaman itu terbuka di tab baru, jadi pengunjung tidak kehilangan halaman yang sedang dibuka.
Popup di platform lain
- ShopifyCara menambahkan popup ke toko Shopify tanpa developer
- WordPressCara menambahkan popup ke situs WordPress tanpa developer
- WebflowCara menambahkan popup ke situs Webflow tanpa developer
- WixCara menambahkan popup ke situs Wix tanpa developer
- Google Tag ManagerCara menambahkan popup ke situs Anda lewat Google Tag Manager tanpa developer