Memperkenalkan variabel desain untuk Divi 5
Diterbitkan: 2025-04-04Saya senang memperkenalkan variabel desain untuk Divi 5, fitur baru yang secara signifikan akan meningkatkan alur kerja desain Divi dan memberi pengguna Divi kaki yang serius atas pembangun lainnya.
Anda dapat mendefinisikan variabel untuk apa pun, seperti warna, font, angka, gambar, dan teks, dan mencolokkannya ke elemen dan preset divi. Saat Anda memperbarui variabel, desain dan perubahan konten situs web Anda.
Sinergi antara variabel dan sistem desain berbasis preset baru divi sangat fantastis. Izinkan saya menunjukkan cara kerjanya.
Lihat video berikut untuk melihat fitur baru yang sedang beraksi.
- 1 Divi Goes "Global" dengan manajemen variabel
- 1.1 Membuat variabel baru
- 1.2 Menggunakan variabel dalam elemen dan preset
- 2 contoh variabel desain
- 2.1 Contoh Satu: Kelola Font Global
- 2.2 Contoh Dua: Kelola Ukuran Global
- 2.3 Contoh Tiga: Globalisasi seluruh situs web Anda
- 3 Coba Divi 5 Hari Ini
- 4 Sneak Peek: Baris bersarang
- 5 lagi pembaruan Divi 5 sedang dalam perjalanan
Divi Goes "Global" dengan manajemen variabel
Berkat sistem warna global Divi, Anda mungkin sudah terbiasa dengan konsep variabel desain. Warna global adalah jenis variabel desain. Namun, dengan pembaruan ini, kami memperkenalkan semuanya global! Plus, mengelola pengaturan global Anda lebih mudah dari sebelumnya, berkat manajer variabel baru.
Membuat variabel baru
Ikon Variabel di bilah sisi kiri akan membuka manajer variabel situs web Anda. Tambahkan variabel baru, beri nama dan nilai, dan kemudian Anda dapat mencolokkan variabel itu ke pengaturan yang relevan di halaman apa pun. Divi saat ini mendukung enam jenis variabel yang mencakup semua bidang input asli Divi:
- Warna : Warna sangat penting untuk setiap situs web; Sebagian besar situs web hanya menggunakan tiga hingga empat warna primer. Mendefinisikan variabel warna dan menggunakannya melalui situs web Anda berarti Anda dapat menyesuaikan seluruh palet warna situs web Anda dalam hitungan detik.
- Font : Era bekerja dengan font statis sudah berakhir. Plus, Anda tidak lagi terbatas pada pengaturan font global di tema penyesuaian. Anda dapat mendefinisikan font situs web Anda sebagai variabel dan mengelola semuanya di satu tempat.
- Nomor : Anda dapat menggunakan variabel angka untuk merancang sistem ukuran situs web Anda. Misalnya, Anda dapat menggunakan ukuran standar perbatasan standar di semua elemen. Mengubahnya menjadi variabel akan memungkinkan Anda untuk menyesuaikan ukuran sudut bulat Anda dengan mengedit variabel tunggal. Penggunaan sehari -hari lainnya termasuk mendefinisikan ukuran teks dan ketinggian garis situs web Anda, lebar wadah dan jarak, dan semua yang ada di antaranya.
- Gambar : Apakah Anda menggunakan gambar yang sama di beberapa halaman? Misalnya, Anda mungkin memiliki gambar latar belakang standar yang berfungsi sebagai motif merek yang akrab. Jika Anda mengubahnya menjadi variabel, menyegarkan merek Anda di ujung jalan itu mudah.
- Teks : Variabel tidak terbatas pada desain; Anda juga dapat mendefinisikan variabel teks. Misalnya, jika Anda mengubah nomor telepon perusahaan Anda dan alamat menjadi variabel teks, Anda tidak perlu berburu untuk semua tempat yang Anda gunakan variabel tersebut ketika detail bisnis Anda berubah.
- URL : Kami juga melemparkan variabel URL, karena mengapa tidak? Anda mungkin ingin memiliki tautan ajakan utama Anda di halaman yang berbeda selama waktu yang berbeda dalam setahun (mengubahnya selama penjualan, misalnya). Alih -alih memperbarui URL itu di mana -mana, perbarui variabel tunggal.
Menggunakan variabel dalam elemen dan preset
Klik ikon Variabel di atas pengaturan untuk memilih dari daftar variabel yang relevan dan konten dinamis dari situs web Anda.
Variabel Divi dan sistem konten dinamis telah diperluas ke semua bidang, di mana sebelumnya hanya tersedia di bidang konten. Itu berarti Anda dapat menetapkan variabel dan konten dinamis ke bidang angka, bidang font, dll.

Desain Contoh Variabel
Variabel desain bersifat instrumental dan akan dengan cepat menjadi komponen inti dari alur kerja desain Divi. Tetapi jika konsepnya belum diklik, izinkan saya memberi Anda beberapa contoh.
Contoh Satu: Kelola Font Global
Bagaimana Anda bisa menggunakan variabel desain untuk meningkatkan alur kerja Anda? Pertama, mari kita pertimbangkan variabel font.
Sebagian besar situs web menggunakan dua hingga tiga font. Anda mungkin menghabiskan waktu menyiapkan tubuh yang Anda inginkan dan judul teks di berbagai elemen dan preset.
Tetapi bagaimana jika Anda ingin beralih? Bahkan jika Anda merancang situs web Anda secara optimal dengan preset, mungkin memakan waktu untuk kembali dan mengubah font. Anda bahkan mungkin tidak ingat semua tempat yang Anda gunakan font tertentu.
Di situlah variabel font masuk.
Saya membangun situs web dalam video di atas menggunakan tiga variabel font: font judul, font tubuh, dan font sorotan.
Menambahkan variabel font judul ke elemen seperti preset blurb default saya mudah. Karena saya tidak pernah menggunakan nilai font statis tetapi sebaliknya terhubung dengan variabel saya, font di situs web saya sepenuhnya dinamis.
Mengubah judul situs web saya semudah memperbarui variabel font judul.
Contoh Dua: Kelola Ukuran Global
Anda dapat melakukan hal yang sama dengan ukuran teks.
Untuk situs web dalam video di bawah ini, saya mendefinisikan serangkaian delapan ukuran teks untuk berbagai tingkat heading dan gaya teks tubuh. Ketika saya memperbarui preset blurb default saya dan menetapkan variabel ukuran teks heading medium, semua judul uraian saya mewarisi nilai dari variabel itu.
Karena saya mendasarkan seluruh ukuran teks situs web saya pada variabel, saya dapat mengelola ukuran teks situs web saya sepenuhnya dari manajer variabel.
Contoh Tiga: Globalisasi seluruh situs web Anda
Dalam video di atas, Anda dapat melihat situs web yang memanfaatkan kekuatan penuh variabel. Semua warna adalah variabel, seperti halnya font, ukuran teks, ukuran perbatasan-radius, dan nilai jarak dalam elemen wadah saya.
Tidak hanya itu, tetapi saya juga mengubah konten bersama menjadi variabel. Nama perusahaan saya, nomor telepon, dan alamat adalah variabel konten.
Bahkan gambar latar belakang, motif merek yang akrab di seluruh situs web, adalah variabel gambar yang dapat saya ubah dengan mudah.
Coba Divi 5 hari ini
Variabel desain untuk Divi 5 tersedia saat ini, dan ini adalah salah satu dari banyak fitur yang datang ke Divi tahun ini.
Anda dapat mengikuti saat kami maju melalui rilis akhir Divi 5 dan seterusnya, dengan pembaruan setiap dua minggu. Bergantung pada prioritas Anda, Anda dapat menggunakan Divi 5 sekarang untuk membangun situs web baru atau menunggu sampai kami menambahkan lebih banyak fitur, apa pun yang paling cocok untuk Anda.
Sebagaimana diuraikan dalam jadwal rilis multi-fase asli Divi 5, alpha publik Divi 5 seperti "Divi 5 Lite." Ini kehilangan beberapa fitur dan mungkin tidak cocok untuk situs web yang ada, tetapi siap digunakan di situs web baru jika Anda lebih suka pengalaman daripada Divi 4.
Kami ingin Anda mencobanya, dan jika Anda menyukainya, menggunakannya; Ketika semua orang menyukainya, kami akan membuatnya resmi.
Sneak Peek: Baris bersarang
Kami sedang membangun fitur dengan cepat . Setiap kali kami menyelesaikan fitur baru, kami memulai yang baru. Setiap kali kami memulai fitur baru, saya mengintip.
Jika Anda melewatkannya, lihat fitur minggu lalu Sneak Peek, di mana saya memamerkan barisan bersarang. Baris di dalam baris! Ini adalah ide sederhana tetapi langkah pertama yang penting dalam menciptakan sistem tata letak yang lebih fleksibel untuk Divi 5.
Tonton video ini untuk semua detailnya.
Lebih banyak pembaruan Divi 5 sedang dalam perjalanan
2025 adalah tahun Divi 5 . Pekerjaan yang membosankan ada di belakang kita. Kami membangun fondasi super cepat, dan sekarang saatnya bagi Divi untuk kembali.
Terima kasih telah menonton, dan sebelum Anda pergi, saya punya bantuan untuk ditanyakan. Jika Anda di sini untuk comeback Divi, komentari video ini; Saya akan membaca setiap komentar. Saya ingin melihat video ini mencapai dua ratus komentar , jadi periksa jumlah komentar dan ajukan bantuan jika Anda bisa. Ini cara yang bagus untuk memberi makan algoritma, dan yang lebih penting, kami suka mengobrol dengan Anda.
Jangan lupa untuk mengikuti kami di YouTube dan berlangganan buletin Divi sehingga Anda tidak pernah melewatkan pembaruan. Sampai jumpa untuk pengumuman fitur Divi 5 lainnya, yang saya janjikan akan tepat di tikungan.