Cascading Style Sheet atau biasa dikenal Custom CSS merupakan salah satu fitur yang tersedia di theme wordpress, yang berfungsi sebagai alat modifikasi atau mengedit tampilan css, juga tata letak atau layout css, dari theme yang tengah kita gunakan. Custom CSS juga biasa disebut Additional CSS atau code css tambahan khusus yang bisa digunakan untuk menyisipkan baris kode css, maupun edit tampilan tanpa perlu kita mengeditnya lewat theme editor pada style.css.
Jadi, untuk pengeditan minor atau kecil-kecilan layaknya mengganti margin, ukuran, warna, gaya font, dan lain sebagainya, Bizzie dapat menggunakan fitur ini. Pada artikel kali ini, akan mencoba cara edit css wordpress menggunakan 2 cara berikut ini. Simak terus artikelnya sampai habis, ya!
Cara Edit CSS WordPress dengan Customizer
Berdasarkan dokumentasi codex.wordpress.org mengenai css, sejak Wordrpess versi 4.7, Bizzie dapat menambahkan, membuat code custom css, ataupun menerapkan cara edit css wordpress sendiri pada bagian theme customizer.
Pada Additional CSS, di sini Bizzie dapat memasukan baris code css sendiri, setelah itu Bizzie juga dapat melihat hasil tampilannya secara langsung. Sebagai contoh, di sini kami mengedit header dari theme ini menggunakan selector header .site-header .menu.text, untuk menebalkan font .font-weight:bold, kemudian membuat semua huruf kapital .text-transform:uppercase. Untuk bisa lebih mempelajari cara edit css wordpress, Bizzie bisa kunjungi w3schools.com.
Cara Edit CSS WordPress dengan Memasang Plugin
Apabila Bizzie tidak ingin menggunakan fitur custom css bawaan yang tersedia di theme, tentu saja Bizzie bisa juga menggunakan cara kedua, yakni dengan menginstall plugin yang bernama Simple Custom CSS dan JSS. Simak cara edit css wordpress yang kedua berikut ini:
- Pertama, kunjungi halaman dashboard admin WordPress.
- Kemudian, Bizzie langsung saja kalian bisa pilih menu Plugins > pilih Add New.
- Lalu Bizzie bisa mencari plugin tersebut, dengan mengetikan kata kunci “simple custom css”.
- Jika sudah ditemukan, Bizzie langsung pilih tombol Install Now dan Active.
- Selanjutnya, pada halaman menu admin, Bizzie klik menu Custom CSS & JS > Add Custom CSS.
- Terakhir, pada bagian Add CSS Code, Bizzie dapat membuat file css sendiri, memberi nama file css, serta mengatur permalink. Jika sudah, Bizzie bisa tekan tombol Publish. cara edit css wordpress dengan memasang plugin selesai.
Keunggulan dari menggunakan plugin ini Bizzie bisa mengelola banyak file custom code css dan javscript yang tersedia di menu All Custom Code. Namun sayangnya, Bizzie tidak bisa melihat previewnya secara langsung, jika Bizzie menggunakan versi gratis. Jadi, Bizzie harus mengupgrade ke versi pronya untuk melihat live preview-nya.
Selain kedua cara edit css wordpress di atas, Bizzie juga bisa mencoba 3 metode yang lebih spesifik berikut ini. Namun, sebelum Bizzie melanjutkan, pastikan untuk membuat cadangan file tema Bizzie. Juga, perlu diingat bahwa setiap perubahan yang Bizzie buat pada file tema Bizzie, akan hilang jika Bizzie memutuskan untuk memperbarui tema di masa mendatang.
Metode pertama: Edit CSS Menggunakan Editor Tema WordPress
Cara edit css wordpress termudah adalah dengan menggunakan editor tema.
- Login ke dashboard WordPress Bizzie dan pergi ke Appearance >> Theme Editor.
- Dari sini, Bizzie dapat menemukan stylesheet CSS untuk tema Bizzie saat ini.
- Klik pada file Style.CSS lalu Bizzie dapat menggunakan editor untuk menambahkan atau mengedit kode CSS. Jika sudah melakukan perubahan, ingatlah untuk mengklik tombol Perbarui File untuk menyimpan perubahan yang sudah dibuat.
Metode kedua: Edit CSS Dari CPanel atau FTP
- Di cara edit css wordpress kedua ini, Bizzie juga dapat mengedit stylesheet tema dengan langsung mengedit file CSS di server. Ini dapat dilakukan dengan masuk ke server Bizzie melalui CPanel atau dengan menggunakan klien FTP. Ketika menggunakan CPanel, Bizzie cukup gunakan File Manager kemudian cari folder Public_HTML. Di sinilah file situs web Bizzie disimpan.
- Setelah itu, silahkan Bizzie arahkan ke folder WP-Content >> Themes. Temukan folder untuk tema Bizzie saat ini. Di dalam folder, Bizzie akan menemukan file Style.CSS.
- Berikutnya, Bizzie klik kanan pada file CSS dan pilih Edit untuk mulai menyesuaikan stylesheet.
- Prosesnya sama saat menggunakan klien FTP. Kecuali Bizzie akan menggunakan rincian login FTP Bizzie untuk mengakses server. Bizzie akan menemukan detail ini di email pendaftaran hosting web Bizzie. Atau, Bizzie juga bisa menghubungi penyedia hosting web dan minta detail login agar cara edit css wordpress ini bisa segera berhasil.
Metode ketiga: Tambahkan Kode CSS Khusus di Penyesuai Tema
- Untuk cara edit css wordpress yang ketiga ini, Jika Bizzie ingin menambahkan kode CSS khusus ke lembar gaya tema Bizzie tanpa harus mengedit file tema inti, Bizzie hanya cukup menggunakan Penyesuai Tema.
- Kemudian, pergi ke Penampilan >> Sesuaikan. Berikutnya silahkan cari opsi dengan nama yang mirip dengan CSS Custom atau CSS Tambahan.
Dari bagian ini, Bizzie dapat dengan mudah menambahkan kode CSS khusus dan bahkan mendapatkan pratinjau langsung dari perubahan yang Bizzie buat.
Sekali lagi, kami menyarankan Bizzie untuk membuat cadangan file situs web Bizzie sebelum membuat perubahan atau mengedit file tema. Selain itu, Bizzie dapat merujuk ke dokumentasi tema atau menghubungi pengembang tema apabila Bizzie mengalami kesulitan dalam menggunakan cara edit css wordpress di atas.
Atau, ada baiknya jika Bizzie pertimbangkan untuk beralih ke tema yang lebih baik. Bizzie dapat mencari berbagai kumpulan tema premium yang dapat Bizzie unduh dengan harga satu. Demikian beberapa cara edit css wordpress yang cukup mudah dilakukan. Semoga bermanfaat!
