5+ Cara Edit (Custom) CSS di WordPress (WP) dengan Mudah

Custom CSS (Cascading Style Sheet) adalah salah satu fitur yang tersedia di theme wordpress, yang fungsinya untuk memodifikasi atau mengedit tampilan css, dan juga tata letak atau layout css, dari theme yang sedang kita gunakan.

Custom CSS disini juga bisa disebut Additional CSS, atau code css tambahan khusus , yang dimana kita bisa menyisipkan baris kode css ,untuk edit tampilan , tanpa perlu kita mengeditnya lewat theme editor pada style.css.

Jadi untuk pengeditan minor atau kecil-kecilan , seperti ganti margin , ukuran ,warna ,gaya font , dan lainnya kita bisa gunakan fitur ini.

Pada artikel tentang wordpress kali ini , teknoding akan mencoba menambahkan custom css, pada website wordpress , dengan menggunakan 2 cara. Selengkapnya, berikut mari kita simak lebih lanjut :

Cara Menambahkan Custom CSS di WordPress

1. Edit CSS dengan Customizer

Berdasarkan dokumentasi codex.wordpress.org tentang css , sejak Wordrpess versi 4.7 , kalian dapat menambahkan, dan membuat code custom css sendiri , pada bagian theme customizer.

1. Pergi ke halaman dashboard admin WordPress.
2. Pilih menu Appearance > lalu Customize.
   
3. Selanjutnya pada Customize, kalian pilih Additional CSS.
   
   
4. Pada Additional CSS ,disini kalian bisa memasukan baris code css sendiri , setelah itu kalian bisa melihat hasil tampilannya secara langsung.
5. Sebagai contoh ,disini saya mengedit header dari theme ini , menggunakan selector header .site-header .menu.text , untuk menebalkan font .font-weight:bold, lalu membuat semua huruf kapital .text-transform:uppercase.
6. Untuk belajar css kalian bisa kunjungi w3schools.com.

2. Edit CSS dengan Memasang Plugin

Jika kalian tidak ingin menggunakan fitur custom css bawaan, yang tersedia di theme , kalian bisa juga menggunakan cara kedua, yaitu dengan menginstall plugin yang bernama Simple Custom CSS dan JSS.

1. Pergi ke halaman dashboard admin WordPress.
2. Langsung saja kalian bisa pilih menu Plugins > pilih Add New.
   
3. Lalu kalian bisa mencari plugin tersebut , dengan mengetikan kata kunci “simple custom css”.
   
4. Jika sudah ketemu, kalian langsung pilih tombol Install Now ,dan Active.
5. Selanjutnya pada halaman menu admin, pilih menu Custom CSS & JS > Add Custom CSS.
6. Pada bagian Add CSS Code , disini kita bisa membuat file css sendiri , kita bisa memberi nama file css , mengatur permalink. Jika sudah kalian bisa tekan tombol Publish.

Kelebihan menggunakan plugin ini , pastinya kita bisa mengelola banyak file custom code css ,javscript, yang tersedia di menu All Custom Code.

Namun , sayangnya kita tidak bisa melihat previewnya secara langsung , jika kita menggunakan versi gratis. Jadi kita harus mengupgrade ke versi pronya, untuk melihat live previewnya.

✅Biar Gak Kudet alias Kurang Update, Mending langganan GRATIS channel Telegram Teknoding.com di sini, dan dapetin ilmu gratis setiap harinya, atau bisa ikuti kami di Google News.