Apakah Anda ingin mempelajari cara menggunakan Elementor di WordPress? Jadi teruslah membaca lebih lanjut.
Elementor dengan cepat memantapkan dirinya sebagai salah satu alat paling kuat dan serbaguna untuk membuat situs web di WordPress. Baik Anda seorang pemula yang ingin mendesain situs pertama Anda atau pengembang berpengalaman yang ingin memanfaatkan fitur-fitur canggih, Elementor menawarkan solusi yang mudah diakses dan komprehensif untuk mewujudkan ide Anda.
Dengan antarmuka yang intuitif, opsi penyesuaian yang luas, dan kemampuan integrasi tingkat lanjut, pembuat halaman visual ini merevolusi cara pengguna WordPress mendesain, mengedit, dan mempublikasikan konten mereka.
Tutorial komprehensif ini akan memandu Anda melalui semua langkah yang diperlukan untuk menguasai Elementor. Anda tidak hanya akan mempelajari cara menginstal dan mengkonfigurasi plugin, tetapi juga cara menggunakan fitur-fiturnya, dari yang paling dasar hingga yang paling canggih.
Baik Anda ingin membuat halaman web yang ramping dan responsif, menyesuaikan tema, atau mengintegrasikan elemen dinamis seperti pop-up dan toko online, panduan ini dirancang untuk memberi Anda pengetahuan yang Anda perlukan di setiap langkah. Di akhir membaca, Anda akan siap untuk memaksimalkan Elementor dan membuat situs web yang mengesankan dengan mudah.
Daftar isi
Apa itu Elementor?
Elementor adalah a WordPress Plugin yang merevolusi desain web dengan menawarkan editor visual drag-and-drop yang mudah digunakan. Diluncurkan pada tahun 2016, Elementor memungkinkan pengguna membuat halaman web yang dinamis dan profesional tanpa perlu membuat kode. Dengan lebih dari 5 juta pemasangan aktif, Elementor dengan cepat memantapkan dirinya sebagai pembuat situs yang wajib dimiliki, baik pemula maupun ahli.
Pentingnya alat ini dalam ekosistem WordPress:
Elementor telah secara signifikan memperluas kemungkinan yang ditawarkan oleh WordPress dengan mendemokratisasi akses ke alat desain yang canggih. Dengan menggunakan Elementor, pengguna kini dapat menyesuaikan setiap aspek situs web mereka, mulai dari header dan footer hingga halaman arsip dan halaman produk.
Plugin ini juga berkontribusi pada pertumbuhan ekosistem WordPress dengan memfasilitasi pembuatan situs yang estetis dan kuat secara teknis.
Rilis dan pembaruan utama:
Sejak diluncurkan, Elementor telah melihat beberapa rilis besar, masing-masing menghadirkan fitur-fitur inovatif. Di antara tambahan yang paling menonjol adalah Pembuat Tema, yang memungkinkan Anda mendesain Tema WordPress lengkap, dan Pembuat Popup, untuk membuat pop-up yang dipersonalisasi.
Setiap pembaruan Elementor disertai dengan peningkatan kinerja, kompatibilitas, dan keamanan, memperkuat posisinya sebagai pemimpin di pasar pembuat halaman.
Versi Elementor yang berbeda
Versi gratis vs. Versi pro:
Elementor tersedia dalam dua versi: versi gratis dan versi Pro. Versi gratisnya menawarkan serangkaian fitur dasar yang memungkinkan Anda membuat halaman web sederhana namun menarik. Ini mencakup widget penting seperti gambar, video, tombol, dan bagian teks.
Di sisi lain, versi Pro membuka fitur-fitur canggih seperti Pembuat Tema, Pembuat WooCommerce, widget premium, dan animasi khusus. Untuk pengguna profesional atau mereka yang menginginkan opsi penyesuaian lebih dalam, Elementor Pro adalah investasi yang berharga.
Paket harga lain yang tersedia:
Elementor Pro menawarkan beberapa paket harga tergantung pada kebutuhan pengguna. Paket “Esensial” ideal untuk satu situs, sedangkan paket “Pakar” dirancang untuk pekerja lepas atau agensi kecil yang mengelola banyak situs.
Ada juga paket “Studio” dan “Agensi” untuk bisnis yang memerlukan fitur lebih canggih dan dukungan prioritas. Opsi ini memungkinkan setiap pengguna untuk memilih paket yang paling sesuai dengan kebutuhan dan anggaran mereka, sambil tetap menikmati fitur lengkap Elementor Pro.
Bagaimana cara kerja Pembuat Halaman Elementor?
Elementor Page Builder adalah alat yang ampuh untuk membuat halaman web yang dipersonalisasi dan interaktif menggunakan antarmuka visual yang intuitif. Bagian ini menjelaskan secara detail cara kerja Elementor, meliputi antarmuka pengguna, konsep drag-and-drop, widget yang tersedia, dan struktur halaman.
Antarmuka Pengguna Elemen
Antarmuka pengguna Elementor dirancang agar intuitif dan dapat diakses oleh semua orang, bahkan bagi pengguna yang tidak memiliki pengalaman pengembangan web. Segera setelah Anda mengakses editor, Anda akan disambut oleh dasbor yang jelas dan terorganisir dengan baik.
Di sebelah kiri Anda akan menemukan panel dengan semua widget dan opsi penyesuaian, sedangkan di sebelah kanan halaman yang sedang Anda kerjakan terlihat secara real time.
Deskripsi alat dan opsi utama:
Antarmuka Elementor terutama terdiri dari tiga bagian: panel widget, area kerja visual, dan toolbar atas. Panel widget di sebelah kiri berisi semua elemen yang dapat Anda tambahkan ke halaman Anda, seperti tombol, gambar, video, dan formulir.
Area kerja visual di sebelah kanan memungkinkan Anda segera melihat perubahan yang Anda buat. Bilah alat bagian atas menawarkan opsi tambahan seperti mengelola pengaturan halaman, menyimpan dan mempublikasikan tindakan, dan kemampuan untuk melihat pratinjau halaman pada berbagai jenis perangkat (desktop, tablet, seluler).
Konsep Seret dan Lepas
Penjelasan cara kerja drag and drop:
Elementor didasarkan pada konsep drag-and-drop, yang berarti Anda dapat memilih widget atau elemen apa pun dari panel kiri dan menyeretnya langsung ke halaman Anda.
Metode ini memungkinkan desain yang cepat dan intuitif, tanpa harus menulis satu baris kode pun. Anda dapat dengan mudah memindahkan, mengubah ukuran, dan mengonfigurasi setiap elemen langsung dari antarmuka visual.
Contoh penggunaan dalam desain halaman:
Misalnya, untuk menambahkan gambar ke halaman Anda, cukup pilih widget “Gambar” di panel kiri, seret ke area kerja, dan letakkan di tempat yang Anda inginkan. Anda kemudian dapat menyesuaikan properti gambar (ukuran, perataan, batas, dll.) langsung di panel kontrol.
Demikian pula, untuk membuat bagian dengan beberapa kolom, cukup seret bagian “Kolom” ke dalam halaman, lalu tambahkan widget yang diinginkan di setiap kolom. Proses visual yang sederhana ini membuat pembuatan halaman yang rumit menjadi cepat dan intuitif.
Widget dan Elemen
Daftar widget dasar yang tersedia:
Elementor menawarkan berbagai widget dasar dalam versi gratisnya, yang mencakup sebagian besar kebutuhan desain umum. Di antara widget tersebut adalah elemen seperti:
- Judul : Untuk menambahkan header atau subtitle.
- Gambar : Untuk menyisipkan gambar dengan opsi penyesuaian.
- teks : Untuk menambahkan paragraf teks.
- Video : Untuk menyematkan video dari YouTube, Vimeo, atau file lokal.
- tombol : Untuk membuat tombol ajakan bertindak.
- Kolom : Untuk menyusun konten Anda dalam beberapa kolom.
Widget lanjutan dalam versi Pro:
Elementor versi Pro membuka serangkaian widget canggih yang memungkinkan Anda membuat halaman yang lebih canggih. Di antara widget canggih yang tersedia, kami dapat mengutip:
- Untuk m : Untuk membuat formulir kontak yang sepenuhnya dapat disesuaikan.
- Tayangan slide : Untuk menambahkan tayangan slide interaktif.
- Portofolio : Untuk menampilkan proyek atau gambar dalam format grid.
- harga : Untuk membuat tabel harga untuk layanan atau produk.
- Pop-up : Untuk merancang dan mengelola pop-up khusus.
- Widget WooCommerce : Untuk mengintegrasikan dan mempersonalisasi elemen toko online Anda.
Sistem Bagian, Kolom dan Modul
Penjelasan bagian, kolom dan modul:
Sistem struktur Elementor didasarkan pada tiga komponen utama: bagian, kolom, dan modul (atau widget). ITU bagian merupakan struktur dasar halaman, bertindak sebagai wadah untuk kolom.
Di dalam setiap bagian Anda dapat menambahkan satu atau lebih kolom yang membagi bagian menjadi beberapa ruang berbeda tempat Anda dapat menempatkan widget. ITU widget (atau modul) adalah elemen individual yang Anda tempatkan di kolom untuk membuat konten halaman Anda yang sebenarnya, seperti teks, gambar, atau video.
Cara menyusun halaman dengan Elementor:
Untuk menyusun halaman dengan Elementor, Anda mulai dengan menambahkan bagian, lalu membagi bagian tersebut menjadi kolom sesuai dengan desain yang diinginkan (misalnya, dua kolom untuk teks dan gambar berdampingan). Setelah kolom berada di tempatnya, Anda dapat mulai memasukkan widget ke dalamnya.
Misalnya, di kolom kiri, Anda dapat menyisipkan widget “Teks” untuk pendahuluan, dan di kolom kanan, widget “Gambar”. Anda kemudian dapat menyesuaikan lebar kolom, jarak antar elemen, dan menerapkan gaya khusus untuk setiap widget. Fleksibilitas ini memungkinkan Anda membuat tata letak yang kompleks sambil mempertahankan kontrol penuh atas tampilan dan fungsionalitas setiap elemen.
Berapa biaya Elementor?
Elementor menawarkan versi gratis yang tangguh, serta versi Pro berbayar dengan fitur-fitur canggih. Bagian ini membahas biaya yang terkait dengan Elementor, membandingkan fitur yang tersedia dalam versi gratis dan berbagai paket harga Elementor Pro, sekaligus memberikan penilaian nilai uang.
Versi Gratis Elemen
Fitur apa saja yang disertakan:
Versi gratis Elementor menawarkan serangkaian fitur dasar yang memungkinkan pengguna mendesain halaman web yang fungsional dan estetis. Berikut adalah fitur-fitur utama yang disertakan:
- Editor Seret dan Lepas: Editor visual yang mudah digunakan untuk mendesain halaman tanpa memerlukan coding.
- Widget Dasar: Menyertakan elemen seperti judul, gambar, video, tombol, daftar, dan ikon.
- Templat Halaman: Akses ke perpustakaan templat yang telah ditentukan sebelumnya yang dapat Anda sesuaikan sesuai kebutuhan Anda.
- Responsivitas Seluler: Alat untuk menyesuaikan tampilan halaman di perangkat seluler dan tablet.
- Bagian & Kolom: Pembuatan dan penyesuaian bagian dan kolom untuk menyusun halaman.
Keterbatasan versi gratis:
Meskipun Elementor versi gratis sangat kuat, ia memiliki beberapa keterbatasan yang mungkin membuat pengguna mempertimbangkan versi Pro:
- Widget Tingkat Lanjut: Versi gratisnya tidak menyertakan widget lanjutan seperti formulir, tayangan slide, atau integrasi WooCommerce.
- Pembuat Tema: Pengguna versi gratis tidak dapat menyesuaikan header, footer, atau halaman arsip situs secara keseluruhan.
- Pop-up khusus: Pembuatan pop-up dicadangkan untuk versi Pro.
- Dukungan Prioritas: Dukungan pelanggan terbatas pada versi gratis, dan pengguna sering kali harus meminta bantuan komunitas.
- Akses Terbatas ke Model Pro: Hanya template dasar yang tersedia dalam versi gratis, dengan template premium disediakan untuk versi Pro.
Paket Harga Elementor Pro
Deskripsi berbagai paket (Essentials, Expert, Studio, Agency):
Elementor Pro menawarkan beberapa paket harga yang disesuaikan dengan kebutuhan pengguna yang berbeda. Berikut ini ikhtisar rencana ini:
- Penting:
- Harga: Sekitar $59 per tahun.
- Lokasi: 1 situs.
- Fitur: Akses ke semua fitur Pro, termasuk Pembuat Tema, Pembuat WooCommerce, pop-up, dan semua widget tingkat lanjut.
- Canggih :
- Harga: Sekitar $99 per tahun.
- Lokasi: Hingga 3 situs.
- Fitur: Fitur yang sama seperti paket Essentials, tetapi untuk beberapa situs.
- Pakar:
- Harga: Sekitar $199 per tahun.
- Lokasi: Hingga 25 situs.
- Fitur: Ideal untuk pekerja lepas atau agensi kecil, paket ini mencakup alat tambahan seperti dukungan pelanggan prioritas dan pembaruan eksklusif.
- Studio:
- Harga: Sekitar $499 per tahun.
- Lokasi: Hingga 100 situs.
- Fitur: Selain fitur paket sebelumnya, paket ini mencakup akses prioritas ke pembaruan dan dukungan teknis, dengan opsi lanjutan untuk Teams.
- Agensi :
- Harga: Sekitar $999 per tahun.
- Lokasi: Hingga 1000 situs.
- Fitur: Paket ini ditujukan untuk agensi dan perusahaan besar, menawarkan dukungan dan fitur premium, dengan prioritas utama untuk layanan pelanggan.
Perbandingan manfaat masing-masing paket:
Setiap paket Pro menawarkan fitur dasar yang sama, tetapi jumlah situs, tingkat dukungan, dan akses ke beberapa fitur lanjutan berbeda-beda. Paket Essentials ideal untuk pengguna individu atau mereka yang hanya mengelola satu situs. Paket Pakar paling cocok untuk pekerja lepas dan agensi kecil dengan banyak proyek.
Paket Studio dan Agensi dirancang untuk bisnis atau agensi dengan sejumlah besar situs untuk dikelola, menawarkan dukungan prioritas dan fitur-fitur canggih untuk kolaborasi tim.
Rasio kualitas / harga
Nilai tambah fitur berbayar:
Elementor versi Pro menawarkan nilai signifikan bagi pengguna yang ingin memaksimalkan kemampuan situs WordPress mereka. Fitur seperti Pembuat Tema, Pembuat Popup, dan widget tingkat lanjut memungkinkan peningkatan penyesuaian dan fleksibilitas yang tidak tersedia dalam versi gratis.
Selain itu, dukungan pelanggan prioritas dan akses ke pembaruan rutin membenarkan investasi ini, terutama bagi profesional dan agensi web.
Ulasan tentang berinvestasi di Elementor Pro:
Berinvestasi di Elementor Pro umumnya direkomendasikan bagi mereka yang ingin membuat situs web profesional, karena ia menawarkan alat penting untuk mengoptimalkan desain, fungsionalitas, dan interaksi pengguna. Untuk agensi dan pekerja lepas, membeli paket multi-lokasi juga bisa menghemat biaya, karena memungkinkan Anda mengelola banyak proyek dengan satu langganan.
Sebaliknya, bagi pengguna yang memiliki kebutuhan sederhana atau baru dalam membuat website, versi gratis mungkin sudah cukup. Secara keseluruhan, Elementor Pro menawarkan nilai uang yang luar biasa bagi mereka yang ingin melampaui fitur dasar dan membuat situs web yang sangat dipersonalisasi dan berkinerja tinggi.
Cara menginstal Elementor
Menginstal Elementor di situs WordPress Anda adalah langkah sederhana, namun penting untuk memastikan lingkungan Anda siap untuk pengoperasian yang optimal.
Prasyarat untuk instalasi
Kompatibilitas WordPress:
Sebelum menginstal Elementor, pastikan situs WordPress Anda memenuhi persyaratan minimum. Elementor kompatibel dengan WordPress versi 5.0 dan lebih tinggi. Disarankan untuk selalu menggunakan WordPress versi terbaru untuk mendapatkan manfaat dari fitur terbaru dan perbaikan keamanan.
Akomodasi yang direkomendasikan:
Agar Elementor berfungsi dengan baik, situs Anda harus dihosting di server berkinerja tinggi. Berikut spesifikasi minimum yang diperlukan:
- PHP : Versi 7.4 atau lebih tinggi.
- MySQL : Versi 5.6 atau lebih tinggi, atau MariaDB versi 10.0 atau lebih tinggi.
- memori PHP : Setidaknya 128 MB, meskipun disarankan 256 MB atau lebih untuk situs yang lebih kompleks.
- web server : Apache dengan modul mod_rewrite diaktifkan, atau NGINX.
Gunakan dikelola WordPress hosting atau host yang terkenal dengan kinerjanya, seperti SiteGround atau WP Engine, dapat meningkatkan pengalaman pengguna dan kecepatan situs Anda.
Instalasi melalui Dashboard WordPress
Langkah-langkah untuk menginstal versi gratis:
- Akses Dasbor WordPress : Masuk ke situs WordPress Anda.
- Buka menu "Ekstensi". : Klik “Ekstensi” lalu “Tambah”.
- Telusuri “Elemen” : Ketik “Elementor” di bilah pencarian yang terletak di kanan atas.
- Instal pluginnya : Saat Elementor muncul di hasil pencarian, klik “Instal Sekarang”.
- Aktifkan pluginnya : Setelah instalasi selesai, klik “Aktifkan” untuk mulai menggunakan Elementor.
Aktivasi dan konfigurasi awal:
Setelah aktivasi, Elementor akan memandu Anda melalui pengaturan awal singkat di mana Anda dapat memilih mode penyesuaian, memeriksa kompatibilitas tema, dan mengakses tutorial memulai. Anda disarankan untuk mengikuti langkah-langkah berikut untuk memastikan semuanya sudah siap untuk mulai membuat halaman Anda.
Instalasi dan Aktivasi Elementor Pro
Mengunduh dan menginstal versi Pro:
- Beli Elemen Pro : Kunjungi situs web resmi Elementor dan pilih paket Pro yang cocok untuk Anda. Setelah membeli, Anda akan menerima tautan unduhan untuk Plugin Elementor Pro.
- Unduh file zipnya : Unduh file zip Elementor Pro ke komputer Anda.
- Akses Dasbor WordPress : Masuk ke situs WordPress Anda.
- Buka menu “Ekstensi” > “Tambah” > “Unggah ekstensi” : Klik “Pilih File”, pilih file zip yang diunduh, lalu klik “Instal Sekarang”.
- Aktifkan pluginnya : Setelah instalasi selesai, klik “Aktifkan”.
Aktivasi lisensi:
Setelah aktivasi, buka Elemen > Lisensi di dasbor WordPress. Masukkan kunci lisensi yang Anda terima melalui email setelah pembelian. Klik “Aktifkan”, dan versi Pro Anda akan siap digunakan, dengan semua fitur tidak terkunci.
Pengaturan Awal Elemen
Pengaturan plugin umum:
Setelah Elementor (gratis atau Pro) diinstal dan diaktifkan, saatnya mengonfigurasi beberapa pengaturan umum untuk mengoptimalkan pengalaman Anda:
- Pengaturan Situs : Pergi ke Elementor> Pengaturan untuk mengonfigurasi opsi seperti tata letak default, mengaktifkan fitur pemeliharaan, dan mengedit perilaku editor tertentu.
- Gaya keseluruhan : Di bawah Elemen > Alat, Anda dapat mengonfigurasi gaya global yang akan diterapkan ke seluruh situs, seperti font dan warna default.
Penyesuaian kinerja yang disarankan:
Untuk memastikan kinerja optimal dengan Elementor, disarankan untuk:
- Aktifkan mode pemuatan lambat : Mode ini memungkinkan Anda memuat skrip yang diperlukan saja, sehingga meningkatkan kecepatan pemuatan halaman.
- Optimalkan memori PHP : Jika Anda mengerjakan proyek yang kompleks, pastikan server Anda memiliki alokasi memori PHP yang cukup.
- Gunakan plugin cache : Plugin seperti WP Rocket ou W3 Jumlah Cache dapat membantu mempercepat situs Anda dengan mengoptimalkan sumber daya dan mengurangi waktu buka halaman.
- Pantau kinerja : Elementor menawarkan alat analisis kinerja Elemen > Alat > Kinerja. Ini memungkinkan Anda mengidentifikasi hal-hal yang memperlambat situs Anda dan menyesuaikannya.
Cara menggunakan Elementor di WordPress
Elementor adalah alat canggih yang memungkinkan Anda membuat dan menyesuaikan halaman web dengan cara visual dan intuitif. Di bagian ini Anda akan menemukan cara menggunakan Elementor di WordPress, yang merupakan pembahasan utama artikel ini.
Buat halaman dengan Elementor
Langkah-langkah membuat halaman baru:
- Akses Dasbor WordPress : Masuk ke situs WordPress Anda.
- Buka “Halaman” > “Tambahkan” : Klik “Tambah” untuk membuat halaman baru.
- Beri nama halaman tersebut : Beri judul pada halaman Anda, seperti “Halaman Beranda” atau “Tentang”.
- Luncurkan Elemen : Klik tombol “Edit dengan Elementor”. Anda akan diarahkan ke editor visual Elementor.
Tambahkan bagian dan widget:
- Tambahkan bagian : Klik ikon “+” untuk menambahkan bagian baru. Pilih jenis tata letak (sebaiknya Flexbox). Terakhir klik salah satu struktur kolom yang berbeda (satu kolom, dua kolom, dll.).
- Tambahkan Widget : Setelah bagian dibuat, seret widget pilihan Anda dari panel kiri ke bagian atau kolom yang sesuai. Misalnya, Anda dapat menambahkan widget “Gambar” untuk menyisipkan gambar atau widget “Teks” untuk menambahkan konten tekstual.
- Konfigurasikan widget : Setelah menambahkan widget, Anda dapat menyesuaikan konten, gaya, dan pengaturannya langsung dari panel konfigurasi widget di sebelah kiri.
Menyesuaikan halaman
Mengubah gaya, warna, dan tipografi:
- Buka pengaturan gaya : Untuk setiap widget, bagian, atau kolom, Anda dapat mengklik tab “Gaya” di panel kontrol di sebelah kiri untuk mengubah warna, tipografi, dan aspek visual lainnya.
- Terapkan gaya global : Di bawah " Pengaturan situs » di menu utama Elementor (kiri atas), Anda dapat mengatur gaya global untuk warna, tipografi, tombol, dll., yang akan diterapkan ke seluruh halaman atau seluruh situs.
Menggunakan templat yang telah dirancang sebelumnya:
- Akses perpustakaan templat : Klik ikon folder di area kerja untuk membuka perpustakaan template Elementor.
- Pilih sebuah model : Telusuri model yang tersedia dan pilih salah satu yang sesuai dengan kebutuhan Anda. Anda dapat memilih dari templat halaman penuh atau blok tertentu (bagian yang telah ditentukan sebelumnya).
- Impor dan sesuaikan templat : Setelah memilih template, klik “Sisipkan”. Templat akan ditambahkan ke halaman Anda, dan Anda kemudian dapat menyesuaikan setiap elemen sesuai preferensi Anda.
Menyimpan dan menerbitkan
Cara mempratinjau halaman:
- Pratinjau pekerjaan Anda : Klik ikon “mata” di panel atas untuk melihat pratinjau halaman Anda. Ini memungkinkan Anda melihat seperti apa tampilan halaman Anda setelah dipublikasikan.
- Ubah mode pratinjau : Anda juga dapat melihat pratinjau halaman di berbagai jenis perangkat (komputer, tablet, seluler) untuk melihat tampilannya di setiap media.
Simpan draf dan publikasikan:
- Simpan pekerjaan Anda : Jika Anda ingin menyimpan kemajuan Anda tanpa memublikasikan halaman, klik “Simpan draf”.
- Publikasikan halaman : Setelah Anda puas dengan desainnya, klik tombol “Terbitkan” untuk membuat halaman terlihat di situs Anda.
- Pembaruan di masa depan : Jika Anda perlu kembali lagi nanti untuk membuat perubahan, Anda dapat mengedit halaman dengan Elementor kapan saja dan memublikasikan ulang perubahan tersebut.
Pengoptimalan untuk Seluler
Penggunaan alat responsif:
- Aktifkan mode responsif : Di menu atas editor Elementor, klik ikon layar untuk beralih antara tampilan desktop, tablet, dan seluler.
- Ubah pengaturan tertentu : Di setiap tampilan, Anda dapat menyesuaikan margin, perataan, dan ukuran elemen untuk memastikan pengalaman pengguna yang optimal di setiap perangkat. Perubahan yang dilakukan pada mode ini hanya akan memengaruhi tampilan tertentu.
Penyesuaian khusus untuk perangkat seluler:
- Ubah ukuran font : Di tab “Gaya” untuk setiap widget, Anda dapat mengatur ukuran font yang berbeda untuk perangkat seluler, memastikan teks Anda tetap dapat dibaca di semua layar.
- Susun ulang item : Terkadang susunan elemen di layar desktop tidak sesuai untuk layar ponsel. Gunakan opsi penyusunan ulang untuk menyesuaikan susunan elemen pada perangkat seluler.
- Sembunyikan item yang tidak perlu : Anda juga dapat menyembunyikan elemen tertentu pada versi seluler atau tablet untuk meningkatkan keterbacaan atau mengurangi waktu pemuatan halaman.
Cara menggunakan fitur lanjutan di Elementor
Elementor Pro menawarkan berbagai fitur lanjutan yang membantu meningkatkan penyesuaian dan desain situs web Anda. Di bagian ini, kita akan mempelajari cara menggunakan Pembuat Tema, membuat pop-up, mengintegrasikan WooCommerce, menggunakan widget tingkat lanjut, mengelola pengaturan global, dan menambahkan CSS khusus dan efek gerakan.
Menggunakan Pembuat Tema
Membuat header, footer, dan templat global:
Elementor Pro menyertakan Pembuat Tema yang memungkinkan Anda mendesain elemen global seperti header, footer, halaman arsip, dan halaman posting. Inilah cara Anda dapat menggunakannya:
- Akses Pembuat Tema: pergi Templat > Pembuat Tema di dasbor WordPress.
- Buat header atau footer: Klik “Tambah Baru”, pilih jenis template (Header, Footer, dll.), lalu desain template Anda menggunakan editor Elementor.
- Simpan dan publikasikan: Setelah Anda menyelesaikan desain, klik “Terbitkan”. Anda dapat mengatur kondisi untuk memilih di mana template akan ditampilkan (misalnya, di semua halaman atau hanya di bagian situs tertentu).
Menggunakan kondisi tampilan:
Kondisi tampilan memungkinkan Anda mengontrol di mana templat Anda akan diterapkan. Misalnya, Anda dapat membuat header berbeda untuk halaman beranda dan blog, atau footer khusus untuk kategori produk:
- Tentukan kondisi tampilan: Saat Anda memublikasikan template, Elementor menanyakan di mana Anda akan menampilkannya. Anda dapat memilih “Seluruh situs”, “Pada halaman tertentu”, atau “Pada jenis postingan tertentu”.
- Tambahkan aturan bersyarat: Untuk penyesuaian yang lebih baik, tambahkan beberapa ketentuan untuk menentukan secara tepat kapan dan di mana templat akan diterapkan.
Pembuatan Pop-up
Desain pop-up dan integrasi di situs:
Pop-up adalah cara terbaik untuk menarik perhatian pengunjung atau mendapatkan prospek. Dengan Elementor Pro, Anda dapat membuat pop-up yang dipersonalisasi sepenuhnya:
- Akses Pembuat Popup: pergi Template > Munculan dan klik “Tambah Baru”.
- Pilih template atau buat dari awal: Elementor menawarkan beberapa templat pop-up yang dapat Anda sesuaikan atau Anda dapat membuat pop-up unik dari awal.
- Sesuaikan desain: Gunakan editor drag-and-drop Elementor untuk mendesain pop-up Anda dengan menambahkan gambar, teks, formulir, dll.
Tentukan aturan pemicu:
Setelah pop-up dirancang, penting untuk menentukan aturan pemicu untuk memastikan pop-up muncul pada waktu yang tepat bagi pengunjung Anda:
- Tetapkan kondisi: Pilih di mana pop-up akan muncul di situs Anda (misalnya, di semua halaman, di halaman tertentu, atau setelah jangka waktu tertentu yang dihabiskan di situs).
- Setel pemicu: Pilih pemicu, seperti niat keluar, waktu di halaman, atau men-scroll persentase halaman tertentu.
- Tentukan aturan lanjutan: Anda juga dapat menambahkan aturan lanjutan seperti batasan tampilan per pengunjung, tampilan setelah beberapa tampilan halaman, atau interaksi dengan elemen lainnya.
Integrasi dengan WooCommerce
Gunakan Elementor untuk menyesuaikan halaman toko:
Elementor Pro memungkinkan Anda untuk menyesuaikan halaman toko WooCommerce Anda tanpa menyentuh kodenya. Begini caranya:
- Buat template WooCommerce: pergi Templat > Pembuat Tema, lalu pilih “Tambah Baru”. Pilih jenis template WooCommerce yang ingin Anda buat, seperti halaman produk, halaman kategori, atau halaman keranjang.
- Sesuaikan dengan widget WooCommerce: Elementor Pro menawarkan widget khusus untuk WooCommerce, seperti “Produk”, “Tambahkan ke Keranjang”, “Gambar Produk”, “Deskripsi Produk”, dll. Gunakan mereka untuk mendesain halaman produk yang unik.
- Simpan dan publikasikan: Seperti template lainnya, setelah desain selesai, Anda dapat menyimpan dan mempublikasikan dengan kondisi tampilan tertentu.
Tambahkan dan sesuaikan produk:
Dengan Elementor, Anda juga dapat menyesuaikan tata letak setiap produk satu per satu:
- Edit halaman produk dengan Elementor: Dari halaman produk WooCommerce, klik “Edit dengan Elementor”.
- Sesuaikan tata letak: Gunakan widget WooCommerce untuk mengubah tampilan produk, menambahkan tab khusus, menampilkan produk terkait, dan banyak lagi.
- Penyesuaian seluler: Pastikan tata letak produk dioptimalkan untuk seluler menggunakan alat responsif Elementor.
Widget Formulir
Membuat dan menyesuaikan formulir:
Widget Formulir Elementor Pro memungkinkan Anda membuat formulir kontak, pengambilan prospek, formulir berlangganan buletin, dan banyak lagi:
- Tambahkan formulir: Seret widget “Formulir” ke halaman Anda.
- Sesuaikan bidang: Tambahkan atau hapus kolom, tetapkan aturan validasi, dan konfigurasikan respons otomatis atau pengalihan setelah pengiriman.
- Integrasi dengan layanan pihak ketiga: Anda dapat mengintegrasikan formulir dengan layanan pemasaran email seperti MailChimp, atau kirim data ke webhook untuk pemrosesan khusus.
Baca juga: Cara Membuat Formulir dengan Elementor Gratis
Parameter Global
Konfigurasikan pengaturan global:
Pengaturan global memungkinkan Anda menentukan gaya dan pengaturan yang berlaku untuk seluruh situs:
- Akses Pengaturan Global: pergi Pengaturan Situs di bawah menu utama Elementor.
- Konfigurasikan warna dan tipografi global: Tentukan warna utama, warna sekunder, dan tipografi yang akan digunakan pada semua halaman.
- Terapkan gaya global: Saat Anda mendesain halaman, gaya global dapat diterapkan untuk memastikan konsistensi visual di seluruh situs.
CSS Khusus dan Efek Gerakan
Menambahkan CSS khusus di Elementor:
Untuk pengguna tingkat lanjut, Elementor memungkinkan Anda menambahkan CSS khusus untuk kontrol yang lebih baik atas desain:
- Tambahkan CSS global: pergi Pengaturan Situs > CSS Khusus untuk menambahkan CSS yang akan diterapkan ke seluruh situs.
- Tambahkan CSS tertentu ke widget: Setiap widget di Elementor Pro memiliki tab “Lanjutan” tempat Anda dapat menambahkan CSS khusus untuk widget spesifik tersebut.
Baca juga: Elementor: Cara Menambahkan CSS Kustom ke Versi Gratis
Menggunakan animasi dan efek gerakan:
Elementor Pro menawarkan animasi dan efek gerakan untuk membuat halaman Anda lebih dinamis:
- Tambahkan animasi entri: Di tab " maju » pada widget, bagian, atau kolom, Anda dapat mengatur animasi input agar elemen dianimasikan saat muncul di layar.
- Efek pengguliran dan interaksi: Gunakan efek gulir untuk membuat paralaks, animasi gulir halaman, atau efek hover untuk meningkatkan interaksi visual.
FAQ tentang cara menggunakan Elementor
Apakah Elementor kompatibel dengan semua tema WordPress?
Elementor kompatibel dengan sebagian besar Tema WordPress, termasuk yang gratis dan premium. Namun, untuk kompatibilitas optimal dan fleksibilitas maksimum, disarankan untuk menggunakan tema yang dirancang khusus untuk bekerja dengan Elementor, seperti “Hello Theme” oleh Elementor atau “Astra”. Tema-tema ini ringan dan menawarkan integrasi yang lancar dengan pembuat halaman.
Bisakah saya menggunakan Elementor dengan pembuat halaman lainnya?
Elementor dapat digunakan dengan pembuat halaman lain, tetapi tidak disarankan. Menggabungkan beberapa pembuat halaman di situs yang sama dapat menyebabkan konflik gaya, masalah kompatibilitas, dan penurunan kinerja. Yang terbaik adalah memilih satu pembuat halaman dan tetap menggunakannya untuk keseluruhan situs Anda.
Bagaimana cara memperbaiki masalah kompatibilitas dengan Elementor?
Masalah kompatibilitas dengan Elementor mungkin timbul karena konflik dengan plugin atau tema lain. Untuk mengatasinya:
- Lihat Dokumentasi elemen atau hubungi dukungan mereka untuk solusi spesifik.
- Nonaktifkan semua plugin yang tidak penting dan lihat apakah masalahnya masih berlanjut. Aktifkan kembali satu per satu untuk mengidentifikasi pelakunya.
- Ubah tema untuk sementara untuk melihat apakah ini masalahnya.
- Perbarui Elementor dan WordPress serta semua plugin untuk memastikan Anda menggunakan versi terbaru.
Apakah Elementor memengaruhi kinerja situs saya?
Seperti pembuat halaman lainnya, Elementor dapat memengaruhi kinerja situs, terutama dalam hal waktu buka halaman. Namun, dampak ini dapat diminimalkan dengan mengikuti beberapa praktik terbaik:
- Gunakan hosting yang efisien untuk mendukung kebutuhan situs Anda.
- Optimalkan gambar Anda sebelum mengunduhnya.
- Gunakan plugin cache untuk mempercepat pemuatan halaman.
- Hindari penggunaan widget dan animasi secara berlebihan, yang dapat membuat halaman menjadi lebih berat.
Apa praktik terbaik untuk menggunakan Elementor?
Untuk mendapatkan hasil maksimal dari Elementor sambil mempertahankan kinerja yang baik dan pengalaman pengguna yang optimal:
- Gunakan bagian dan kolom secara strategis untuk menyusun konten Anda.
- Terapkan gaya global untuk memastikan konsistensi visual di seluruh situs.
- Rencanakan penyesuaian untuk daya tanggap seluler, menggunakan alat bawaan Elementor untuk mengoptimalkan tampilan di berbagai perangkat.
- Peraturan Sauvegardez pekerjaan Anda dan uji halamannya sebelum menerbitkannya.
Apa yang harus dilakukan jika ada masalah dengan Elementor Pro?
Jika Anda memiliki masalah dengan Elementor Pro:
- Periksa apakah lisensi Pro Anda aktif dan terkini.
- Perbarui Elemen Pro ke versi terbaru yang tersedia.
- Lihat dokumentasi daring atau forum komunitas untuk melihat apakah pengguna lain mengalami masalah yang sama.
- Hubungi Dukungan Pelanggan Elementor Pro untuk mendapatkan bantuan yang cepat dan dipersonalisasi.
Bagaimana cara mengoptimalkan halaman yang dibuat dengan Elementor untuk SEO?
Untuk mengoptimalkan halaman Elementor untuk SEO:
- Gunakan judul H1, H2, H3 secara hierarkis untuk menyusun konten Anda.
- Optimalkan tag meta dan deskripsi untuk setiap halaman.
- Tambahkan tag alt ke gambar untuk meningkatkan SEO gambar.
- Gunakan plugin SEO seperti Yoast SEO atau Rank Math, yang sepenuhnya kompatibel dengan Elementor.
- Pastikan halaman Anda dimuat dengan cepat mengikuti praktik baik yang disebutkan di atas.
Apakah mungkin mengekspor template Elementor ke situs lain?
Ya, Elementor memudahkan mengekspor template untuk digunakan di situs lain. Berikut cara melakukannya:
- Simpan model Anda : Buka “Templat” > “Simpan sebagai Templat” untuk menyimpan templat tertentu.
- Ekspor modelnya : Buka “Template” > “Template Saya”, lalu klik “Ekspor” untuk mendownload file template .json.
- Impor modelnya di situs lain: Di situs tujuan, buka “Templat” > “Impor”, lalu unduh file .json yang Anda ekspor.
Baca juga sumber daya yang tertaut ke artikel ini
- Elementor : Cara membuat kartu produk
- Elementor : Cara membuat bagian anggota tim
- Elementor : Cara membuat peta heksagonal dengan efek
- Elementor : cara menggulir gambar saat mengarahkan kursor
- Elementor : Cara menambahkan efek suara tombol
Kesimpulan
Elementor menonjol sebagai alat yang harus dimiliki oleh siapa saja yang ingin membuat situs web profesional dan dipersonalisasi di WordPress, tanpa memerlukan keterampilan pengkodean tingkat lanjut.
Baik Anda seorang pemula atau pengembang berpengalaman, Elementor menawarkan serangkaian fitur lengkap yang memenuhi setiap kebutuhan, mulai dari pembuatan halaman sederhana hingga tema tingkat lanjut dan manajemen toko online. Fleksibilitas, antarmuka intuitif, dan kemampuan integrasinya menjadikannya solusi pilihan untuk mengoptimalkan tampilan dan kinerja situs Anda.
Jika artikel ini membantu Anda lebih memahami cara menggunakan Elementor, silakan bagikan ke teman atau kolega Anda yang mungkin juga mendapat manfaat dari tips ini. Berbagi pengetahuan Anda adalah cara terbaik untuk berkontribusi pada komunitas WordPress.
Siap mengubah situs web Anda dengan Elementor? Jangan buang waktu lagi, mulailah menjelajahi kemungkinan yang ditawarkan oleh plugin luar biasa ini sekarang, dan lihat bagaimana plugin ini dapat merevolusi cara Anda membuat situs web. Klik di sini untuk melihat paket Elementor Pro dan membawa situs Anda ke level berikutnya hari ini!
...