Ubah Warna Situs Menggunakan Gaya

Warna yang Anda pilih mewakili satu bagian besar dari desain situs Anda. Panduan ini akan menunjukkan cara mengelola palet warna situs Anda.

Dalam panduan ini

1. Ikhtisar Video
2. Temukan Pengaturan Warna
3. Menentukan Palet Warna
   1. Warna Tema
   2. Warna Kustom
4. Sesuaikan Warna-Warna Elemen

Ikhtisar Video

Temukan Pengaturan Warna

Untuk situs yang menggunakan tema yang mendukung editor situs, warna dari situs dapat diubah menggunakan Gaya. Cara cepat untuk mengetahui ada tidaknya editor situs dalam situs Anda adalah dengan membuka  Tampilan di dasbor Anda. Jika terdapat tampilan Editor di menu tersebut, warna situs dapat diganti dengan mengikuti langkah-langkah berikut:

1. Di dasbor situs, buka Tampilan → Editor.
2. Klik Gaya di sebelah kiri atau klik ikon Gaya yang ditunjukkan dalam gambar. Ikonnya tampak seperti lingkaran hitam-putih.
3. Pilih Warna.
4. Pilih Palet untuk memilih warna default situs atau dari elemen-elemen berikut di situs Anda:
   • Teks
   • Latar Belakang
   • Tautan
   • Keterangan
   • Tombol
   • Judul

Bagian selanjutnya hingga akhir dari panduan ini akan menjelaskan tiap bagian dengan lebih terperinci.

Menentukan Palet Warna

Palet warna situs mengatur warna default yang digunakan di seluruh situs Anda. Meski Anda bisa mengatur warna elemen tertentu, tentukanlah palet warna agar keseluruhan situs web Anda memiliki skema warna yang konsisten.

Di sini, Tema,Default, dan warna-warna Kustom bisa diedit:

• Tema: Warna yang ditetapkan oleh desainer tema Anda saat membuat sebuah tema yang digunakan di seluruh desain tema.
• Default: Warna yang ditampilkan di pengaturan warna blok saat mengedit halaman dan pos.
• Kustom: Tentukan dan namai warna-warna lain untuk digunakan dalam palet warna.

Warna Tema

Untuk memperbarui warna Tema, ikuti petunjuk di bawah ini:

1. Klik di mana saja di dalam kotak di bawah menuPalet.

2. Klik tiga titik di sebelah Tema, lalu pilih Tampilkan detail untuk memperluas daftar area warna dalam palet.
3. Tiap tema menentukan area warnanya sendiri. Misalnya, kita bisa memilih warna Primer, Sekunder, Latar Depan, Latar Belakang, atau Tersier untuk mengedit warna tersebut:

Langkah-langkah untuk memperbarui Tema dan warna-warna Default di bagian Gaya dari Editor Situs

4. Gunakan pemilih warna yang muncul untuk memilih warna yang diinginkan.
5. Klik Selesai untuk menyetel warna yang sudah dipilih.
6. Klik tombol Simpan di sudut kanan atas untuk menyimpan perubahan.

Warna Kustom

Anda juga dapat menambahkan beberapa warna Kustom ke palet situs. Pilihan-pilihan ini akan disimpan dan tersedia untuk dipilih dari pengaturan warna blok Anda.

Untuk menambahkan warna-warna kustom, ikuti langkah-langkah tambahan berikut:

1. Di bawah Kustom, klik tombol +.
2. Pilih warna dari pemilih warna (color picker) atau masukkan nilai warna HEX, RGB, atau HSL.
3. Klik nama warnanya (“Warna 1” akan muncul secara default) dan ketikkan nama untuk warna baru Anda.
4. Klik Selesai.

Langkah-langkah ini ditunjukkan dalam video berikut:

Sesuaikan Warna-Warna Elemen

Di pengaturan warna, tepat di bawah Palet, tersedia pilihan untuk mengedit warna dari berbagai elemen situs Anda. Elemen-elemen tersebut adalah:

• Teks: Pilih warna yang akan digunakan untuk teks dasar reguler di situs Anda, tidak termasuk tautan, keterangan, teks tombol, atau heading.
• Latar Belakang: Pilih warna solid atau gradien untuk latar belakang situs Anda. Baca selengkapnya di panduan kami untuk Menyesuaikan Latar Belakang Situs Anda.
• Tautan: Pilih warna untuk semua tautan di situs Anda. Di sini, warna Default yang ditampilkan untuk semua tautan dapat dipilih, serta warna Hover yang ditampilkan saat seseorang menempatkan kursor di atas tautan:

• Keterangan: Pilih warna teks yang digunakan dalam keterangan Blok Gambar.
• Tombol: Mengatur warna yang digunakan pada blok Tombol. Warna teks dapat dipilih, dan warna solid atau gradien untuk latar belakang tombol dapat diatur.
  • Saat ini, kontrol warna tombol hover tidak tersedia. Anda dapat menggunakan kode CSS untuk menerapkan warna hover ke sebuah tombol.
• Heading: Tetapkan warna untuk blok Heading di seluruh situs. Warna teks dapat dipilih, dan warna solid atau gradien untuk latar belakang heading dapat diatur.
  • Untuk memilih warna yang berbeda untuk tiap tingkat heading (H1 hingga H6), klik tiga titik di sebelah Warna untuk memperluas pilihan dan klik ketinggian heading yang diinginkan. Tanda centang akan muncul di sebelah tinggi heading, dan Anda dapat menutup pilihan untuk mengakses pengaturan warna untuk tinggi heading tersebut.

Jika ingin mengganti warna untuk satu teks tertentu saja (alih-alih semua elemen), warna yang berbeda dapat diubah di dalam pengaturan warna blok tunggal di pos atau halaman tertentu.