Cara Menerapkan Palet Warna ke Situs Web Divi Anda

Diterbitkan: 2021-09-05

Ada beberapa hal yang lebih buruk di internet daripada situs web yang hambar. Tentu, beberapa situs web sengaja dibuat dengan tampilan brutal atau minimalis (melihat Craigslist Anda), tetapi bahkan itu tidak hambar . Memiliki palet warna yang solid adalah cara yang pasti untuk membuat website Anda menonjol dari massa krem, mereka eshops monokromatik bersemangat bahwa de pers lebih dari im pers. Untungnya, Divi telah membantu Anda dengan kombinasi sistem Warna Ajaib dan fitur Warna Global kami. Anda dapat menerapkan palet warna ke situs web Divi Anda dengan mudah. Hasilnya pasti akan mengesankan pengunjung Anda.

Tips Umum tentang Palet Warna

Terlepas dari betapa mudahnya menambahkan palet warna ke situs web Divi Anda, sangat penting bagi Anda untuk menggunakan jenis palet yang tepat untuk industri dan merek Anda. Jika Anda sudah memiliki warna merek, itu adalah pilihan yang jelas untuk mampir. Di luar masuk jauh ke dalam teori warna (yang sangat menarik, omong-omong), kami memiliki beberapa tip yang dapat membantu Anda mencari tahu di mana untuk memulai dengan Anda. palet warna baru.

1. Tentukan Situs Web Berwarna Gelap atau Berwarna Terang

Dalam palet warna yang akan Anda gunakan, Anda pasti akan memiliki warna terang dan gelap. Kontras wajib dalam palet warna agar konten tertulis tidak hilang.

Sekarang, itu membawa kita langsung ke pertanyaan pertama yang harus Anda tanyakan pada diri sendiri ketika ingin menerapkan palet warna ke situs web Anda; apakah Anda ingin membuat situs web berwarna gelap atau berwarna terang? Hanya karena Anda memilih satu tidak berarti Anda tidak dapat menggabungkannya, tetapi membuat pilihan membantu Anda memilih palet warna dengan lebih mudah.

2. Pilihan Warna

Secara teori, Anda dapat menentukan sendiri berapa banyak warna yang Anda inginkan dari palet warna Anda. Tidak ada cara standar untuk menerapkan atau menentukan palet warna. Namun, untuk menciptakan keseimbangan warna yang bagus dengan Divi, sebaiknya gunakan lima warna.

Untuk membantu Anda menerapkan palet warna dengan lima warna ke situs web Anda, kami memilih satu jenis metode yang akan kami terapkan secara konsisten ke tata letak yang sama saat menampilkan palet warna yang berbeda. Tapi sebelum kita masuk ke dalamnya, mari kita lihat berbagai jenis warna yang perlu Anda miliki di palet warna Anda jika Anda ingin mengikuti metode kami.

Warna Latar Belakang

palet warna

Pastikan warna latar belakang yang Anda pilih cocok satu sama lain. Anda akan menggunakan warna latar belakang ini berdekatan satu sama lain dan untuk mendapatkan hasil yang indah; mereka harus memiliki harmoni tertentu.

Warna huruf

perubahan palet warna

Hal berikutnya yang harus Anda pilih adalah warna font. Logikanya, warna font tergantung pada warna background yang Anda pilih. Jika Anda telah memilih warna latar belakang berwarna terang, pastikan warna font Anda berwarna gelap dan sebaliknya.

Warna Hyperlink & CTA

perubahan palet warna

Warna hyperlink yang Anda pilih adalah salah satu warna yang menghidupkan situs web Anda. Pastikan warna ini menonjol dari warna lain di palet Anda karena Anda akan menggunakannya untuk ajakan bertindak yang Anda sertakan di situs web Anda.

Warna Untuk Sentuhan Akhir

perubahan palet warna

Last but not least, Anda dapat memilih warna out-of-the-box lain yang membawa warna ke situs web Anda. Meskipun warna ini tidak sepenting warna hyperlink, ini akan membantu Anda melengkapi keseimbangan warna di situs web Anda.

3. Pastikan Kontrasnya Cukup

Seperti disebutkan sebelumnya, penting untuk memberikan kontras antara beberapa warna dalam palet warna Anda. Jika Anda menggunakan palet warna untuk situs web, kontras ini terutama akan membantu Anda membuat konten tertulis yang Anda bagikan dapat dibaca. Karena, jika konten Anda tidak mudah dibaca, apa gunanya?

4. Temukan Warna yang Tepat Gunakan Keseimbangan

Ada berbagai cara untuk menentukan seberapa sering Anda ingin menggunakan warna tertentu dalam palet warna Anda. Menciptakan keseimbangan warna yang baik diperlukan jika Anda tidak ingin mereka merasa kewalahan dengan warna yang Anda gunakan di situs web Anda.

Pastikan Anda sering menggunakan warna yang lebih netral dalam palet warna Anda dan gunakan warna lain untuk menonjolkan konten yang Anda berikan.

Cara Menambahkan Palet Warna ke Situs Web Divi Anda

Dengan semua itu dalam pikiran, saatnya untuk menggali Divi dan menerapkan palet warna baru situs Anda!

Palet Divi Default

Pertama-tama, masuk ke dasbor WordPress Anda dan buka Divi – Opsi Tema . Di bawah tab General , Anda akan melihat entri berjudul Color Pickers Default Palette . Apa yang dilakukan adalah memungkinkan Anda untuk memilih 8 warna yang ingin Anda akses cepat setiap kali Anda membuka opsi warna di pembuat Divi. Secara default, ini adalah warna-warna cerah yang digunakan banyak orang, tetapi itu bukan palet lengkap yang harus digunakan di situs web mana pun.

palet warna secara default

Harap dicatat bahwa ini tidak berlaku untuk warna situs Anda sendiri. Itu hanya menyajikannya sebagai opsi cepat di pembangun.

Masuk ke Divi Builder

Apakah Anda mengatur palet di pengaturan Divi atau tidak, Anda masih memiliki opsi untuk menerapkan berbagai warna ke elemen di situs Anda. Untuk melakukannya, masuk ke Divi Builder dan masukkan pengaturan modul apa pun yang ingin Anda sesuaikan ke palet baru Anda.

pemilih warna

Di bawah warna yang dipilih saat ini untuk elemen apa pun, Anda akan melihat ikon elipsis (tiga titik) . Ketika Anda mengkliknya, Anda membuka alat Warna Ajaib Divi. Pembuatnya memperhitungkan warna yang Anda gunakan baru-baru ini dan warna pada halaman itu sendiri untuk memberi Anda serangkaian palet ganda yang terdiri dari warna gratis yang seharusnya bekerja sama dengan cukup baik.

Atur Warna sebagai Global

Setelah Anda memutuskan warna mana yang ingin Anda gunakan, saatnya untuk mengaturnya sebagai global. Warna global dapat diatur untuk berubah di seluruh halaman, terlepas dari modul atau elemen . Artinya, jika Anda ingin menukar 5 warna berbeda, Anda tidak perlu melakukannya lebih dari 100 kali, satu per satu pada contoh warna itu. Anda akan melakukannya 5 kali.

Untuk memulai, masuk ke modul apa pun dengan pemilih warna. Di bawahnya, Anda akan melihat tautan bernama Global . Klik, dan palet keseluruhan menghilang. Dari sini, Anda akan mengatur warna apa yang Anda inginkan tersedia secara global dengan mengklik ikon plus + .

global

Saat pemilih baru muncul, klik tanda centang hijau untuk menambahkan warna saat ini sebagai opsi global.

warna global

Tidak masalah di mana lingkaran putih itu berada. Nilai hex adalah apa yang ditambahkan ke warna global. Anda sekarang akan melihat warna default ditambahkan di samping ikon plus. Dan Anda dapat melihat warna telah diterapkan ke situs karena ikon bentuk tetesan pada warna, bukan lingkaran biasa.

tetesan berarti warna global

Selain itu, Anda dapat mengklik kanan pada warna yang dipilih dan memilih "Konversi ke Global" untuk menambahkannya ke daftar.

divi konversi global

Ulangi proses ini untuk setiap warna dalam palet pilihan Anda sehingga pada akhirnya seluruh palet Anda akan disimpan di bawah tautan Global. Ini sangat penting saat Anda bergerak menerapkan palet baru ke semua elemen di halaman.

Terapkan Warna Global

Selanjutnya, Anda ingin mengganti semua instance dengan warna yang sama di halaman Anda dapat disesuaikan secara global. Yang ingin Anda lakukan adalah masuk ke elemen dengan warna yang ingin Anda ubah dan klik kanan. Anda kemudian akan memilih Temukan dan Ganti dari menu konteks. Jangan mengubah warna ini menjadi global di sini . Itu adalah bagian dari langkah selanjutnya.

Temukan dan ganti

Layar berikutnya akan menjadi tempat Anda memilih untuk mengganti warna itu dengan warna global Anda. Pastikan bahwa di bawah Ganti Dengan Anda klik Global lalu pilih warna global yang ingin Anda luaskan di seluruh halaman. Pastikan untuk mencentang kotak yang mengatakan "Ganti semua nilai yang ditemukan dalam setiap jenis opsi, tidak terbatas pada [masukkan jenis elemen saat ini]." Ini akan memastikan bahwa apa pun yang terjadi, warna itu akan diganti.

temukan dan ganti dengan global

Sekarang, Anda dapat mengedit warna global tertentu dan ketika Anda melakukannya, setiap contoh akan berubah. Catatan, Anda tidak memilih warna baru dari palet. Itu hanya akan menukar warna saat ini. Anda mengedit warna untuk mengubahnya di semua tempat karena Anda telah menandai setiap contoh dari satu warna itu sebagai global.

memilih warna

Anda dapat mengeditnya sebagai kolektif menggunakan pemilih warna. Cukup klik pada tetesan untuk memilih yang baru.

mengedit warna

Setelah itu, hanya mengulangi proses itu untuk setiap warna di palet baru Anda. Hanya satu perubahan untuk setiap warna di palet Anda. Bukan pertukaran setiap elemen tertentu dari warna tertentu.

Membungkus

Memilih dan menerapkan palet warna global ke situs web Divi Anda tidak pernah semudah ini. Anda dapat menggunakan fitur Warna Ajaib kami untuk membantu Anda memilih palet, dan kemudian Anda dapat mengaturnya sebagai warna global untuk situs Anda. Setelah selesai, Anda tinggal memilih warna yang akan ditukar, dan menggunakan fitur temukan dan ganti bawaan Divi untuk mengganti warna tersebut di seluruh halaman. Dengan alur kerja ini, Anda pasti akan menghemat banyak waktu saat mendesain ulang berbagai situs web dan mengubah beberapa paket tata letak freebie kami.

Menikmati!

Gambar unggulan artikel oleh ART.ICON / shutterstock.com