Panduan Widget FeedKit: Tab Content & Tab Style (Streaming Wishes)
Widget FeedKit Wishes adalah modul etalase perpesanan mandiri yang dirancang untuk menampilkan aliran (streaming) ucapan dan doa restu tamu secara terpisah dari formulir konfirmasi, mendukung pilihan tata letak Vertical Infinite List dengan pemuatan AJAX serta Horizontal Slider Carousel modern dengan navigasi interaktif dan avatar inisial otomatis.
Memahami Kebutuhan Penataan Etalase Doa Restu
Doa restu dan harapan tulus dari para sahabat adalah bagian paling emosional dan berharga dari sebuah website undangan pernikahan. Membaca untaian kata-kata indah yang dituliskan para kerabat memberikan kehangatan mendalam bagi pasangan pengantin dan keluarga besar.
Namun, menempelkan daftar panjang ucapan doa tepat di bawah formulir kehadiran tidak selalu menjadi pilihan tata letak yang ideal. Pada konsep desain website yang memprioritaskan estetika minimalis, daftar ucapan yang terlalu panjang dapat merusak ritme visual dan membebani pengunjung saat menggulir halaman. Terlebih lagi, pengantin sering kali menginginkan ucapan doa ditampilkan di seksi khusus yang terpisah, atau bahkan ditayangkan secara berputar (carousel) di layar LED panggung resepsi.
WDP RSVPKit menghadirkan solusi berupa widget mandiri FeedKit Wishes. Widget ini memberikan kebebasan penuh bagi desainer untuk menempatkan panggung doa restu di mana pun pada struktur halaman, lengkap dengan kontrol tata letak vertikal maupun horizontal carousel yang anggun.
Prasyarat Sebelum Konfigurasi
Pastikan hal-hal berikut telah siap sebelum memasang widget:
- Data Respon Terkumpul: Minimal terdapat 2 hingga 3 data ucapan doa uji coba agar hasil penataan layout dapat langsung diamati di kanvas Elementor.
- Container Khusus Siap: Siapkan seksi container terpisah pada halaman undangan tempat etalase doa ingin ditampilkan.
- Pilihan Konsep Tata Letak: Tentukan apakah ingin menggunakan gaya daftar vertikal (Vertical List) atau komidi putar geser (Slider Carousel).
Bedah Mendalam Fitur Widget FeedKit (Tab Content & Style)
Cari widget FeedKit Wishes di panel widget Elementor sebelah kiri, seret ke kanvas, lalu sesuaikan konfigurasinya:
1. Tab Content: Sumber Data & Tata Letak (Layout)
Modul utama penentu aliran data dan gaya pergerakan ucapan:
- Data Source Selection:
- Current Post (Otomatis): Menampilkan data ucapan yang masuk khusus untuk lembar undangan yang sedang diedit.
- Custom Post ID: Mengambil data ucapan dari postingan undangan lain. Sangat berguna jika Anda memiliki halaman rekapitulasi doa terpusat untuk keluarga besar.
- Layout Display Mode:
- Mode 1: Vertical Infinite List: Menampilkan ucapan dalam bentuk deretan gelembung ke bawah dengan scrollbar halus dan tombol Muat Ucapan Lainnya (AJAX) tanpa memuat ulang halaman.
- Mode 2: Horizontal Slider Carousel: Menampilkan kartu ucapan dalam format slider geser modern. Setiap slide menampilkan 1 hingga 3 kartu doa sekaligus dengan animasi geser yang mulus.
- Carousel Controls (Khusus Mode Slider):
- Autoplay Switcher: Mengaktifkan perputaran otomatis kartu ucapan.
- Autoplay Speed: Mengatur durasi waktu perpindahan slide (rekomendasi: 4000ms hingga 6000ms agar tamu sempat membaca pesan).
- Pause on Hover: Menghentikan perputaran sementara saat pengunjung mengarahkan kursor mouse ke atas kartu.
- Navigation Elements: Menampilkan tombol panah samping (Next/Prev Arrows) dan titik indikator (Dots Pagination).
2. Tab Content: Filter & Tampilan Komponen
Mengatur elemen apa saja yang ingin diperlihatkan pada setiap kartu doa:
- Responses Per Slide / Per Page: Menentukan jumlah kartu doa yang ditampilkan.
- Show Attendance Badge: Menampilkan lencana konfirmasi (Hadir atau Berhalangan) di samping nama pengirim ucapan.
- Show Relative Time: Format waktu pengiriman yang ramah pembaca (contoh: 2 jam yang lalu atau Kemarin).
- Enable Stickers Rendering: Menampilkan stiker reaksi animasi yang dipilih oleh tamu.
3. Tab Style: Kustomisasi Kartu & Tipografi (Zero-CSS)
Menyesuaikan seluruh detail estetika agar selaras dengan tema undangan:
- Wishes Bubble Card: Pengaturan warna latar belakang kartu, ketebalan border emas, lengkungan sudut (border-radius), serta efek bayangan halus (box-shadow).
- Avatar Inisial Bulat: Mengatur ukuran diameter lingkaran avatar inisial (default: 36px), warna latar lingkaran, serta jenis font huruf inisial nama.
- Guest Name Typography: Tipografi judul nama pengirim doa agar terlihat tegas dan berkarakter.
- Wishes Message Typography: Pengaturan ukuran, tinggi baris (line-height), dan warna teks pesan doa restu agar sangat nyaman dibaca.
- Slider Navigation Arrows Style: Penataan warna lingkaran tombol panah geser, warna ikon panah, dan efek sorot saat disentuh.
Tabel Parameter Kontrol Widget FeedKit
| Nama Kontrol Elementor | Tab Pengaturan | Nilai Pilihan | Fungsi Teknis |
|---|---|---|---|
feed_data_source | Content > Source | current / custom_id | Sumber asal rekaman data doa restu |
feed_layout_mode | Content > Layout | vertical / carousel | Pilihan tata letak daftar atau slider |
carousel_autoplay | Content > Slider | yes / no | Saklar perputaran otomatis kartu slider |
carousel_speed | Content > Slider | 5000 (Milidetik) | Kecepatan jeda perpindahan slide |
show_avatar_initial | Content > Display | yes / no | Menampilkan lingkaran inisial nama tamu |
bubble_card_bg | Style > Bubble Card | Color Picker | Warna latar belakang kartu gelembung ucapan |
arrow_nav_color | Style > Navigation | Color Picker | Warna tombol panah navigasi carousel |
Skenario Praktik Lapangan: Andy & Zhea
Vendor pernikahan Andy & Zhea merancang konsep etalase doa restu yang memukau bagi kedua mempelai:
- Pemisahan dari Form: Formulir RSVP diletakkan pada seksi konfirmasi tengah halaman dengan toggle feed bawaan dinonaktifkan.
- Pemasangan di Seksi Penutup: Di bagian akhir halaman sebelum footer, vendor menambahkan widget FeedKit Wishes baru di dalam container berlatar gelap elegan.
- Penerapan Mode Slider Carousel:
- Layout diatur ke Horizontal Slider Carousel.
- Autoplay diaktifkan dengan durasi kecepatan 5 detik dan efek Pause on Hover.
- Navigasi panah diberi aksen emas redup (
#C89556).
- Hasil Tampilan: Pengunjung disuguhkan panggung doa restu yang bergerak lembut secara otomatis. Calon pengantin dan para kerabat sangat terkesan dengan kesan eksklusif dan dinamis yang dihadirkan oleh widget FeedKit.
Tips & Praktik Terbaik Konfigurasi FeedKit
- Pilih Mode Sesuai Ruang Halaman: Gunakan mode Vertical List jika ruang halaman Anda sempit atau diletakkan di sidebar, dan gunakan mode Carousel Slider untuk seksi lebar penuh (full-width section).
- Jangan Setel Autoplay Terlalu Cepat: Berikan waktu minimal 5 detik per slide agar tamu lanjut usia memiliki waktu yang cukup untuk membaca doa restu yang panjang.
- Manfaatkan Avatar Inisial Otomatis: Menyalakan avatar inisial memberikan variasi warna visual yang menyegarkan pada daftar ucapan tanpa membebani browser dengan berkas foto eksternal.