Cara membangun halaman Anda secara efisien dengan Divi 5

Dibangun kembali dari bawah ke atas, Divi 5 menawarkan kinerja yang cepat dan memperkenalkan fitur-fitur baru seperti variabel desain untuk gaya di seluruh lokasi, baris bersarang untuk kedalaman tata letak yang tak terbatas, dan desain berbasis prasetis untuk meningkatkan alur kerja Anda. Dengan pembangun visual yang modern dan dirubah, Divi 5 memungkinkan Anda untuk membuat situs web profesional dengan sedikit usaha, dengan memulai dari awal atau memanfaatkan ribuan tata letak yang sudah dibangun.

Dalam posting ini, kami akan menyoroti fitur unik Divi 5 dan peningkatan UI, dan bagaimana mereka membantu Anda membangun halaman Anda dengan lebih efisien. Dari menyiapkan tata letak yang responsif hingga memanfaatkan fitur -fitur inovatif seperti grup modul dan divi AI, Anda akan melihat bagaimana Divi 5 mengubah desain web menjadi pengalaman yang lebih cepat, lebih pintar, dan lebih kreatif.

Satu catatan sebelum kami menyelam: Divi 5 siap digunakan di situs web baru, tetapi kami belum merekomendasikan untuk mengubah situs yang ada ke Divi 5 dulu.

Dengan itu, mari selami.

Memahami UI Modern Divi 5

Antarmuka Divi 5 adalah perbaikan lengkap dari pendahulunya, dirancang untuk kecepatan, fleksibilitas, dan desain no-kode intuitif. Visual Builder menawarkan pengeditan front-end real-time dengan panel pengaturan yang lebih bersih, rogen desain responsif, dan antarmuka lapisan bersarang untuk navigasi yang mulus dari bagian, baris, kolom, dan kelompok modul.

Ditingkatkan oleh fondasi yang lebih cepat, Divi 5 memperkenalkan fitur unik seperti baris bersarang untuk kedalaman tata letak tak terbatas, kelompok modul untuk manajemen modul yang ramping, dan variabel desain untuk gaya yang konsisten. Kemajuan ini membuat Divi 5 dapat diakses oleh pemula dan kuat bagi para profesional, mengubah bagaimana situs web dibangun di atas WordPress.

Evolusi pembangun visual

Pembuat visual Divi 5 menawarkan antarmuka yang didesain ulang dengan pengalaman ramping yang kuat dan ramah pengguna. Dibandingkan dengan Divi 4, Divi 5 memperkenalkan panel pengaturan yang lebih bersih dan lebih intuitif yang mengurangi kekacauan dan mengatur opsi secara logis, membuat penyesuaian lebih cepat.

Desain responsif baru beralih memungkinkan Anda beralih di antara beberapa desktop, tablet, dan tampilan seluler, memastikan desain terlihat sempurna di semua perangkat. Peningkatan UI ini membuat Divi 5 dapat diakses oleh pemula sambil menawarkan permintaan profesional presisi.

Navigasi intuitif

Menavigasi tata letak yang kompleks mudah dengan antarmuka lapisan Divi 5. Antarmuka ini mengatur bagian, baris, kolom, modul, dan grup modul baru menjadi struktur hierarkis yang jelas. Ini memungkinkan Anda untuk menelusuri ke bawah ke elemen desain Anda dengan mudah, apakah menyesuaikan satu modul atau merestrukturisasi seluruh bagian.

Antarmuka drag-and-drop menyederhanakan hal-hal, sementara mode wireframe memberikan tampilan mata burung dari struktur halaman Anda. Dengan menggabungkan alat -alat ini, Divi 5 membuat membangun dan mengedit tata letak kompleks intuitif, menghemat waktu dan mengurangi frustrasi.

Kontrol Desain Responsif

Divi 5 memperkenalkan breakpoint yang dapat disesuaikan untuk kontrol yang tepat atas bagaimana desain Anda beradaptasi di seluruh perangkat. Anda dapat memilih dari tujuh breakpoint yang telah ditentukan atau mengatur nilai khusus untuk mencocokkan resolusi perangkat tertentu. Ini memastikan tata letak pixel-sempurna tanpa tweak CSS manual.

Kontrol granular ini, dikombinasikan dengan unit canggih seperti Clamp () untuk penskalaan cairan, memastikan desain Anda tetap konsisten dan menarik secara visual di semua ukuran layar.

Membangun halaman Anda dengan fitur unik Divi 5

Divi 5 memperkenalkan alat inovatif yang akan mendefinisikan kembali cara Anda menggunakan Divi. Baris bersarang memungkinkan sarang baris tak terbatas untuk tata letak yang kompleks, sementara kelompok modul menyederhanakan gaya dan mengelola beberapa modul sebagai satu unit. Variabel desain memungkinkan konsistensi di seluruh situs untuk warna, font, dan banyak lagi, dan unit canggih mendukung fungsi CSS dinamis seperti klem () dan calc () untuk desain responsif. Desain berbasis preset dengan preset grup opsi merampingkan gaya lintas elemen, dan divi AI mempercepat pembuatan konten. Bersama -sama, fitur -fitur ini memberdayakan pengguna untuk membuat situs web yang profesional dan responsif secara efisien.

Di bawah ini, kami merinci cara menggunakan alat ini untuk membangun halaman web.

1. Variabel desain untuk gaya yang efisien

Variabel desain adalah pengaturan global yang dapat digunakan untuk warna, font, angka, gambar, teks, dan tautan yang dapat diterapkan di seluruh situs. Anda dapat mendefinisikan variabel dengan mengklik ikon variabel global di pembangun visual.

Manfaat menggunakan variabel desain adalah Anda dapat memperbaruinya sekali untuk memperbarui semua contoh variabel itu, memastikan konsistensi dan menghemat waktu. Misalnya, jika Anda menetapkan nilai angka untuk menetapkan perhitungan klem () ke judul, Anda membuat hierarki global untuk teks di seluruh situs web Anda. Jika Anda perlu melakukan perubahan cepat, modul heading atau teks apa pun dengan variabel -variabel yang diterapkan akan diperbarui di seluruh situs Anda, memungkinkan Anda untuk membuat perubahan desain cepat yang terisi di setiap contoh.

Cara menggunakan variabel desain

Untuk memaksimalkan potensi variabel desain, masukkan mereka lebih awal dalam proses desain Anda. Membangun variabel di awal menciptakan kerangka kerja yang konsisten, membebaskan Anda untuk fokus pada kreativitas daripada tugas yang berulang. Mulailah dengan mengklik ikon Variable Manager di pembangun visual.

Saat kotak dialog muncul, Anda dapat menambahkan variabel untuk membuat fondasi desain Anda. Misalnya, Anda dapat menggunakan variabel angka untuk menetapkan tipografi responsif.

Variabel angka juga dapat digunakan untuk jarak. Misalnya, Anda dapat membuat jarak standar untuk semua kolom dan baris di situs web Anda. Menggunakan rumus calc (), seperti Calc (80% - 60px) menetapkan lebar elemen desain sebagai 80% dari wadah, sambil menambahkan 30px padding ke kedua sisi. Pilih Calc dari menu dropdown untuk menerapkan formula.

Masukkan rumus calc () ke dalam bidang nilai . Klik tombol Simpan Variabel untuk menambahkannya ke manajer variabel.

Setelah variabel Anda disimpan, Divi memudahkan untuk menerapkannya di seluruh desain Anda. Untuk menggunakan jarak, klik pada baris, kolom, atau modul, arahkan ke tab Desain, dan cari bidang lebar.

Terakhir, klik ikon Sisipkan Dinamis Konten untuk memilih variabel jarak global.

Seperti disebutkan sebelumnya, menerapkan variabel desain memastikan konsistensi di seluruh situs Anda. Memperbarui propertinya di Variable Manager secara instan menyinkronkan semua contoh, menghemat jam penyesuaian manual Anda.

Tips untuk menggunakan variabel desain

• Atur variabel Anda dengan cermat: variabel nama secara deskriptif untuk membuatnya mudah diidentifikasi dalam proyek yang kompleks.
• Preset Leverage: Gabungkan variabel desain dengan preset global Divi untuk membuat templat gaya yang dapat digunakan kembali untuk modul, mengurangi waktu pengaturan untuk halaman baru.
• Tes Responsiveness: Pratinjau desain yang digerakkan oleh variabel di seluruh perangkat di pembangun visual untuk memastikan semua variabel berkinerja seperti yang diharapkan.

2. Desain berbasis praset dengan preset grup opsi

Sistem desain berbasis preset Divi 5 merevolusi gaya dengan dua alat yang kuat: preset elemen dan preset grup opsi. Fitur -fitur ini memungkinkan Anda untuk menyimpan dan menggunakan kembali konfigurasi, memastikan konsistensi dan merampingkan alur kerja proyek Anda.

Preset Elemen Divi 5

Preset elemen memungkinkan Anda untuk menyimpan konfigurasi modul - termasuk teks, warna, tipografi, jarak, dan efek hover - untuk digunakan kembali di seluruh situs web Anda. Misalnya, Anda dapat membuat modul tombol penuh gaya dengan font tertentu, latar belakang gradien, dan animasi hover. Setelah disimpan sebagai preset elemen, Anda dapat menerapkannya ke tombol apa pun di situs Anda dengan satu klik, mempertahankan gaya yang identik. Jika Anda memperbarui preset, seperti mengubah latar belakang menjadi warna solid, setiap instance dari tombol memperbarui secara otomatis, menghilangkan pengeditan berulang dan memastikan tampilan terpadu.

Divi 5 Opsi Group Preset

Sebaliknya, preset grup opsi fokus pada kelompok gaya yang dapat digunakan kembali, seperti tipografi, perbatasan, atau bayangan, yang dapat diterapkan pada berbagai elemen untuk desain kohesif. Misalnya, Anda dapat membuat preset grup opsi untuk perbatasan hitam 1px dengan radius 5px dan menggunakannya pada tombol, gambar, dan baris.

Jika Anda kemudian menyesuaikan preset ke perbatasan 2px, semua elemen tertaut memperbarui secara instan, menghemat waktu dan mempertahankan konsistensi. Pendekatan modular ini memungkinkan Anda untuk mencampur dan mencocokkan kelompok gaya di seluruh elemen, menawarkan fleksibilitas tanpa mengorbankan kontrol.

Cara menggunakan preset secara efektif

Preset elemen sudah ada saat memulai dengan situs starter atau tata letak premade. Namun, saat membuat situs web dari awal, Anda harus membuatnya terlebih dahulu. Membuat preset ini memungkinkan Anda untuk mempercepat proses desain dengan langsung menata modul serupa di seluruh situs web Anda.

Membuat preset elemen

Untuk membuat preset elemen, gaya modul dengan pengaturan yang Anda inginkan. Kemudian, klik menu preset di sudut kanan atas pengaturan modul.

Klik preset baru dari gaya saat ini untuk membuat preset baru.

Berikan nama preset, pilih apakah akan menetapkannya sebagai default, dan simpan. Jika Anda memilihnya sebagai preset default, setiap akordeon yang Anda tambahkan ke situs Anda akan ditata secara identik, membuatnya lebih mudah untuk membangun halaman web Anda lebih cepat dan lebih efisien.

Buat preset grup opsi

Proses membuat preset grup opsi sedikit berbeda. Daripada menerapkan preset ke modul, Anda dapat menetapkan preset ke aspek -aspek modul yang dapat dibawa ke jenis modul, kolom, baris, atau bahkan bagian. Preset grup opsi sangat bagus untuk perbatasan gaya, menambahkan kontrol transformasi, filter, bayangan kotak, dan banyak lagi, memungkinkan Anda untuk menjaga elemen yang lebih kecil konsisten di seluruh.

Misalnya, Anda ingin membuat gaya perbatasan untuk gambar dan kolom. Pilih modul gambar, navigasikan ke tab Desain, dan arahkan ke atas pengaturan perbatasan hingga ikon SELECT A Group Preset muncul.

Selanjutnya, klik tambahkan preset baru .

Gaya perbatasan, beri nama, dan simpan preset.

Tips untuk menggunakan preset berbasis desain Divi 5

Menggabungkan preset elemen dan preset grup opsi memungkinkan Anda membangun sistem desain yang dapat diskalakan. Berikut adalah beberapa tips untuk menggunakannya secara efektif untuk membangun halaman web dengan Divi 5:

• Gunakan untuk efisiensi: Buat preset elemen atau preset grup opsi untuk mempercepat pembangunan halaman, terutama untuk situs web besar. Metode ini menyelamatkan Anda dari berulang kali menata modul, baris, atau bagian. Anda membuat gaya di depan dan menerapkannya di mana pun dibutuhkan.
• Menetapkan konsistensi desain: Preset memastikan gaya seragam lintas elemen, memperkuat identitas merek Anda dan semir profesional.
• Edit Preset Ketika situs Anda membutuhkan perubahan desain: Preset memungkinkan Anda memperbarui gaya global tanpa secara manual mengedit elemen individu, membuatnya ideal untuk iterasi desain atau revisi klien.
• Gunakan untuk skalabilitas: Anda dapat menggabungkan preset dengan variabel desain untuk membuat kerangka kerja yang kuat untuk situs yang sering memerlukan pembaruan. Perlu menambahkan halaman di ujung jalan? Preset memungkinkan Anda untuk melakukan ini lebih cepat dan lebih efisien.

3. Baris bersarang untuk tata letak yang fleksibel

Baris bersarang di Divi 5 menggantikan bagian khusus Divi 4 dengan sistem yang lebih fleksibel dan tidak dapat dibatasi. Tidak seperti baris tradisional, baris bersarang dapat ditempatkan di dalam kolom, memungkinkan Anda untuk menumpuk baris, modul, atau baris bersarang tambahan dalam hampir semua konfigurasi.

Untuk membuat baris bersarang, cukup tambahkan satu ke kolom - atau di bawah modul di dalam kolom - melalui pembangun visual dan mengisinya dengan modul atau baris bersarang lebih lanjut.

Fitur ini memungkinkan Anda untuk membangun tata letak yang kompleks dan berlapis. Misalnya, di bagian Tentang, Anda dapat menempatkan baris bersarang 3-kolom di bawah modul teks untuk menambahkan tombol untuk memandu pengguna ke halaman yang berbeda.

Kontrol FlexBox yang akan datang di Divi 5 akan meningkatkan opsi penentuan posisi, menawarkan penyelarasan yang tepat dan jarak untuk desain yang rumit seperti tabel penetapan harga, portofolio, atau bagian konten multi-tier.

Cara menggunakan baris bersarang

Untuk memanfaatkan kekuatan baris bersarang, ikuti langkah -langkah ini dalam pembangun visual:

Mulailah dengan memasukkan baris standar ke tata letak halaman Anda. Ini akan berfungsi sebagai fondasi. Selanjutnya, klik tab Baris Baru untuk mengungkapkan opsi kolom untuk baris bersarang baru Anda.

Selanjutnya, pilih modul untuk kolom pertama. Untuk contoh ini, gambar.

Di kolom kedua, tambahkan gambar lain. Anda dapat membuat preset grup opsi untuk perbatasan, bayangan kotak, dan mengubah efek dari sana.

Anda dapat menambahkan baris bersarang ke kolom lain atau di bawah yang pertama. Kemungkinannya tidak terbatas.

Anda dapat membuat tata letak canggih yang mendalam beberapa level. Misalnya, Anda dapat membuat tabel harga dengan barisan bersarang untuk menampilkan dua tombol berdampingan, fitur yang kurang dalam versi Divi sebelumnya. Ada beberapa cara untuk menggunakan baris bersarang , menjadikannya fitur serbaguna saat membangun halaman web dengan divi. Mereka sempurna untuk membangun bagian pahlawan, halaman tim, header, footer, dan banyak lagi.

Kiat untuk menggunakan baris bersarang

• Rencanakan tata letak Anda terlebih dahulu: Sebelum menambahkan baris bersarang, membuat sketsa garis besar struktur halaman Anda untuk menentukan di mana menambahkannya memberikan nilai, seperti untuk bagian pahlawan berlapis-lapis, tabel harga, atau kisi tim.
• Gunakan untuk Desain Modular: Buat baris bersarang untuk komponen yang dapat digunakan kembali, seperti baris dengan gambar dan teks untuk testimonial, kemudian duplikat atau simpan untuk gaya yang konsisten di seluruh situs web Anda.
• Kombinasikan dengan kelompok modul: Pasangkan baris bersarang dengan kelompok modul untuk mengatur tata letak yang kompleks.
• Memanfaatkan breakpoint divi yang responsif: uji baris bersarang di tujuh breakpoint Divi 5 menggunakan soggle responsif untuk memastikan elemen bersarang selaras dengan benar pada semua perangkat.

4. Grup Modul untuk Konten Terorganisir

Grup modul bertindak sebagai wadah dalam Divi 5 yang memungkinkan Anda mengelompokkan beberapa modul dalam kolom. Anda dapat menata, memindahkan, atau menduplikasi mereka sebagai satu unit. Mereka dapat menyederhanakan alur kerja Anda, terutama untuk desain yang kompleks, dan mengatur panggung untuk dukungan flexbox yang akan datang, membuka kunci opsi penentuan posisi yang lebih tepat.

Dari sana, Anda dapat menambahkan modul desain dan baris bersarang atau menerapkan preset grup opsi ke grup untuk membuat tata letak gaya yang dapat dengan mudah Anda duplikat atau simpan ke perpustakaan Divi atau divi cloud.

Cara menggunakan grup modul

Untuk membuat grup modul, tambahkan baris baru dan pilih struktur kolom. Pilih modul grup dari opsi Divi 5 yang tersedia.

Di dalam grup modul, Anda dapat menambahkan modul, seperti teks, gambar, tombol, atau bahkan baris bersarang. Misalnya, Anda dapat membuat grup yang berisi heading, teks, gambar, dan tombol untuk bagian Action To Action.

Setelah ditata, Anda dapat menyimpan atau menduplikasi grup modul dengan mengklik menu ellipsis di sudut kanan atas grup.

Grup modul dapat membuat bagian anggota tim, bagian ajakan bertindak, header halaman interior, dan banyak lagi. Tetapi yang lebih penting, grup modul akan menjadi sangat membantu setelah fitur seperti FlexBox dan Loop Builder dirilis.

Tips untuk Menggunakan Grup Modul

• Rencana Grup Modul Secara Strategis: Gunakan Grup Modul untuk komponen yang dapat digunakan kembali, seperti CTA, testimonial, anggota tim, atau kartu produk. Mereka membantu merampingkan proses pembangunan dan mempertahankan organisasi.
• Gabungkan grup modul dengan preset: Terapkan preset grup opsi ke grup modul untuk gaya yang konsisten, seperti bayangan atau perbatasan yang seragam, di beberapa grup.
• Gunakan Divi Cloud: Simpan grup modul yang sering digunakan untuk divi cloud untuk akses cepat di seluruh proyek, terutama untuk klien dengan kebutuhan desain yang sama.

Menggunakan grup modul, Anda dapat membuat desain modular dan terorganisir yang mudah dikelola dan dikurangi, membuatnya ideal untuk membangun halaman web yang sederhana atau lebih kompleks.

5. Unit Lanjutan untuk Desain Dinamis

Fitur Unit Lanjutan Divi 5 mendukung rentang unit CSS yang lebih luas (PX, VW, REM, %, dll.) Dan fungsi seperti calc (), clamp (), min (), dan max () dalam bidang input tunggal, memungkinkan desain dinamis dan responsif. Misalnya, Anda dapat menetapkan lebar bagian ke Calc (100% - 40px) atau klem (20px, 3VW, 40px) untuk tipografi fluida yang timbangan berdasarkan ukuran viewport.

Unit canggih juga dapat digunakan sebagai variabel desain untuk menetapkan aturan global dan menjaga desain konsisten di seluruh situs Anda.

Cara menggunakan unit canggih

Ada beberapa cara untuk menggunakan unit canggih, tetapi cara yang paling efektif adalah dengan menggabungkannya dengan variabel desain untuk konsistensi desain. Namun, mungkin ada contoh di mana Anda ingin menetapkannya di level modul.

Contoh yang baik adalah dengan teks. Tentu, Anda dapat mengatur rumus klem () di manajer variabel untuk mengontrol ukuran di seluruh situs Anda, tetapi bagaimana jika Anda ingin membuat heading lebih berdampak dengan menambahkan ruang untuk membuatnya menonjol lebih baik? Di situlah unit canggih masuk.

Untuk mendemonstrasikan, klik untuk menambahkan modul heading ke halaman web Anda. Di tab Desain, arahkan ke bidang ukuran.

Di sebelah bidang lebar, klik ikon - untuk mengungkapkan opsi unit canggih.

Dari menu dropdown, pilih VW (Viewport Width) dan masukkan 50 . Ini akan memberi tahu judul untuk menempati 50% dari lebar viewport. Viewport adalah area yang terlihat dari jendela browser web. Jadi, terlepas dari seberapa lebar jendela browser, itu akan selalu menjadi setengah lebar jendela browser.

Ketika Anda mempratinjau bagaimana tajuk akan terlihat pada ukuran layar lain, Anda akan melihat judul tetap memiliki lebar yang sama, terlepas.

Tips untuk menggunakan unit canggih

• Mulai sederhana: Mulailah dengan unit dasar seperti PX atau % untuk desain langsung, kemudian bereksperimen dengan klem (), calc (), VH, atau VW untuk efek responsif.
• Gunakan klem untuk tipografi: Terapkan klem () untuk font ukuran atau jarak untuk membuat desain cairan yang dapat diakses yang beradaptasi dengan ukuran layar apa pun tanpa breakpoint manual.
• Kombinasikan dengan variabel desain: Simpan unit yang sering digunakan untuk judul dan teks tubuh sebagai variabel desain untuk mempertahankan konsistensi dan menyederhanakan pembaruan.

Unit-unit lanjutan memberi Anda ketepatan CSS khusus dalam antarmuka no-kode Divi, membuatnya mudah untuk membangun halaman web profesional yang dinamis yang beradaptasi mulus dengan perangkat apa pun.

6. Divi Ai Integrasi

Divi AI meningkatkan proses desain dengan menghasilkan teks, gambar, kode, atau seluruh bagian dan tata letak berdasarkan petunjuk bahasa alami. Ini bekerja di dalam pembangun visual di Divi 5, membuat sedikit desain atau bantuan copywriting saat dibutuhkan.

Misalnya, Anda dapat menggunakan prompt seperti "Buat bagian Pahlawan Modern dengan tajuk, tombol, dan gambar latar belakang." Divi AI akan menghasilkan tata letak yang sepenuhnya bergaya, yang dapat Anda sempurnakan secara manual agar sesuai dengan visi Anda.

Dengan Divi AI, Anda dapat mempercepat proses desain, mengatasi blok penulis, atau mendapatkan sedikit dorongan kreatif saat dibutuhkan.

Cara menggunakan divi ai

Untuk memanfaatkan sebagian besar divi saat membangun halaman web di Divi 5, Anda dapat menggunakannya untuk membantu Anda menulis salinan di merek, membuat gambar, menambahkan beberapa CSS ke modul yang ada, atau bahkan menghasilkan bagian. Divi AI dapat membantu Anda membuat halaman web indah yang beresonansi dengan pengunjung Anda.

Untuk menggunakan divi ai pada modul teks yang ada, arahkan arwah di atas area teks dan klik ikon Divi AI di tab Konten.

Kotak dialog dengan beberapa opsi akan muncul. Anda dapat menulis & mengganti konten yang ada, memperpanjang, mempersingkat, atau menyederhanakannya, memperbaiki ejaan & tata bahasa, menerjemahkannya, atau bahkan mengubah nada.

Setelah Anda memilih opsi, Divi AI akan mengubah salinan berdasarkan konten yang ada. Setelah selesai, Anda dapat menggunakan teks, mencoba lagi, meningkatkannya dengan AI, atau memperbaiki hasilnya dengan beberapa kata panduan.

Tips untuk menggunakan divi ai

• Spesifik dengan petunjuk Anda: Sertakan detail seperti nada, warna, atau preferensi tata letak saat menggunakan divi AI untuk membuat gambar atau bagian. Hal yang sama berlaku untuk teks dan kode. Semakin spesifik, semakin baik outputnya.
• Iterasi sesuai kebutuhan: Jika output awal tidak ideal, perbaiki prompt Anda atau hasilkan beberapa variasi untuk menemukan yang paling cocok.
• Gunakan untuk inspirasi: Salah satu cara terbaik untuk menggunakan divi AI adalah dengan bertukar pikiran, seperti menghasilkan konsep tata letak atau tagline, bahkan jika Anda berencana untuk menyesuaikan halaman web Anda dengan berat.

Praktik terbaik untuk membangun halaman web dengan Divi 5

Mengadopsi pendekatan strategis untuk fitur Divi 5 sangat penting untuk memaksimalkan potensinya. Mulailah dengan merencanakan sistem desain Anda di muka. Tentukan variabel desain inti, seperti warna primer dan sekunder, tautan yang relevan, pengaturan tipografi, dan font.

Saat membangun halaman Anda, buat preset grup opsi untuk gaya yang dapat digunakan kembali seperti efek hover tombol, bayangan, atau tipografi, yang mempercepat alur kerja Anda dan mempertahankan estetika yang kohesif di seluruh situs Anda.

Menguji lebih awal dan seringkali juga penting untuk hasil positif. Gunakan breakpoint responsif Divi 5 untuk melihat pratinjau unit canggih untuk memastikan mereka terlihat bagus di semua perangkat. Toggles responsif Divi 5 memberi Anda tujuh breakpoint untuk dijelajahi, memberi Anda gambaran yang lebih baik tentang bagaimana desain Anda akan muncul di layar berukuran berbeda.

Gabungkan preset elemen dengan preset grup opsi untuk menyeimbangkan fleksibilitas dan konsistensi. Gunakan preset elemen untuk modul tertentu, seperti modul CTA bergaya. Sebaliknya, untuk mempertahankan keseragaman, terapkan preset grup opsi untuk properti bersama, seperti gaya atau bayangan perbatasan. Ketika pembaruan diperlukan, Anda dapat menyesuaikan grup preset ini untuk perubahan global daripada mengedit elemen individu secara manual.

Akhirnya, jaga agar desain Anda sederhana untuk mempertahankan kinerja dan kegunaan. Hindari baris yang berlebihan atau mengandalkan rumus calc () yang kompleks kecuali diperlukan, karena ini dapat memperumit pengeditan. Demikian pula, buat grup modul untuk desain penting yang Anda rencanakan untuk digunakan kembali di situs web Anda.

Bangun halaman web yang lebih cerdas dengan Divi 5

Divi 5 mendefinisikan kembali desain web WordPress, memungkinkan Anda untuk dengan mudah membangun halaman web yang menakjubkan dan responsif. Pembangun visual modern, kontrol intuitif, fitur inovatif, dan divi AI merampingkan proses, memastikan hasil profesional dengan upaya minimal. Terlepas dari tingkat keterampilan Anda, alat -alat ini membuat membangun situs web yang efektif dan dinamis lebih cepat, lebih pintar, dan lebih kreatif.

Siap menjelajahi potensi Divi 5? Unduh rilis Divi 5 Alpha hari ini dan bereksperimen dengan fitur terbarunya untuk menghidupkan visi Anda. Divi 5 cocok dengan situs baru tetapi belum direkomendasikan untuk mengubah yang sudah ada.

Kami ingin mendengar pikiran Anda! Bagikan umpan balik Anda dengan berkomentar di bawah ini. Lebih baik lagi, posting tentang pengalaman Divi 5 Anda di media sosial untuk membantu menyebarkan berita.