10 Langkah Convert Elementor ke Bricks Builder di WordPress

Namun, apa yang terjadi jika kamu sudah membangun website menggunakan Elementor dan ingin memindahkannya ke Bricks Builder? Tenang, kami akan memberikan panduan lengkap tentang cara convert Elementor ke Bricks Builder di WordPress secara mudah dan tanpa ribet.

Keunggulan Bricks Builder

Sebelum kita membahas langkah-langkah teknis untuk convert Elementor ke Bricks Builder, ada baiknya kamu tahu dulu mengapa banyak pengguna WordPress kini beralih ke Bricks Builder. Jadi, apa sih keunggulan Bricks Builder dibandingkan Elementor?

• Kecepatan: Bricks Builder dikenal dengan performa yang lebih cepat dibandingkan Elementor, terutama dalam memuat halaman. Ini berarti pengalaman pengguna di situsmu akan lebih baik.
• Kontrol Desain yang Lebih Detail: Bricks Builder memberi kontrol penuh atas elemen desain. Dari margin, padding, hingga efek visual, semuanya bisa diatur dengan lebih mendalam.
• Penggunaan Sumber Daya yang Lebih Efisien: Dibandingkan dengan Elementor yang memuat lebih banyak skrip dan kode, Bricks Builder lebih ringan dan lebih hemat sumber daya.
• Tanpa Kode yang Tidak Diperlukan: Bricks Builder juga membantu mengurangi penggunaan kode yang tidak perlu, menjadikannya lebih efisien, terutama untuk situs dengan trafik tinggi.

Dengan keunggulan Bricks Builder seperti ini, wajar jika kamu ingin beralih dari Elementor ke Bricks Builder untuk pengalaman WordPress yang lebih baik.

Baca Juga: Kamu Tim Gutenberg atau Elementor? Yuk, Cari Tahu Perbedaannya!

Cara Convert dari Elementor ke Bricks Builder

Jika kamu ingin mencoba Bricks Builder namun sudah punya website yang dibuat dengan Elementor, berikut adalah panduan lengkap cara convert Elementor ke Bricks Builder di WordPress. Yuk, kita bahas langkah-langkahnya!

Langkah 1: Backup Website Kamu

Sebelum melakukan migrasi, pastikan kamu membackup website agar semua data aman jika terjadi kesalahan. Ini beberapa langkah yang bisa kamu ikuti:

• Pasang Plugin Backup: Gunakan plugin seperti UpdraftPlus untuk mem-backup file dan database.
• Backup Penuh: Pastikan kamu sudah membackup semua elemen website, termasuk file dan database.
• Buat Web Staging: Web staging bisa dibuat di subdomain (misalnya staging.namadomain.com) atau di subdirektori (misalnya namadomain.com/staging). 
• Install WordPress: Buatkan WordPress baru untuk instalasi WordPress yang akan digunakan sebagai simulasi website setelah convert dari Elementor ke Bricks Builder. 

Langkah 2: Instal Bricks Builder di Situs Staging

Setelah backup, waktunya install Bricks Builder di situs staging yang sudah dibuat.

• Download Bricks Builder: Kunjungi situs Bricks Builder, beli lisensi, dan unduh file ZIP Bricks Builder.
• Install di WordPress: Buka dashboard WordPress, pilih Appearance > Themes > Add New > Upload Theme, dan unggah file ZIP tadi. Setelah itu, aktifkan Bricks Builder di situs staging.

Langkah 3: Instal Plugin Pendukung (Opsional)

Bricks Builder sudah punya banyak fitur bawaan, tetapi kamu bisa menambahkan plugin tambahan untuk pengalaman yang lebih maksimal:

• Plugin Pendukung Bricks: Coba gunakan plugin tambahan seperti Automatic CSS atau BricksExtras untuk styling yang lebih fleksibel.

Langkah 4: Export Konten dari Elementor

Selanjutnya, kamu perlu mengekspor konten dari Elementor ke Bricks Builder. Langkah ini berguna untuk memindahkan konten ke staging.

• Export Post dan Halaman: Di dashboard WordPress, pilih Tools > Export dan ekspor semua post dan halaman.
• Import Konten ke Situs Staging: Buka Tools > Import di staging dan unggah file yang sudah diekspor. Ingat, halaman yang hanya menggunakan elemen Elementor harus dibuat ulang secara manual di Bricks Builder.

Jika file media tidak terimport seluruhnya, coba gunakan plugin seperti WP All Import untuk import file yang lebih lancar, terutama untuk produk WooCommerce.

Langkah 5: Analisis Struktur dan Layout Website

Setelah konten terimport, waktunya untuk memeriksa layout dan struktur website Elementor lama agar bisa kamu terapkan di Bricks Builder.

• Beranda: Catat setiap bagian, urutan, dan style-nya.
• Halaman Utama: Lakukan hal yang sama untuk halaman penting lain seperti About, Services, Blog, dan Contact.
• Elemen Global: Perhatikan juga header, footer, dan elemen global lainnya yang ingin kamu pertahankan.

Langkah 6: Buat Elemen Global di Bricks Builder

Sekarang saatnya membuat ulang elemen global seperti header dan footer di Bricks Builder.

• Header dan Footer: Di Bricks Builder, buka halaman mana saja, klik ikon pengaturan, dan buat style tema baru yang bisa kamu gunakan di seluruh website.
• Template: Pergi ke Bricks > Templates, lalu buat template untuk header dan footer, dan sesuaikan tampilannya sesuai dengan elemen di Elementor.

Langkah 7: Buat Ulang Halaman di Bricks Builder

Untuk halaman yang penting, seperti Homepage, About Us, Halamanan Produk, Halaman Layanan, buat ulang tampilannya secara manual di Bricks Builder:

• Sesuaikan Halaman: Tambahkan sub halaman, kolom, dan elemen agar tampilan mirip dengan desain Elementor sebelumnya.
• Sesuaikan Style: Terapkan font, warna, dan jarak yang sama dengan tampilan asli di Elementor.

Langkah 8: Sesuaikan Konten

Ketika kamu membuat halaman di Bricks Builder, pastikan juga semua konten ditata dengan benar. 

• Edit Konten: Periksa setiap elemen seperti teks, gambar, dan media lainnya untuk memastikan semuanya terletak dengan baik dan tampil rapi.

Langkah 9: Tambahkan Custom CSS dan Kode Khusus

Jika kamu memiliki CSS khusus atau kode tambahan di Elementor, jangan lupa tambahkan juga di Bricks Builder.

• CSS Kustom: Tambahkan CSS di bagian CSS khusus di Bricks Builder.
• Kode Khusus: Masukkan kode khusus (misalnya untuk Google Analytics) di bagian Settings > Custom Code di Bricks.

Langkah 10: Uji & Launching Website

Sebelum memindahkan website ke live, lakukan pengujian untuk memastikan semua berfungsi dengan baik.

• Fungsionalitas: Cek semua tautan, formulir, dan elemen interaktif lainnya untuk memastikan mereka berjalan dengan baik.
• Desain Responsif: Gunakan alat editing responsif di Bricks Builder untuk menyesuaikan tampilan di perangkat mobile dan tablet.
• Uji Kecepatan: Periksa kecepatan website menggunakan Google PageSpeed Insights atau GTmetrix untuk memastikan loading time optimal.

• Review Akhir: Periksa kembali seluruh situs untuk memastikan desain dan fungsinya sesuai dengan yang diinginkan.
• Migrasi ke Live: Setelah yakin, hapus versi Elementor, install ulang WordPress, dan migrasikan hasil kerja dari staging ke live site menggunakan UpdraftPlus atau plugin backup lainnya.

Masalah yang Mungkin Terjadi Selama Convert

Perlu diingat bahwa proses convert Elementor ke Bricks Builder tidak selalu berjalan mulus. Dalam beberapa kasus sering terjadi masalah yang menyebabkan website WordPress yang kamu alihkan tidak sesuai tampilannya dengan versi sebelumnya. 

Berikut beberapa masalah umum yang mungkin terjadi dan cara mengatasinya:

1. Layout Tidak Sesuai

Salah satu kendala paling umum adalah layout yang tidak sesuai antara versi Elementor dan versi Bricks Builder. Masalah ini biasanya disebabkan oleh perbedaan cara kedua builder mengelola margin, padding, atau elemen desain lainnya.

Oleh karena itu, pastikan kamu menggunakan pengaturan standar di Bricks Builder dan cek kembali margin, padding dan elemen desain lainnya. Untuk elemen umum seperti header dan footer, gunakan template Bricks Builder agar layout tetap konsisten di seluruh halaman.

2. Konten Hilang

Kadang, setelah proses migrasi, kamu mungkin mendapati beberapa konten yang tidak muncul, terutama jika konten tersebut dibuat sepenuhnya menggunakan elemen bawaan Elementor. 

Untuk mengatasinya, kamu bisa menggunakan fitur WordPress Export/Import untuk memindahkan post, halaman, dan media dari Elementor ke Bricks. Selain itu, pastikan elemen-elemen teks, gambar, dan tombol sudah ditambahkan ke Bricks sesuai desain aslinya. 

3. Masalah Plugin

Setelah migrasi, tidak semua plugin yang digunakan di Elementor kompatibel dengan Bricks Builder. Hal ini dapat menyebabkan beberapa fitur tidak berjalan seperti yang diharapkan.

Sebagai solusinya, pastikan semua plugin yang digunakan sudah versi terbaru. Jika plugin tidak kompatibel, coba cari plugin yang cocok dengan Bricks Builder. 

Untungnya, Bricks Builder adalah page builder yang memiliki banyak fitur bawaan, sehingga kamu tidak perlu menggunakan plugin tambahan untuk elemen-elemen seperti slider atau galeri. 

4. Desain Responsif Tidak Optimal

Convert dari Elementor ke Bricks mungkin juga menyebabkan desain website terlihat kurang rapi di perangkat mobile atau tablet. Hal ini terjadi karena ada perbedaan pengaturan responsif antara Elementor dan Bricks. 

Bricks Builder menyediakan tools editing untuk perangkat mobile dan tablet. Gunakan tools ini untuk menyesuaikan ukuran font, jarak antar elemen, dan layout agar lebih mobile-friendly. Selalu cek desain website di beberapa perangkat untuk memastikan tampilannya optimal di semua layar.

5. Performa Website Menurun

Meski Bricks Builder dikenal ringan, proses migrasi yang tidak tepat bisa menyebabkan performa website menurun. Untuk solusinya lakukan beberapa tips berikut ini:

• Optimasi Database: Setelah migrasi, bersihkan database dari data atau script yang tidak diperlukan, seperti shortcode Elementor yang tersisa.
• Gunakan Plugin Optimasi: Plugin seperti WP Rocket atau Perfmatters bisa membantu mengoptimalkan performa website.
• Cek Kecepatan Website: Gunakan alat seperti Google PageSpeed Insights atau GTmetrix untuk mengidentifikasi masalah performa dan memperbaikinya.

Kesimpulan

Convert dari Elementor ke Bricks Builder bisa memberikan pengalaman WordPress yang lebih baik, terutama dalam hal kecepatan dan kontrol desain. Jika kamu siap untuk mencoba Bricks Builder di website WordPress kamu, pastikan untuk mempersiapkan langkah-langkah yang sudah dijelaskan di atas.

Untuk memastikan migrasi berjalan lancar dan performa website optimal, kamu juga membutuhkan hosting yang tepat. IDwebhost menawarkan Hosting WordPress murah yang bisa diandalkan untuk mendukung website kamu.