Cara Menambahkan Pop-up di Squarespace

Pelajari cara mengatur pop-up di Squarespace yang sesuai dengan merek dan kebutuhan pengunjung Anda. Tutorial langkah-demi-langkah ini menjelaskan pemasangan, penyesuaian desain, dan pengaturan penargetan sehingga Anda bisa menyampaikan pesan penting secara efektif dan bijaksana.
Lihat pendapat ChatGPT Buka Editor Plugin Langsung
How to Add a Pop Up on Squarespace
Menurut Baymard Institute, tingkat pembatalan keranjang rata-rata adalah 70,22%. Ini merupakan peluang krusial di mana pop-up exit-intent dapat memulihkan penjualan yang hilang dengan melibatkan pelanggan pada momen mereka meninggalkan situs.

Popup Widget, you can launch a fully customized popup in minutes, complete with advanced targeting that ensures your message reaches the right people at the right time.”>Ketika Anda perlu menarik perhatian pengunjung tepat pada momennya—baik untuk mempromosikan penjualan kilat, memperluas daftar email Anda, atau memulihkan keranjang yang ditinggalkan—popup yang dirancang secara strategis menjadi alat konversi Anda yang paling berharga. Menambahkan popup ke situs Squarespace Anda tidak selalu memerlukan keterampilan pengkodean atau bantuan pengembang. Dengan Elfsight’s Popup Widget, Anda bisa meluncurkan popup yang sepenuhnya disesuaikan dalam beberapa menit, lengkap dengan penargetan lanjutan yang memastikan pesan Anda menjangkau orang yang tepat pada waktu yang tepat.

Dalam panduan ini, Anda akan menemukan:



  • Cara tercepat menambahkan pop-up di Squarespace
  • Alur kustomisasi lengkap untuk pop-up yang berfokus pada konversi
  • Perbandingan solusi popup (native vs. pendekatan berbasis widget)
  • Penargetan ahli dan strategi timing yang memaksimalkan hasil

Bagian-bagian berikut memandu Anda melalui seluruh proses: mulai dari menyematkan popup pertama dalam beberapa menit hingga konfigurasi lanjutan yang menghasilkan hasil bisnis yang terukur.

Berikut alur kerja tercepat untuk menambahkan popup di Squarespace tanpa pengkodean:

  1. Buka Elfsight editor dan pilih templat popup.
  2. Sesuaikan konten popup, desain, dan pengaturan penargetan Anda.
  3. ‘Tambahkan ke Situs’ dan salin kode sisip.
  4. Tempel kode tersebut di backend Squarespace Anda.

🚀 Konfigurasikan popup tanpa kode pertama Anda untuk Squarespace di editor langsung kami!

Memahami nilai strategis menyematkan popup di situs Anda membantu Anda memaksimalkan hasil konversi setelah Anda menyelami konfigurasi rinci:

📈 Pulihkan pendapatan yang hilang dengan kampanye exit-intent

Hampir 72% pembeli online meninggalkan keranjang tanpa menyelesaikan pembelian. Saat Anda menambahkan pop-up di Squarespace yang dipicu oleh exit intent, Anda menerapkan sistem kesempatan kedua yang muncul tepat saat pengunjung akan pergi – hampir 1 dari 5 pengunjung berubah pikiran.

💰 Bangun daftar email Anda secara otomatis

Audiens milik melalui email secara signifikan mengungguli iklan berbayar dalam ROI. Ketika Anda menyematkan popup di Squarespace dengan formulir pendaftaran email, setiap pengunjung menjadi calon lead. Rata-rata tingkat interaksi popup sekitar 51%, artinya lebih dari separuh pengunjung Anda terlibat dengan pesan Anda.

🕑 Dorong tindakan seketika dengan penawaran waktu terbatas

Promo kilat dan promosi waktu terbatas kehilangan urgensi saat tersembunyi di situs Anda. Spanduk pop-up yang mengumumkan penawaran terbatas membuat promosi Anda tetap berada di depan dan pusat. Pop-up yang dipicu pada momen yang tepat (setelah waktu di halaman atau kedalaman gulir) memberikan konversi 25% lebih baik daripada pop-up yang ditampilkan segera.

🔄 Segmentasikan audiens Anda tanpa kerumitan

Segmen pengunjung yang berbeda merespons pesan yang berbeda. Pengunjung pertama kali membutuhkan sambutan yang berbeda dari pelanggan yang kembali mengunjungi situs untuk kunjungan ketiga. Saat Anda menambahkan Popup ke Squarespace dengan penargetan bersyarat, Anda bisa menampilkan Popup yang berbeda berdasarkan halaman yang dikunjungi, tipe perangkat, waktu yang dihabiskan, atau kedalaman gulir.

Widget Popup Elfsight menawarkan kemampuan lebih dibanding sistem notifikasi dasar. Inilah bagaimana hal ini dapat membantu Anda mengoptimalkan strategi untuk tujuan bisnis tertentu:

FiturDampak Bisnis
Enam pemicu penargetan presisiTampilkan pop-up saat pemuatan halaman, setelah pengunjung menghabiskan waktu di halaman, pada kedalaman gulir, saat menggulir elemen, saat mengklik, atau saat deteksi niat keluar. Tekankan pesan yang tepat pada saat pengunjung paling responsif.
Integrasi Formulir EmailHubungkan langsung ke Mailchimp, ConvertKit, Klaviyo, atau penyedia email lainnya. Pendaftaran baru secara otomatis menambahkan alamat email ke daftar Anda tanpa entri data manual.
Kode kupon yang bisa disalinTampilkan kode diskon yang bisa disalin pengunjung dengan satu klik. Kupon muncul inline dalam isi popup atau sebagai elemen terpisah, meningkatkan tingkat penukaran penawaran.
Kontrol frekuensi lanjutanTampilkan pop-up setiap kali, sekali per hari, sekali per minggu, atau hanya sekali. Cegah kelelahan popup dengan mengontrol seberapa sering pengunjung yang sama melihat pesannya.
Penargetan Halaman dan PerangkatTampilkan popup hanya pada halaman tertentu atau kecualikan beberapa halaman sepenuhnya. Tampilkan popup berbeda di desktop dibandingkan dengan mobile. Segmentasikan audiens Anda tanpa membuat beberapa versi.
Desain responsif yang menyesuaikan untuk semua layarPopup secara otomatis menyesuaikan ukuran dengan sempurna di desktop, tablet, dan seluler. Tidak diperlukan optimasi seluler terpisah—pop-up Anda terlihat sengaja di setiap perangkat.
Jadwalkan popup berdasarkan tanggal dan waktuLuncurkan promosi musiman atau penawaran dengan batas waktu pada jadwal tetap. Popup akan aktif otomatis pada tanggal yang Anda tentukan tanpa intervensi manual.

Untuk informasi rinci tentang semua opsi yang tersedia, kunjungi halaman Fitur Widget Popup. Sekarang mari kita jalani proses lengkap menambahkan popup ke Squarespace langkah demi langkah.

Bagian ini membimbing Anda melalui setiap tahap membuat dan menyematkan popup Anda di Squarespace, dengan contoh praktis untuk berbagai skenario bisnis.

Langkah 1: Pilih Templat Popup Anda

Saat Anda membuka Editor Popup, langkah pertama adalah memilih templat pemula. Elfsight menawarkan lebih dari 20 templat popup yang dirancang profesional, masing-masing pra-konfigurasi untuk hasil bisnis tertentu. Misalnya, Anda bisa memilih preset Email Capture, Announcement, Discount Offer, atau popup Exit Intent.

Choose Popup template

Pilih templat yang paling sesuai dengan tujuan bisnis Anda saat ini, lalu klik “Lanjutkan dengan templat ini” untuk melanjutkan. Anda selalu bisa menyesuaikannya lebih lanjut setelah berada di editor.

Langkah 2: Tambahkan dan Sesuaikan Blok Konten

Pindah ke tab ‘Builder’ untuk merakit konten popup Anda menggunakan sistem blok fleksibel Elfsight. Anda dapat menambahkan kombinasi elemen berikut:

  • Judul dan Teks – Tulis salinan yang menggugah untuk menjelaskan tawaran Anda dengan jelas
  • Gambar dan Video – Unggah foto produk atau gambar promosi; sematkan video YouTube/Vimeo
  • Tombol dan CTA – Buat tombol yang dapat diklik yang mengarah ke halaman tertentu atau memicu tindakan
  • Formulir Email – Tambahkan bidang penangkapan email yang terhubung ke penyedia email Anda
  • Kode Kupon – Tampilkan kode diskon yang bisa diklik pengunjung untuk menyalin
  • HTML Kustom – Sematkan konten eksternal atau kode kustom untuk kasus penggunaan tingkat lanjut
  • Garis pembatas dan spasi – Susun konten secara visual untuk keterbacaan yang lebih baik
💡 Tip Pro: Tetap fokus popup pada satu tujuan. Entah mengumpulkan email atau mempromosikan diskon, kejelasan meningkatkan konversi. Batasi popup hingga maksimum 3–5 blok.

Add content blocks to popup

3. Sesuaikan Tampilan & Branding

Klik bidang Latar Belakang untuk memastikan popup Anda selaras dengan identitas merek dan sistem desain situs Anda. Anda bisa memilih dari:

  • Warna solid – Pilih dari warna yang tersedia atau tetapkan warna khusus, atur opasitas
  • Latar Belakang Gradien – Atur warna gradien dan arah percampuran
  • Unggah Gambar – Tambahkan gambar dari berkas media Anda untuk digunakan sebagai latar belakang
  • Tautkan Video – Tempel URL YouTube atau Vimeo untuk menjadikan video latar belakang

Customize popup appearance

💡 Tip Profesional: Gunakan kode warna hex resmi merek Anda untuk memperkuat pengenalan merek dan membangun kredibilitas profesional di mata pengunjung.

4. Pilih Tata Letak Popup Anda

Buka tab Layout untuk memilih bagaimana pop-up Anda akan tampil di situs Anda. Elfsight Pop-up menawarkan tiga opsi tata letak yang kuat, masing-masing dirancang untuk berbagai kasus penggunaan dan pengalaman pengguna:

  • Modal (Tengah) – Popup klasik yang berada di tengah halaman Anda dan menutupi konten dengan latar belakang semi-transparan.
  • Geser Masuk – Popup yang meluncur dari sudut layar, tetap terlihat tanpa sepenuhnya menghalangi konten halaman.
  • Pane – Panel khusus yang ditempatkan di tepi kiri atau kanan layar.
Configure popup layout
💡 Tip: Tata letak modal memberikan konversi terbaik untuk penawaran sensitif waktu atau CTA mendesak. Tata letak slide-in bekerja dengan baik untuk popup berbasis niat keluar. Gunakan tata letak Pane untuk notifikasi non-darurat yang bisa direspons pengunjung dengan kecepatan mereka sendiri.

Langkah 5: Tetapkan Pemicu dan Perilaku Tampilan

Buka tab ‘Pengaturan’ untuk menentukan tepat kapan dan bagaimana popup Anda muncul. Di sinilah kemampuan penargetan presisi memberi hasil konversi tertinggi saat Anda menambahkan popup di Squarespace:

  • Saat Halaman Dimuat – Tampilkan segera saat halaman selesai dimuat.
  • Waktu di Halaman – Dipicu setelah pengguna menghabiskan sejumlah detik tertentu di halaman.
  • Saat Gulir (%) – Aktifkan saat pengguna menggulir ke persentase halaman tertentu (50%, 75%, dll.).
  • Saat Menggulir ke Elemen – Tampilkan saat pengguna menggulir melewati elemen tertentu di halaman Anda.
  • Saat Klik – Tampilkan popup saat pengunjung mengklik tombol atau tautan tertentu.
  • Intent Keluar – Dipicu saat pengguna menggerakkan kursor untuk menutup tab atau meninggalkan halaman.
💡 Tip: Anda bisa mengaktifkan beberapa pemicu secara bersamaan — kondisi pertama yang terpenuhi akan mengaktifkan popup. Misalnya, gabungkan Waktu di Halaman (30 detik) dengan Exit Intent untuk menangkap pengunjung terlibat yang hendak pergi.
Set popup triggers

Langkah 6: Atur Frekuensi Tampilkan dan Penargetan

Tetap di tab Pengaturan dan sesuaikan frekuensi, penargetan halaman, dan penargetan perangkat untuk mengoptimalkan jangkauan popup Anda dan menghindari frustrasi pengguna:

  • Opsi Frekuensi. Tentukan seberapa sering popup Anda muncul: setiap kali, hingga ditutup, sekali, setiap hari, atau setiap minggu.
  • Penargetan Halaman – Tentukan halaman mana yang menampilkan popup atau kecualikan halaman tertentu. Tampilkan penawaran khusus hanya di halaman produk, atau sembunyikan popup di halaman checkout
  • Penargetan Perangkat – Pilih apakah popup muncul di desktop, seluler, tablet, atau semua perangkat. Optimalkan untuk pengalaman pengguna yang berbeda pada layar yang lebih kecil.
💡 Tip: Untuk praktik UX terbaik, gunakan pengaturan frekuensi “Tampilkan sekali” atau “Tampilkan setiap hari.” Ini mencegah kelelahan popup sambil tetap memberi Anda beberapa peluang untuk menjangkau pengunjung melalui sesi yang berbeda.

Langkah 7: Dapatkan Kode Instalasi Anda

Setelah popup Anda sepenuhnya dikonfigurasi dan terlihat di pratinjau dengan benar, klik “Tambahkan ke Situs Web”. Salin seluruh cuplikan kode ini ke clipboard Anda. Potongan kode ini menyematkan popup Anda langsung ke Squarespace.

Copy popup installation code

Langkah 8: Tambahkan Popup ke Squarespace

Kini Anda siap menambahkan popup Anda ke halaman langsung. Metode ini bergantung pada versi Squarespace Anda (7.0 atau 7.1) dan di mana Anda ingin popup muncul.

Metode 1: Tambahkan Popup ke Halaman Tertentu (Squarespace 7.1)

Terbaik untuk: Menampilkan popup Anda di satu halaman tertentu, seperti beranda Anda atau halaman arahan.

  1. Masuk ke akun Squarespace Anda dan navigasikan ke Situs → Halaman
  2. Pilih halaman tempat popup akan muncul dan klik Sunting
  3. Klik Tambahkan Bagian dan pilih Tambahkan bagian kosong
  4. Klik tombol Tambahkan blok dan pilih Kode
  5. Klik Sunting ikon dan tempelkan kode popup Elfsight Anda ke dalam popup Konten.
  6. Sesuaikan lebar blok dengan menyeret tepi widget jika perlu
  7. Klik Simpan dan popup Anda akan langsung tampil pada halaman itu
Catatan: Popup Anda hanya muncul di halaman tempat Anda menambahkan kode. Untuk menampilkan popup yang sama di beberapa halaman, Anda perlu mengulang langkah-langkah ini untuk setiap halaman atau gunakan Metode 2 di bawah.

Metode 2: Tambahkan Pop-up ke Halaman Tertentu (Squarespace 7.0)

Terbaik untuk: Situs yang menggunakan platform Squarespace versi lama 7.0.

  1. Masuk ke dasbor Squarespace Anda dan pilih situsnya
  2. Buka Situs Web → Halaman dan pilih halaman yang ingin Anda sunting
  3. Klik Edit tepat di atas bagian tempat Anda ingin popup muncul
  4. Klik ikon ‘+’ untuk menambahkan elemen baru
  5. Pilih Opsi Kode dari menu
  6. Tempel kode popup Elfsight Anda ke dalam popup Konten dan klik Simpan.

Metode 3: Tampilkan Popup di Seluruh Situs (Semua Halaman)

Terbaik untuk: Sempurna untuk tawaran intent keluar yang tetap atau promosi yang selalu aktif.

Untuk menampilkan popup Anda di setiap halaman situs Squarespace Anda, gunakan metode Injeksi Kode:

🗸 Untuk Squarespace 7.1:
  1. Di menu sebelah kiri, klik Website → Pages
  2. Gulir ke bawah menu kiri dan pilih Kode Kustom
  3. Klik Code Injection
  4. Tempel kode popup Anda ke kolom Footer.
  5. Klik Simpan dan popup Anda muncul di setiap halaman
🗸 Untuk Squarespace 7.0:
  1. Arahkan ke Alat Website di menu kiri
  2. Klik Code Injection
  3. Tempel kode popup Anda ke bagian Footer.
  4. Klik Simpan untuk menerapkan perubahan ke seluruh situs
🔧 Pemeriksaan Pemecahan Masalah Cepat: Jika pop-up Anda tidak muncul setelah menempelkan kode, pastikan Anda menyalin seluruh potongan kode tanpa modifikasi, pastikan Anda menggunakan blok Kode (bukan editor teks), segarkan browser Anda sepenuhnya, dan hapus cache.
Jika situs Anda berjalan di CMS lain — kami siap membantu. Jelajahi panduan langkah-demi-langkah kami untuk menambahkan popup keWordPressdanShopify.

Meskipun Elfsight menawarkan kustomisasi yang kuat untuk menyematkan pop-up, ada pendekatan alternatif lain. Setiap pendekatan memiliki kelebihan dan keterbatasannya sendiri yang patut dipahami saat memilih solusi Anda.

Bilah Pengumuman Bawaan Squarespace

Squarespace menyertakan fitur bilah pengumuman bawaan yang tersedia di sebagian besar templat, yang dapat menampilkan pesan penting di seluruh situs.

  1. Akses Pengaturan Situs: Arahkan ke Pengaturan Situs di menu utama
  2. Cari Bilah Pengumuman: Cari opsi Bilah Pengumuman (tersedia tergantung templat)
  3. Aktifkan dan Sesuaikan: Nyalakan Bilah Pengumuman, masukkan pesan Anda, pilih warna, dan atur latar belakang
  4. Atur Pesan: Tambahkan teks promosi Anda, tujuan tautan, dan teks tombol
  5. Publikasikan: Simpan perubahan dan bilah pengumuman Anda muncul di bagian atas setiap halaman
📌 Keterbatasan Utama: Bilah Pengumuman tampil sebagai spanduk tetap di bagian atas atau bawah. Opsi kustomisasi dan pengaturan terbatas, tidak ada opsi pemicu.

Blok Form Pendaftaran Newsletter Squarespace

Squarespace memungkinkan Anda menyematkan formulir pendaftaran email bawaan langsung di halaman, yang menyediakan fungsi penangkapan email dasar.

  1. Sunting Halaman: Buka halaman tempat Anda ingin formulir pendaftaran ditampilkan
  2. Tambahkan Blok Form: Klik ikon ‘+’ dan cari “Newsletter” atau “Form”
  3. Atur Bidang: Tambahkan bidang email dan bidang tambahan opsional untuk nama atau preferensi
  4. Sesuaikan Tampilan: Atur warna, font, teks tombol, dan tata letak
  5. Atur Pesan Sukses: Pilih apa yang terjadi setelah pengiriman formulir (pesan terima kasih, pengalihan, dll.)
  6. Publikasikan: Simpan perubahan Anda dan formulir menjadi elemen halaman tetap
📌 Ketentuan utama: Formulir adalah elemen halaman statis. Tidak ada opsi pemicu. Selalu terlihat. Tidak bisa menggunakan pemicu exit-intent atau berbasis waktu. Kemampuan untuk membagi penawaran berdasarkan perilaku pengunjung atau tipe perangkat terbatas.

Popup Kode Kustom Menggunakan JavaScript

Pengembang tingkat lanjut dapat membuat popup kustom dengan menulis kode JavaScript dan CSS langsung di bagian Penyuntikan Kode Squarespace.

  1. Injeksi Kode Akses: Pergi ke Pengaturan Situs → Injeksi Kode
  2. Tulis HTML untuk Popup: Buat kontainer popup dengan konten pesan di Header atau Footer
  3. Tambahkan CSS untuk Penataan: Tulis CSS kustom untuk memposisikan, menata, dan menganimasikan pop-up
  4. Tambahkan JavaScript untuk Perilaku: Tulis JavaScript untuk menangani pemicu popup, logika buka/tutup, dan pengiriman formulir
  5. Uji secara menyeluruh: Periksa tampilan popup di desktop maupun mobile, pastikan pemicu berfungsi dengan benar
  6. Publikasikan: Simpan kode Anda dan uji langsung di situs web Anda yang telah dipublikasikan
📌 Limitasi Kunci: Membutuhkan pengetahuan JavaScript, HTML, dan CSS tingkat lanjut. Proses debugging memakan waktu. Sulit dipelihara dan diperbarui—perubahan kode kecil bisa memutuskan fungsionalitas.

Perbandingan: Solusi Popup mana yang Pas untuk Situs Squarespace Anda?

Mari kita bandingkan metode ini berdampingan untuk melihat mana yang paling sesuai dengan tujuan bisnis Anda:

SolusiWaktu PenyiapanKustomisasiPemicuTerbaik untuk
Widget Pop-up Elfsight5–10 menitLengkap — 20+ templat, kendali desain penuh6 Pemicu Lanjutan (waktu, gulir, niat keluar, klik, pemuatan, elemen)Pengoptimalan konversi, pengumpulan email, pemulihan keranjang, penawaran yang ditargetkan
Bilah Pengumuman Squarespace2–3 menitTerbatas – opsi teks dasar, warna, dan tautanTidak ada – selalu terlihatPengumuman penting, promosi sederhana yang terlihat untuk semua pengunjung
Blok Formulir Newsletter5 menitSedang – opsi gaya bawaanTidak ada – terlihat sepanjang waktuLangganan email halaman permanen, tidak untuk optimasi konversi
Popup JavaScript Kustom2–4 jam (atau lebih)Lengkap – kendali penuh, tetapi memerlukan pemrogramanImplementasi kustom – membutuhkan kodePengembang yang membutuhkan fungsionalitas sangat khusus

Sekarang setelah Anda memahami opsi-opsi Anda, mari jelajahi praktik terbaik yang memaksimalkan efektivitas saat Anda menambahkan pop-up di Squarespace.

Dari pengalaman tim kami dengan ribuan instalasi popup aktif, beberapa pilihan pengaturan secara konsisten meningkatkan keterlibatan, konversi, dan pendapatan.

  1. Sesuaikan waktu pemicu dengan kesiapan pengunjung. Popup yang ditampilkan segera saat halaman dimuat memiliki performa 25% lebih buruk daripada popup yang dipicu berdasarkan waktu. Tunggu 30–50 detik agar pengunjung terlibat dengan konten Anda sebelum menampilkan tawaran. Popup niat keluar menangkap 17% pengunjung yang meninggalkan. Jadwalkan beberapa pemicu—gabungkan waktu di halaman dengan niat keluar.
  2. Pastikan pesan Anda terfokus pada satu tindakan. Pop-up yang meminta pengunjung memilih antara lima opsi berbeda berkinerja buruk. Setiap pop-up sebaiknya memiliki satu tujuan jelas: pendaftaran email, unduhan, penebusan diskon, atau penyelesaian formulir kontak. Jika Anda perlu menyampaikan beberapa pesan, buat pop-up terpisah dengan pemicu yang berbeda.
  3. Rancang untuk perangkat seluler sebagai pertimbangan utama Anda. Tingkat penolakan keranjang di perangkat seluler mencapai 80% dibandingkan 66% di desktop. Pengguna seluler melihat popup secara berbeda—layar yang lebih kecil berarti ruang lebih sedikit. Uji popup Anda secara menyeluruh pada ponsel sebelum diluncurkan. Kurangi jumlah bidang formulir pada versi seluler. Gunakan tombol besar yang mudah diketuk.
  4. Gunakan bahasa kelangkaan dan urgensi secara strategis. Frasa seperti “Penawaran Waktu Terbatas,” “Hanya 3 Tempat Tersisa,” atau “Berakhir Malam Ini” secara signifikan meningkatkan tingkat konversi. Namun, gunakan frasa-frasa ini secara jujur—urgensi palsu merusak kepercayaan.
  5. Segmentasikan audiens Anda dengan aturan penargetan bersyarat. Beragam segmen pengunjung merespons pesan yang berbeda. Pengunjung pertama kali membutuhkan pesan yang berbeda dari pelanggan yang kembali. Pengunjung pada halaman produk merespons penawaran spesifik produk dengan lebih baik daripada pengunjung di blog Anda. Gunakan penargetan halaman, penargetan perangkat, dan kontrol frekuensi untuk menampilkan pesan yang tepat.
  6. Uji A/B pop-up Anda secara terstruktur. Buat dua versi pop-up Anda dengan judul, gambar, tawaran, atau CTA yang berbeda. Ukur versi mana yang memiliki konversi lebih baik. Ubah satu variabel pada satu waktu agar Anda memahami apa yang mendorong peningkatan. Bahkan perubahan kata-kata kecil (dari “Sign Up” menjadi “Get 15% Off”) dapat meningkatkan konversi sebesar 10–15%.

Berikut pertanyaan umum yang sering diajukan pengguna saat menambahkan popup ke situs Squarespace mereka:

Mengapa popup saya tidak muncul setelah menempelkan kode di Squarespace?

Pertama, pastikan Anda menyalin seluruh cuplikan kode tanpa modifikasi atau pemotongan. Pastikan Anda menggunakan blok Kode, bukan editor teks. Hapus cache peramban Anda sepenuhnya dan muat ulang halaman. Pastikan Anda keluar dari akun atau gunakan jendela penyamaran (kadang pop-up tidak terlihat untuk pemilik situs). Verifikasi bahwa kondisi pemicu terpenuhi—misalnya, jika Anda atur “Saat Digulir,” pastikan Anda telah menggulir ke bawah. Jika masalah tetap ada, periksa konsol peramban untuk kesalahan (tekan F12 dan lihat tab Console). Hubungi dukungan Elfsight dengan URL situs Anda dan mereka bisa memecahkan masalah spesifik pada platform.

Bisakah saya memiliki beberapa popup berbeda di situs Squarespace saya?

Tentu. Buat beberapa pop-up di editor Elfsight, masing-masing dengan konten, pemicu, dan penargetan yang berbeda. Misalnya, buat satu pop-up untuk exit intent dengan tawaran diskon, pop-up lain untuk waktu-halaman yang mempromosikan buletin Anda, dan pop-up ketiga yang hanya muncul di halaman produk. Setiap pop-up memiliki kode sematan uniknya sendiri. Tempelkan setiap kode ke situs Squarespace Anda dan semuanya akan bekerja secara independen. Pastikan mengatur pemicu atau penargetan halaman yang berbeda agar tidak semua muncul bersamaan dan membebani pengunjung.

Apa perbedaan antara tata letak popup modal, slide-in, dan pane?

Popup modal muncul di tengah layar dengan overlay semi-transparan, memblokir konten halaman di belakangnya. Tata letak ini menuntut perhatian maksimal dan paling efektif untuk pesan prioritas tinggi atau tawaran yang sensitif waktu. Popup slide-in muncul dari sudut layar, tetap terlihat sambil pengguna masih bisa berinteraksi dengan konten halaman di bawahnya. Tata letak ini terasa kurang mengganggu dan cocok untuk tawaran dengan niat keluar. Popup pane adalah panel khusus di sisi kiri atau kanan layar. Panel ini tetap terlihat tanpa memblokir konten, menjadikannya ideal untuk pesan berkelanjutan atau formulir multi-langkah.

Apakah popup saya akan memperlambat situs Squarespace saya?

Tidak. Popup Elfsight dimuat secara asinkron, artinya mereka tidak memblokir perenderan halaman Anda. Situs Squarespace Anda dimuat terlebih dahulu, lalu popup dimuat setelahnya. Ini mencegah dampak terhadap metrik kinerja halaman inti. Faktanya, popup sangat ringan dibandingkan elemen situs lainnya. Pengujian kinerja menunjukkan bahwa popup yang diterapkan dengan benar menambahkan waktu muat halaman kurang dari 50ms.

Bisakah saya menampilkan popup berbeda untuk pengunjung pertama kali dibandingkan pelanggan yang kembali?

Anda bisa membagi audiens berdasarkan beberapa karakteristik pengunjung menggunakan kontrol frekuensi Elfsight. Misalnya, atur satu popup menjadi “Tampilkan setiap hari” (untuk pengunjung yang kembali) dan satu lagi menjadi “Tampilkan sekali” (untuk pengunjung pertama kali). Namun, untuk segmentasi yang lebih canggih berdasarkan riwayat kunjungan atau perilaku pembelian, Anda perlu mengintegrasikannya dengan penyedia email Anda atau CRM. Banyak penyedia email menawarkan tampilan popup berbasis segmen berdasarkan status daftar atau penugasan tag.

Apakah saya membutuhkan akun Elfsight untuk menyematkan widget Popup mereka di Squarespace?

Ya. Membuat dan mengelola popup Anda memerlukan akun Elfsight. Kabar baiknya: membuat akun itu gratis, dan Anda dapat membuat popup tanpa batas. Kode sematan terkait dengan akun Anda, sehingga Anda bisa mengedit popup kapan saja dengan masuk ke dashboard Elfsight. Perubahan diperbarui secara langsung di situs Squarespace Anda tanpa perlunya menempelkan ulang kode.

Keberhasilan Popup: Bagaimana situs pariwisata mengubah keterlibatan pengunjung

Let’s Go Peak District, sebuah direktori pariwisata komprehensif yang menghubungkan wisatawan dengan atraksi Peak District, akomodasi, dan pengalaman, membutuhkan cara untuk menyampaikan informasi penting kepada pengunjung situs tanpa membuat tata letak halaman berantakan atau mengganggu pengalaman pengguna.

Sebelum Elfsight

Tim menghadapi tantangan UX yang krusial:

  • Tata letak halaman statis tidak memberi ruang untuk pesan promosi utama atau informasi penting.
  • Pembaharuan penting tentang acara, fitur khusus, dan layanan sering terselip di konten halaman.
  • Membangun solusi popup kustom memerlukan pengetahuan pemrograman dan pemeliharaan berkelanjutan.
  • Sistem notifikasi generik mengurangi pengalaman situs pariwisata kelas premium.

Solusi: Mengimplementasikan Elfsight Popup Widget

Phil mengintegrasikan widget Elfsight Popup di halaman utama untuk menampilkan informasi penting pada momen-momen strategis dalam perjalanan pengguna. Popup ini dirancang agar terasa selaras dengan estetika premium situs — muncul pada waktu yang tepat tanpa terasa mengganggu atau agresif.

Popup Use Case Example

Strategi popup mencakup pemicu yang ditargetkan dan aturan tampilan, memastikan popup muncul hanya saat relevan untuk segmen pengunjung tertentu dan hanya di halaman yang memberikan nilai, bukan menambah gesekan. Pendekatan terarah ini membuat para pelancong mengetahui atraksi baru atau pengalaman musiman pada saat yang paling tepat untuk terlibat.

Hasil Nyata

Setelah mengimplementasikan widget Elfsight Popup:

  • Keterlibatan Pengunjung yang Meningkat: Penempatan popup yang strategis meningkatkan rasio klik pada atraksi dan layanan unggulan tanpa mengganggu pengunjung
  • Arsitektur Informasi yang Lebih Baik: Pesan-pesan kunci kini muncul pada saat yang tepat dalam perjalanan pengguna, meningkatkan kesadaran dan keterlihatan.
  • Peningkatan Persepsi Merek: Desain pop-up yang profesional meningkatkan kualitas yang dirasakan pada platform pariwisata
  • Tidak Mengganggu Desain: Berbeda dengan banner statis tradisional, pop-up muncul secara kontekstual, menjaga tata letak halaman yang bersih dan hierarki visual
  • Uji A/B yang Mudah: Pesan popup dan timing bisa dengan cepat disesuaikan untuk mengoptimalkan konversi dan keterlibatan

Gambaran Besar: Pemasaran Pariwisata Multikanal

“Kami telah banyak menggunakan Formulir Kontak, dan kami menjual widget Ulasan atau Umpan Instagram sebagai upsell atau dengan paket listing kami yang lebih tinggi. Ini bekerja sangat, sangat baik.”

Phil Sproson, Let’s Go Peak District
Event Calendar Use Case Example

Let’s Go Peak District’s use of Popup was just one component of a larger strategy that included the Pricing Table to transparently display advertising packages, Event Calendar to showcase upcoming Peak District activities, and Contact Form to capture tourism business inquiries. By combining these tools, the platform transformed into an interactive ecosystem where travelers find inspiration, discover experiences, and tourism businesses increase their visibility.

🎯 Inti: Popup yang terarah adalah alat konversi yang kuat ketika menghormati pengalaman pengguna. Untuk situs pariwisata, popup yang menampilkan atraksi relevan, pengalaman musiman, atau penawaran khusus pada saat yang tepat dapat mendorong keterlibatan yang berarti tanpa friksi iklan tradisional.

Sekarang Anda siap menambahkan banner popup di Squarespace dan mulai mengonversi pengunjung menjadi pelanggan, pelanggan email, dan anggota komunitas yang terlibat. Mulailah sederhana dengan satu popup fokus—mungkin pendaftaran buletin di beranda Anda atau penawaran exit-intent. Uji selama seminggu, ukur tingkat konversi, dan sesuaikan pesan atau waktunya berdasarkan hasil.

Untuk panduan tambahan, solusi komunitas, atau untuk berbagi kisah sukses pop-up Anda sendiri, hubungi Elfsight melalui forum komunitas kami dan saluran media sosial. Kami di sini untuk mendukung perjalanan optimalisasi konversi Anda di setiap langkah.

Sumber yang dikutip: 50 Cart Abandonment Rate Statistics 2025 – Baymard Institute

Artikel oleh
Spesialis Konten AI
Kristina Tyumeneva membahas topik AI di Elfsight dan Beamtrace: ia menulis tentang AI Chatbot, visibilitas LLM, dan bagaimana AI merombak pencarian serta pengalaman pelanggan—dengan pandangan praktis untuk pemilik situs web dan tim pemasaran yang membutuhkannya agar benar-benar bekerja.