Dapatkan Hosting Instan dengan Elementor dan Elementor Pro

dengan CDN, SSL dan cadangan.

Mulai hari ini

Elementor 3.0: Apa Saja Fitur Barunya?

Blair2004 Tutorial WordPress Nov 5, 2021

Pembaruan besar baru Elementor telah dirilis. Kami pindah dari versi 2.x ke versi 3.0 . Versi baru ini hadir dengan cara baru untuk membuat situs web menggunakan WordPress dan Elementor. Kami akan mencoba mengonversi fitur baru ini.

Apa Penambahan Utama Pada Elementor 3.0?

Elementor 3.0 hadir dengan 3 tambahan utama yaitu: Fitur Sistem Desain, Pembuat Tema Baru, dan peningkatan kinerja yang signifikan.

Fitur Sistem Desain

Pernahkah Anda bertanya-tanya seberapa besar yang dilakukan perusahaan besar untuk berkinerja sebaik itu, apa pun platform yang mereka gunakan? Semua yang mereka buat terlihat konsisten dan memiliki desain yang sama. Itu mungkin berkat apa yang disebut " Sistem Desain ". Menurut UnxDesign.cc, Sistem Desainnya adalah:

Satu-satunya sumber kebenaran yang mengelompokkan semua elemen yang memungkinkan tim merancang, mewujudkan, dan mengembangkan produk. Jadi sebuah Sistem Desain bukanlah kiriman, tetapi satu set kiriman. Ini akan berkembang terus-menerus dengan produk, alat dan teknologi baru.

UX Collective

Menerapkan sistem desain, menjaga seluruh tim Anda tetap konsisten dalam satu bahasa desain dan juga merevolusi cara tim Anda bekerja dan memastikan alur kerja yang lebih cepat.

Memulai

Fitur Sistem Desain Elementor 3.0 meliputi:

  • Warna Global
  • Panel Pengaturan Situs Baru
  • Font Global

Mari kita lihat secara mendalam bagaimana ini akan membantu Anda membangun Situs Web profesional yang lebih baik.

Warna Global

Elementor 3.0 menambahkan cara baru untuk bekerja dengan warna situs. Metode baru itu bernama Global Colors.

Warna Global membantu Anda mengubah warna dari satu lokasi, dan memperbarui warna di mana pun warna itu digunakan.

Anda akan mulai memilih Warna Global dasar untuk situs web Anda. Kemudian, masuk ke gaya warna apa pun di Elementor, dan tentukan itu menjadi salah satu dari empat warna. Perhatikan bahwa Anda dapat menambahkan sebanyak mungkin warna khusus pada Daftar Global .

Sekarang variabel CSS masuk. Kembali ke Global Colors , dan ubah salah satu warnanya. Skema warna seluruh situs Anda berubah sesuai dengan Warna Global yang baru. Pernahkah Anda mengalami sesuatu yang lebih mudah?

Anda juga dapat mendesain Warna Global yang berbeda dari dalam input kontrol atau membuat Warna Global baru, semuanya menggunakan pemilih warna yang sama di dalam input kontrol.

Pengaturan Situs

Membuat pengaturan desain pertama untuk situs web menghabiskan banyak waktu. Anda harus beralih antara kode tema, Customizer, functions.php. Itu cukup alasan untuk membenarkan sakit kepala Anda.

Pengaturan Situs baru menunjukkan berbagai alat konfigurasi. Dengan begitu, Anda akan terus melakukan semua tugas tesis dari satu tempat.

Untuk memulai, di halaman mana pun yang Anda edit dengan Elementor, di panel sisi kiri, klik ikon kiri atas. Itu akan membuat Anda beralih ke panel Pengaturan Global.

Di dalam panel Pengaturan Global itu Anda akan menemukan:

  • Layout:Â Untuk Mengonfigurasi pengaturan layout default Elementor, seperti lebar konten default atau layout halaman default.
  • Identitas Situs: Sesuaikan identitas lintas situs Anda, seperti Logo, Judul, Tagline, dan bahkan Favicon.
  • Gaya Tema: Menyesuaikan elemen HTML yang tidak terkait dengan Elementor (biasanya diatur oleh tema) untuk Tipografi, Tombol, dan Bidang Formulir.
  • Lightbox: Â Tentukan gaya default Elementor Lightbox
  • Warna dan Font Global: Memungkinkan Anda mengonfigurasi warna dan font global yang berlaku untuk situs web Anda.

Font Global

Warna dan Tipografi adalah bagian dari komponen bangunan situs web apa pun. Menggunakan logika yang sama dari fitur Warna Global, ini adalah metode baru untuk bekerja dengan gaya teks situs Anda.

Dengan Font Global, setiap pengaturan tipografi dapat diterapkan secara global. Anda sekarang dapat mengatur semua pengaturan tipografi situs Anda secara global, termasuk Keluarga Font, Ukuran Dan Skala Font, Berat Font, Transformasi Font, Gaya Font, Dekorasi Font, Tinggi Baris, Spasi Huruf, dan bahkan Pengaturan Responsif. Anda juga dapat mengatur pengaturan ini ke setiap widget yang berisi teks, dan menyesuaikan Font Global Anda sendiri.

Dengan Tipografi yang dirancang dengan benar, Anda akan dapat menerapkan perubahan ini secara global.

Seluruh Situs Divisualisasikan Dan Diorganisir di Satu Tempat

Sementara Pembuat Tema  yang terkenal telah menjadi pemimpin industri dalam hal memiliki gambaran lengkap tentang desain situs web, UI baru ini bahkan melangkah lebih jauh. Pembuat Tema baru sekarang memberi Anda gambaran umum tentang seluruh situs web dengan cara yang sangat intuitif.

Pembuat Tema itu memberikan ikhtisar situs, ini mencakup semua bagian situs: header, footer, templat halaman global, templat posting global, dan banyak lagi. Setiap bagian dari situs dapat dipratinjau, membuat tugas merancang situs web yang lengkap menjadi jauh lebih mudah.

Peningkatan Kinerja

Sementara aplikasi berkembang, jelas bahwa pengembang harus peduli dengan kinerjanya. Pembaruan yang dilakukan pada Elementor 3.0 dibuat untuk memastikan infrastruktur kode yang bagus yang telah menghasilkan peningkatan kinerja yang luar biasa.

Ada banyak pembersihan elemen DOM, yang membuat Elementor merender lebih cepat. Ini pasti akan meningkatkan peringkat kecepatan halaman Anda dan pengalaman keseluruhan bagi pengguna di situs web Anda.

Konkretnya, Apa yang Berubah Dalam Hal Kecepatan Halaman?

Elementor 3.0 memberikan peningkatan yang signifikan untuk proses rendering sisi server dan cara Elementor merender nilai CSS dinamis. Ini memungkinkan Anda untuk menggabungkan elemen dan nilai dinamis di seluruh situs web Anda. Misalnya, Anda dapat membuat template untuk posting situs, dan memutuskan Anda ingin menampilkan gambar unggulan setiap posting sebagai latar belakang di belakang judul posting.

Di latar belakang, saat Elementor menyiapkan postingan untuk dikirim ke browser, Elementor mem-parsing postingan untuk nilai dinamis, mengambilnya, dan jika menyertakan nilai CSS apa pun, ia akan mencetak CSS tersebut.

Dengan Elementor 3.0, waktu yang dihabiskan untuk proses ini telah berkurang secara substansial. Berkat nilai dinamis yang disimpan untuk setiap posting Anda. Setelah daftar itu disimpan, setiap kali seseorang mengunjungi pos, Elementor langsung menuju ke daftar ini, sehingga membuat prosesnya lebih cepat. Nilai dinamis yang dipengaruhi oleh pengoptimalan ini mencakup gambar latar belakang, warna, dan banyak lagi. Peningkatan ini membawa pengurangan beban server yang nyata.

Ringkasan Pembaruan Elementor 3.0

Seperti yang kami sebutkan di atas, versi ini hadir dengan barang menarik yang seharusnya benar-benar memengaruhi pekerjaan Anda sehari-hari. Kami telah melalui:

The Design System Features yang membantu Anda bekerja lebih konsisten dan efisien.

Pembuat Tema baru adalah alat visual yang kuat untuk mengelola setiap bagian situs web Anda dari satu tempat.

Peningkatan Kinerja  untuk pengalaman pengguna yang lebih baik.

Elementor 3.0 pasti akan membawa Anda ke ujung tombak sebagai pembuat web profesional. Jika belum, tingkatkan sekarang ke Elementor Pro . Anda juga harus mempertimbangkan untuk membaca posting kami yang menjelaskan mengapa Elementor tentu saja adalah Pembuat Halaman gratis terbaik di WordPress .