ACF VS VS Variabel Desain Divi: Kapan Menggunakan Apa
Diterbitkan: 2025-06-08Dengan rilis alpha terbaru Divi 5, variabel desain telah memasuki ekosistem Divi sebagai pendekatan baru untuk mengelola nilai desain dan konten di situs web Anda. Ini membuat pengguna kami bersemangat, terutama mereka yang telah mengandalkan bidang custom custom (ACF) selama bertahun -tahun. Haruskah Anda tetap dengan ACF atau beralih ke variabel Divi? Atau dapatkah Anda menggunakan keduanya secara bersamaan?
Posting ini menjelaskan perbedaannya dan kapan Anda harus menggunakan apa. Ayo sampai ke sana!
Divi 5 siap digunakan untuk pembuatan situs web baru.
- 1 Apa itu variabel desain divi?
- 2 Membangun Situs Web yang Lebih Cerdas & Lebih Mudah
- 2.1 Apa yang ACF bawa ke meja
- 2.2 Fleksibilitas Variabel Desain Divi
- 2.3 Bagaimana mereka membandingkan
- 3 Bisakah variabel ACF dan Divi bekerja bersama?
- 3.1 Use Case #1 - Situs web bisnis lokal dengan perubahan musiman
- 3.2 Use Case #2 - Situs Web Portofolio Fotografi
- 3.3 Membuat pilihan yang tepat untuk proyek Anda
- 4 mulai membangun lebih pintar
Apa itu variabel desain divi?
Saat membangun situs web, Anda akan sering menggunakan kembali informasi yang sama di banyak halaman, dari warna hingga gaya font, detail kontak, dan banyak lagi. Variabel desain membantu Anda mengelola elemen -elemen bersama tersebut dari satu tempat pusat. Tidak seperti bidang ACF standar, variabel desain tidak terikat pada konten pasca-spesifik, mereka bertindak sebagai nilai desain dan konten global, bukan bidang konten yang dinamis.
Alih -alih menggali setiap halaman untuk membuat pembaruan kecil, seperti mengubah nomor telepon atau menyesuaikan warna latar belakang, Anda memperbarui variabel sekali, dan itu mengubah aliran di seluruh situs Anda secara otomatis.
Ingin mengganti warna merek Anda untuk promosi musiman? Ubah satu variabel. Perlu memperbarui teks footer atau logo Anda? Satu mengedit memperbarui setiap contoh secara instan. Dengan variabel desain Divi, Anda tidak hanya menata lebih cepat tetapi juga membangun lebih pintar.
Membangun situs web yang lebih pintar & lebih mudah diperbarui
Bidang ACF standar meningkatkan cara desain dan konten pengguna pengguna WordPress dengan membuat bidang khusus terikat pada posting tertentu. Variabel desain Divi mengambil rute yang sama sekali berbeda. Mereka nilai desain yang dapat diakses secara global yang diperbarui di mana -mana sekaligus. Perbedaannya pada awalnya mungkin tampak halus, tetapi mengubah cara Anda membangun dan memelihara situs WordPress.
Apa yang dibawa ACF ke meja
Advanced Custom Fields (ACF) memungkinkan Anda menambahkan bidang data tambahan ke halaman dan posting Anda dalam versi intinya. Anda mendapatkan lebih dari sekadar judul dasar dan kotak konten. ACF memberi Anda bidang khusus untuk gambar, blok teks, file, menu dropdown, dan banyak lagi.
Anda dapat menggabungkan bidang terkait ke dalam grup logis untuk proyek Anda. Misalnya, Anda dapat membuat grup anggota staf dengan tempat untuk judul pekerjaan, departemen, foto, dan bio. Atau buat detail produk dengan bidang untuk spesifikasi, harga, dan daftar fitur.
Grup lapangan ini bekerja dengan sangat baik dengan jenis posting khusus. Saat Anda menggabungkannya, Anda dapat membangun bagian konten khusus seperti direktori tim, daftar layanan, atau katalog properti - masing -masing dengan bidang yang tepat untuk konten itu.
Orang -orang menyukai ACF karena cocok dengan lancar ke area admin WordPress biasa. Bidang khusus Anda muncul tepat di layar pengeditan normal, memudahkan klien yang tidak memahami teknologi untuk memperbarui konten.
Halaman Opsi: Panel Kontrol Situs Anda
Halaman opsi ACF, tersedia di ACF Pro, memungkinkan Anda membuat tempat pusat untuk informasi di seluruh lokasi, tidak seperti bidang ACF biasa yang melekat pada konten tertentu. Fitur ini bagus untuk:
- Informasi kontak
- Tautan penting
- Jam kerja dan lokasi
- Gambar dan logo default
Ketika sesuatu berubah, seperti nomor telepon Anda, Anda hanya perlu memperbaruinya sekali di bagian admin. Perubahan akan muncul di mana -mana di situs Anda segera. Perlu dicatat bahwa Anda membutuhkan ACF Pro untuk menggunakan halaman opsi.
Integrasi mendalam dengan Divi
Bidang ACF standar berpasangan dengan baik dengan Divi melalui sistem konten dinamis Divi. Saat Anda membuat halaman di Divi Builder, Anda dapat menarik informasi dari bidang khusus ACF Anda. Kerja tim ini memungkinkan Anda menggunakan alat desain Divi bersama manajemen konten ACF.
Begini cara kerjanya biasanya:
- Siapkan bidang khusus dengan ACF
- Isi bidang ini dengan konten di WordPress
- Rancang tata letak halaman Anda di Divi
- Hubungkan Konten ACF Anda ke Modul Divi Anda
Kombinasi Divi dan ACF ini menciptakan pemisahan yang bermanfaat. Editor konten dapat memperbarui informasi dalam antarmuka yang bersih dan terorganisir sementara desainer dapat membangun tata letak tanpa macet dalam detail manajemen konten.
Pendekatan fleksibel
Bidang ACF standar bekerja untuk keterampilan Anda, baik Anda kode atau suka alat visual. Pengembang dapat menggunakan fungsi template untuk menampilkan nilai bidang dalam tema khusus. Jika Anda tidak mengkode, Anda masih dapat menggunakan bidang ACF dengan pembangun seperti Divi tanpa mengetahui PHP.
Fleksibilitas ini membuat bidang ACF standar cocok untuk situs web bisnis dasar dan proyek yang kompleks. Anda dapat mulai dengan fitur sederhana dan menggunakan yang lebih canggih saat Anda belajar dan situs Anda tumbuh.
Fleksibilitas variabel desain Divi
Variabel desain Divi 5 membuat manajemen situs web lebih sederhana. Mereka menyimpan pilihan desain dan konten yang dapat digunakan kembali yang dapat Anda gunakan di mana saja di situs Anda. Saat Anda memperbarui satu variabel, itu berubah di mana pun Anda menggunakannya.
Manajer variabel ditemukan dengan mengklik ikon Variabel di sidebar Visual Builder Divi 5. Ini memungkinkan Anda untuk mengelola semua elemen desain Anda di satu tempat.
Enam jenis variabel desain
Divi 5 mencakup enam jenis variabel yang berbeda untuk membantu dengan berbagai aspek situs web Anda:
- Variabel Warna: Tahan warna merek Anda, warna teks, dan latar belakang
- Anda dapat memberi nama mereka dengan jelas seperti "Coral Blush" atau "Champagne Gold"
- Gunakan untuk tombol, teks, latar belakang, dan perbatasan
- Kemudian, Anda dapat mengubah seluruh skema warna Anda dengan memperbarui beberapa variabel ini
- Variabel Font: Tetapkan opsi tipografi di luar tema penyesuaian
- Anda dapat membuat pengaturan font terpisah untuk judul, teks tubuh, atau area khusus
- Ini membuat tipografi konsisten di situs web Anda
- Saat dibutuhkan, Anda dapat memperbarui semua font sekaligus
- Variabel Angka: Pengukuran menyimpan yang digunakan dalam desain Anda
- Bagus untuk jarak, perbatasan, ukuran, dan dimensi teks
- Bekerja dengan unit CSS seperti Clamp () untuk desain responsif
- Ini membantu Anda menjaga jarak dan ukuran yang konsisten di mana -mana
Variabel Divi 5 juga menangani konten yang muncul di seluruh situs Anda:
- Variabel Gambar: Simpan gambar yang digunakan di beberapa tempat
- Sempurna untuk logo, pola latar belakang, dan foto
- Perbarui gambar sekali bukan di setiap halaman
- Membuat pembaruan musiman atau rebranding lebih cepat
- Variabel Teks: Simpan konten tertulis yang muncul di banyak tempat
- Berguna untuk informasi kontak, tagline, dan jam kerja
- Ubah teks sekali untuk memperbaruinya di mana -mana
- Menjaga informasi tetap konsisten saat detail berubah
- Variabel tautan: URL toko untuk tombol dan menu
- Gunakan untuk tombol tindakan, tautan media sosial, dan navigasi
- Hindari tautan yang rusak saat alamat web berubah
- Perbarui semua tombol terkait sekaligus saat menambahkan halaman baru
Manfaat dunia nyata
Variabel desain menghemat waktu dan mengurangi kesalahan karena visual. Ketika klien ingin mengubah warna situs web mereka, Anda dapat memperbarui hanya variabel warna, dan semuanya dengan warna (tombol, latar belakang, dan teks) segera berubah di seluruh situs.
Variabel -variabel ini bekerja dengan baik dengan sistem preset Divi. Tambahkan variabel ke preset modul Anda, dan ketika Anda memperbarui variabel, setiap modul dengan perubahan variabel itu.
Untuk situs web yang terlihat bagus di semua perangkat, variabel angka dengan fungsi CSS seperti klem () membantu tata letak Anda sesuai dengan ukuran layar apa pun tanpa memerlukan desain terpisah. Ketika banyak orang bekerja di situs web, variabel desain membuat semua orang menggunakan aturan desain yang sama. Ini membantu situs tetap konsisten dan profesional tidak peduli siapa yang membuat perubahan.
Bagaimana mereka membandingkan
Saat membandingkan bidang ACF standar dan variabel desain Divi, kami melihat dua pendekatan berbeda untuk membuat situs web lebih mudah dikelola. Mari kita uraikan perbedaan inti mereka:
Fitur | ACF | Variabel Desain Divi |
---|---|---|
Fungsi inti | Bidang khusus dengan tipe data yang fleksibel | Nilai desain yang dapat diakses secara global dan pembaruan instan |
Kontrol Desain | Mungkin memerlukan kustomisasi template dan kode khusus | Antarmuka visual langsung |
Ruang lingkup aplikasi | Posting/halaman spesifik atau di seluruh situs melalui halaman opsi | Konsistensi desain di seluruh situs |
Mekanisme Perbarui | Perbarui di admin, mencerminkan di mana diterapkan | Satu perubahan segera memperbarui semua contoh |
Antarmuka | Area admin wordpress backend | Lingkungan pembangun visual Divi |
Persyaratan teknis | Alur kerja WordPress yang akrab; Pengetahuan PHP untuk Implementasi Lanjutan | Mengakomodasi semua tingkat keterampilan. |
Kontrol Tipografi | Bidang teks dengan entri CSS manual | Kontrol visual dengan fungsi CSS |
Integrasi | Bekerja lintas tema dan pembangun | Asli ekosistem Divi |
Bidang ACF standar bersinar saat Anda membutuhkan konten terstruktur yang berubah antara posting dan halaman, sementara variabel desain divi mempertahankan konsistensi desain di seluruh lokasi. Ada beberapa aspek di mana halaman opsi ACF (tersedia di ACF Pro) dan variabel desain divi serupa:

Fitur | Halaman opsi ACF | Variabel Desain Divi |
---|---|---|
Penyimpanan Pengaturan Global | ||
Antarmuka manajemen pusat | ||
Simpan konten teks | ||
Simpan referensi gambar | ||
Simpan tautan/URL | ||
Perbarui banyak contoh sekaligus | ||
Dukungan Integrasi | Bergantung. Biasanya integrasi terbatas | Integrasi penuh dalam pembangun divi |
Kontrol gaya langsung | Mungkin memerlukan implementasi khusus | Antarmuka visual |
Nilai responsif dengan fungsi CSS | Entri teks manual | Dukungan bawaan |
Termasuk dalam inti | Membutuhkan versi pro | Termasuk dengan Divi 5 |
Penting untuk dipahami bahwa variabel desain divi tidak mencoba melakukan semua yang dilakukan ACF Pro. Mereka memberi Anda cara lain untuk menyimpan dan menggunakan informasi yang sama di seluruh situs web Anda. ACF masih dapat melakukan banyak hal yang tidak bisa dilakukan oleh variabel divi:
Kemampuan | ACF | Variabel Desain Divi |
---|---|---|
Buat Jenis Posting Kustom | ||
Bangun Metabox Kustom | ||
Membangun hubungan data yang kompleks | ||
Membuat taksonomi khusus | ||
Mengatur bidang bersyarat | ||
Buat bidang repeater | ||
Desain blok konten yang fleksibel | ||
Tambahkan Validasi Bidang | ||
Bangun Layar Admin Kustom | ||
Menyimpan konten dalam database | ||
Hubungkan dengan plugin lain melalui API | ||
Bekerja dengan Divi | ||
Bekerja dengan tema WordPress |
Variabel Divi berfungsi dengan baik untuk pekerjaan sederhana seperti mengubah info kontak, bertukar foto dengan musim, atau memperbarui warna merek Anda. ACF sangat ideal untuk situs web yang membutuhkan manajemen konten khusus di luar elemen desain, seperti membuat bidang khusus dan jenis posting. Demikian juga, halaman opsi ACF, tersedia dengan ACF Pro, adalah versi yang lebih matang dari variabel desain divi.
Namun, variabel desain Divi dibangun menjadi Divi 5 tanpa biaya tambahan. Anda dapat mengatur warna, font, teks, dan gambar tepat di pembangun yang sudah Anda gunakan. Tidak perlu plugin tambahan atau mempelajari sistem baru. Persyaratan proyek Anda harus memandu sistem mana yang mengambil peran utama dalam alur kerja Anda, tetapi ingat bahwa alat -alat ini memecahkan masalah yang berbeda secara fundamental terlepas dari kesamaan permukaannya.
Bisakah variabel ACF dan Divi bekerja bersama?
Ya. Anda benar -benar dapat menggunakan bidang ACF standar dan variabel desain divi di situs web yang sama. Mereka bekerja dengan baik karena mereka menangani berbagai bagian situs Anda. Saat Anda memasangkannya, bidang ACF standar dapat menangani hubungan data yang kompleks seperti situs real estat dengan daftar postingan properti yang terhubung ke agen, lingkungan, dan harga bidang khusus.
Sementara itu, variabel desain menjaga warna merek, tipografi, dan jarak Anda konsisten di setiap halaman dan templat postingan. Ini berarti situs web Anda memiliki manajemen data yang kuat dan konsistensi visual.
Editor konten Anda dapat bekerja dengan bidang yang sudah dikenal ACF untuk memperbarui detail atau harga properti, sementara situs Anda mempertahankan tampilan profesionalnya melalui sistem desain Divi. Kombinasi ini memberi Anda kontrol yang lebih baik daripada yang bisa disediakan oleh salah satu alat.
Kuncinya adalah mengetahui alat mana yang akan digunakan untuk setiap pekerjaan. Dengan memahami kekuatan mereka, Anda dapat membangun situs web dengan struktur konten canggih yang masih mempertahankan identitas visual yang kohesif. Mari kita lihat contoh nyata tentang bagaimana alat -alat ini memecahkan masalah situs web umum bersama -sama.
Gunakan Kasus #1 - Situs web bisnis lokal dengan perubahan musiman
Situs web toko roti lokal membutuhkan konten terstruktur dan pembaruan desain musiman. Kami menggabungkan bidang ACF standar dan variabel desain divi secara praktis untuk situs ini.
Bidang ACF standar menangani katalog produk roti dengan jenis dan bidang pos khusus untuk:
- Item
- Deskripsi item
- Bahan -bahan dan informasi alergen
- Tingkat Harga
- Status ketersediaan
Detail ini berubah untuk setiap produk, jadi pendekatan terstruktur ACF berfungsi dengan sempurna. Staf toko roti memperbarui informasi produk melalui antarmuka WordPress ACF yang akrab.
Sementara itu, variabel desain Divi mengelola elemen desain musiman:
- Skema warna yang berubah seiring musim
- Teks spanduk promosi untuk liburan
- Gambar produk unggulan di beranda
- Pola latar belakang yang menyegarkan setiap bulan
Ketika musim gugur tiba, pemilik toko roti hanya memperbarui variabel warna musiman dari pastel musim panas ke nada musim gugur, dan seluruh situs menyegarkan secara instan.
Gambar latar belakang berubah untuk menunjukkan dekorasi bertema jatuh, tanpa perlu mengedit setiap halaman secara individual menggunakan variabel gambar sebagai berikut:
Pengaturan ini memberi toko roti yang terbaik dari kedua dunia: data produk terstruktur melalui bidang ACF standar dan penyegaran musiman yang cepat melalui variabel desain Divi.
Gunakan Kasus #2 - Situs Web Portofolio Fotografi
Situs web bisnis fotografi perlu menyeimbangkan galeri klien yang terorganisir dengan merek visual yang konsisten. Beginilah bidang ACF standar dan variabel desain divi menyelesaikan tantangan ini. Bidang ACF standar mengelola aspek konten terstruktur:
- Galeri proyek klien sebagai jenis posting khusus
- Bidang khusus untuk:
- Paket Layanan dengan bidang harga terperinci
- Koleksi testimonial dengan nama klien
- Jenis proyek
- Spesifikasi peralatan
Fotografer memperbarui setiap galeri klien melalui antarmuka ACF, menambahkan:
- Tanggal dan Lokasi Proyek
- Informasi Dasar
- Penyortiran dan kategorisasi gambar
Sementara itu, variabel desain divi menangani konsistensi merek:
- Sistem Tipografi Untuk Semua Judul dan Teks Tubuh
- Palet warna merek diterapkan di semua halaman
- Nilai jarak untuk ritme tata letak yang konsisten
- Pengaturan Grid Galeri untuk Presentasi Seragam
Butuh penyegaran merek? Fotografer memperbarui beberapa variabel desain, dan seluruh situs berubah. Galeri menyimpan jaraknya karena variabel angka, dan setiap proyek menyimpan detailnya berkat ACF.
Ketika musim pernikahan sibuk, fotografer mengubah satu variabel teks untuk status pemesanan, dan diperbarui di mana -mana di situs. Tidak ada lagi memeriksa setiap halaman untuk memperbaiki teks yang sama. Kombinasi ini membuat foto dan info klien (dalam ACF) terpisah dari penampilan situs (dengan variabel desain) sehingga fotografer bisa mendapatkan struktur dan penampilan yang benar.
Membuat pilihan yang tepat untuk proyek Anda
Melihat contoh roti dan fotografi kami, kami dapat melihat alat -alat ini mengatasi berbagai tantangan situs web. Pemilik toko roti memperbarui info produk sambil dengan mudah bertukar warna musiman. Fotografer menjaga galeri tetap terorganisir tetapi masih dapat memperbarui tampilan situs mereka hanya dengan beberapa klik.
Beberapa situs hanya membutuhkan salah satu alat ini, sementara yang lain bekerja lebih baik dengan keduanya. Satu hal yang jelas: Memilih antara bidang ACF standar dan variabel desain Divi tidak harus menjadi keputusan baik atau baik.
Variabel desain | ACF | Keduanya | |
---|---|---|---|
Terbaik untuk | Konsistensi visual, perubahan gaya cepat, pembaruan info mudah | Konten terstruktur, bidang kompleks, hubungan | Proyek yang membutuhkan konten terstruktur & perubahan desain |
Contoh Penggunaan | Warna/logo dan konten di seluruh situs, pembaruan musiman/siklus | Info kontak di seluruh situs, pengaturan global, detail perusahaan (membutuhkan halaman opsi) | Pemisahan kekhawatiran (desain vs konten), situs besar |
Editor | Antarmuka pembangun visual | Antarmuka Admin WordPress | Kedua editor dapat digunakan |
Biaya | Termasuk divi | Plugin (mungkin termasuk fitur berbayar) | - - |
Divi 5 telah menambahkan opsi berguna lain ke toolkit Anda. Apakah Anda sedang membangun sesuatu yang sederhana atau kompleks, Anda sekarang memiliki lebih banyak cara untuk membuat situs yang terlihat bagus dan bekerja dengan baik.
Mulailah membangun lebih pintar
Intinya adalah bahwa variabel desain Divi 5 dan bidang ACF standar masing -masing menyelesaikan masalah yang berbeda sambil mengalami tumpang tindih (terutama dengan halaman opsi). Butuh pembaruan desain cepat di seluruh situs Anda? Variabel desain bersinar. Ingin manajemen konten yang kuat dengan logika bersyarat? Bidang ACF standar mengirimkan.
Banyak situs bekerja dengan baik dengan kedua alat berdampingan. Halaman opsi ACF lebih baik untuk mengelola kebutuhan konten yang kompleks. Variabel desain tidak dimaksudkan untuk sepenuhnya mengganti halaman opsi, tetapi bagi sebagian besar pengguna dengan persyaratan sederhana, mereka bisa menjadi alternatif yang kuat.
Fitur Variabel Desain sekarang tersedia dengan Divi 5 - tidak ada biaya tambahan, tidak perlu pengkodean, dan siap untuk proyek Anda berikutnya.
Ingat: Divi 5 bekerja paling baik untuk situs web baru. Kami belum merekomendasikan memindahkan situs yang ada ke Divi 5 dulu.