2 menit
Dengan Elementor, kamu dapat membuat berbagai desain dengan mudah, salah satunya adalah membuat tampilan mobile dua kolom Elementor yang akan kita bahas dalam artikel ini.
Untuk melakukan ini, kamu tidak perlu atau tidak harus menggunakan Elementor Pro dan juga tidak harus memahami basic coding apapun, namun hanya perlu mengikuti artikel ini saja.
Cara Membuat Tampilan Mobile Dua Kolom Elementor
Jadi langsung saja, tanpa penjelesan lebih lanjut yang mungkin kamu tidak perlu, langsung saja kita ke langkah-langkah membuat tampilan mobile dua kolom Elementor.
1. Buat atau Edit Halaman
Lankah pertama yang perlu kamu lakukan tentu saja membuat atau mengedit halaman atau post yang sudah ada melalui Dashboard WordPress.
Namun apabila kamu belum pernah membuat halaman atau post, maka kamu bisa menambahkannya dari menu Pages > Add New Page untuk halaman, atau Posts > Add New Post untuk menambahkan artikel atau post.
Setelahnya, kamu bisa mengedit halaman tersebut menggunakan Elementor dengan cara klik tombol Edit with Elementor.
2. Buat Kontainer
Setelah berada diahalaman Elementor, selanjutnya kamu bisa membuat kontainer baru, dan karena disini kita akan membuat 2 kolom pada tampilan mobile, maka kamu perlu memilih setidaknya 2 kontainer atau lebih. Misalnya disini menggunakan 4 kontainer awal
3. Tambahkan Konten pada Kontainer
Selanjutnya kamu bisa menambahkan konten apapun didalam kontainer tersebut. Misalnya disini kontainer 1 dan 3 berisi gambar, kemudian kontainer 2 dan 4 akan berisi teks.
4. Ubah Tampilan ke Mobile
Karena disini kita membuat tampilan mobile dua kolom Elementor, maka kita perlu mengubah tampilannya menjadi tampilan mobile.
Untuk melakukan ini, kamu bisa membuka opsi Resposive Mode, kemudian pilih tampilan mobile
5. Sesuaikan Setiap Kontainer
Sekarang karena kamu sudah berada didalam tampilan mobile, maka kamu bisa menyesuaikan tampilan dari setiap kontainer supaya menjadi 2 kolom dengan cara klik opsi Edit Container yang berada di pojok kiri-atas setiap kontainer
Selanjutnya, ubah ukurang Width dari px menjadi persen (%)
Sekarang, kamu hanya perlu mengubah semua ukuran kontainernya menjadi 50% dan tampilan akan berubah menjadi 2 kolom
Sebenarnya, kamu tidak harus menggunakan ukuran 50%, tapi kamu bisa juga mengubahnya dengan ukuran lain sehingga ketika dijumlahkan dari 2 kolom tersebut akan menjadi 100%, misalnya membuat ukuran 20% + 80%
6. Publish Halaman
Apabila kamu sudah yakin dengan desain yang kamu buat, maka kamu bisa langsung menerbitkan halaman tersebut, atau bisa juga menambahkan desain lain supaya lebih menarik, misalnya menambahkan hero slider menggunakan Elementor.
Terima kasih telah berkunjung ke WPGan.com. Dapatkan saldo $100 di Vultr gratis dan deploy servermu sendiri melalui [Halaman Ini]