Desain Undangan Terlihat Kaku & Sepi? Tambahkan Animasi Lottie Files Ringan di Halaman Anda!

📌 Apa itu Lottie Files?

Lottie Files adalah format berkas animasi berbasis kode JSON yang dirancang khusus untuk kebutuhan website modern. Animasi Lottie sangat ringan (berukuran jauh lebih kecil dibanding GIF atau video MP4) namun mampu menampilkan visual beresolusi tinggi dengan gerakan super halus (60 frame per second) tanpa membebani kinerja loading halaman web.

📖
Skenario Penggunaan Nyata

Anda ingin menghadirkan animasi kelopak bunga mawar berguguran secara terus-menerus di seksi pembuka undangan. Jika menggunakan animasi format GIF berdurasi 5 detik, file gambarnya bisa mencapai 8MB dan membuat HP tamu menjadi panas saat merendernya. Menggunakan berkas Lottie JSON yang berukuran kurang dari 80KB memberikan efek kelopak bunga berguguran yang tajam tanpa lag sedikit pun.

🛠️ Langkah Memasang Animasi Lottie di Elementor

Langkah 1: Menyiapkan Animasi JSON

Kunjungi situs resmi LottieFiles. Cari kata kunci bertema pernikahan seperti "wedding", "flower", atau "rings". Pilih salah satu animasi gratis, lalu unduh berkas dalam format Lottie JSON.

Langkah 2: Mengatasi Blokir Unggah Berkas JSON di WordPress

Secara default, WordPress memblokir unggahan file berformat JSON karena alasan keamanan. Anda wajib mengizinkannya terlebih dahulu. Anda bisa menggunakan plugin tambahan gratis seperti File Upload Types atau mengaktifkan fitur unfiltered uploads di setelan Elementor.

Langkah 3: Memasang Widget & Upload File

Di editor Elementor, seret widget **Lottie** ke area desain yang diinginkan. Pada setelan widget kiri, pilih **Source > Media File**, lalu unggah berkas JSON yang sudah Anda download tadi ke media library WordPress Anda.

Langkah 4: Menyetel Perilaku Animasi (Playback Settings)

Di bawah menu pengaturan Lottie, aktifkan opsi **Loop** agar animasi berputar terus-menerus. Anda juga bisa mengatur pemicu jalannya animasi pada kolom **Trigger** (pilih *Viewport* agar animasi hanya berputar saat layar digulirkan tamu ke area tersebut).

Langkah 5: Menonton Video Tutorial Detail

Saksikan langkah-langkah praktis mencari animasi Lottie gratis, cara mengupload, dan mengintegrasikannya ke template undangan Luxee Premium di sini:

💡
Pro Tips Performa Halaman

Meskipun animasi Lottie sangat ringan, batasi pemasangannya hanya 2 s.d. 3 file animasi saja dalam satu halaman undangan digital. Memasang terlalu banyak Lottie Files yang berputar serentak dapat menaikkan konsumsi memori RAM browser pada ponsel Android kelas entry-level.

💡 Pertanyaan Sering Ditanya (FAQ)

Instal plugin gratis **File Upload Types** dari direktori WordPress. Buka pengaturannya, cari ekstensi `.json`, centang untuk mengizinkannya, lalu klik Save. Sekarang Anda sudah bisa mengunggah file JSON ke WordPress media library.

Tidak secara langsung. Anda disarankan mengedit warna animasi Lottie terlebih dahulu di editor warna bawaan situs LottieFiles sebelum mendownload berkas JSON-nya.

Tidak. Widget Lottie sudah menjadi widget bawaan yang didukung penuh di Elementor Free maupun Elementor Pro, serta bekerja optimal dengan ekstensi Luxee WidgetKit.

*Terakhir diperbarui: 25-Mei-2026*