Cara Edit WordPress Theme dengan WordPress Theme Editor

Pernahkah Anda menemukan tema yang dirasa sangat cocok untuk website Anda, tapi ada beberapa hal yang ingin diubah agar tampilannya terlihat lebih sesuai? Jika demikian, bagaimana caranya?

Nah, dalam artikel ini, kami akan menjelaskan cara edit tema WordPress tanpa perlu repot menggunakan WordPress theme editor.

Cara Mengakses WordPress Theme Editor

WordPress theme editor adalah editor teks sederhana di dashboard WordPress. Dengan tool ini, Anda bisa menyesuaikan file tema, baik untuk menambahkan sidebar, mengaturnya agar menjadi responsive, atau memasukkan video khusus di header.

Untuk mengakses WordPress theme editor, klik Appearance Editor. Tampilannya akan terlihat seperti ini:

Tampilan cara edit tema WordPress dengan theme editor

Di sebelah kanan, Anda bisa melihat daftar file yang bisa diedit, atau yang disebut dengan template file. Anda bisa memilih tema lain yang ingin diubah dengan mengeklik menu drop-down di bagian kanan atas.

Menu drop-down theme editor untuk cara edit tema WordPress

Memilih tema lain di editor tidak akan langsung mengaktifkannya. Anda hanya mendapatkan akses untuk mengedit tema tersebut, dan tema yang saat ini sedang digunakan tidak akan terpengaruh.

Jika ingin mengganti tema dan bukan memodifikasi tema yang sedang digunakan, buka Appearance Theme.

Semua file tema ditulis dalam format PHP, CSS, JS, dan JSON. Pastikan Anda tidak salah memahaminya sebagai HTML.

Tema WordPress akan membuat halaman HTML. Di saat bersamaan, WordPress menyimpan data yang ditampilkan di halaman Anda ke dalam database. WordPress kemudian menggunakan PHP untuk menghubungkan HTML dan database tersebut. Jadi, mengedit kodenya akan memungkinkan Anda mengubah tema yang dipilih.

Dalam cara edit tema WordPress ini, Anda harus memilih file yang tepat. Jika ingin memodifikasi header, misalnya, pilih file header.php. Begitu pula jika ingin mengelola kolom komentar, Anda harus menggunakan file comments.php. Untuk mengubah gaya website, pilih stylesheet.css.

Sebelum memulai cara edit tema WordPress menggunakan WordPress theme editor, buat child theme terlebih dahulu. Child theme WordPress adalah ‘duplikat’ yang memiliki gaya dan fitur yang sama persis dengan parent theme.

Dengan mengedit child theme, Anda bisa menerapkan berbagai perubahan yang diinginkan tanpa takut merusak file asli. Jika terjadi sesuatu, Anda juga bisa mengembalikannya ke pengaturan default dengan mudah cukup dengan berganti ke parent theme.

Selalu ingat untuk lakukan backup saat mengubah kode tema. Lihat cara backup WordPress dalam panduan kami.

Cara Edit WordPress Theme dengan Metode Lain

Selain theme editor, ada juga cara lain untuk mengedit tampilan website WordPress Anda.

Menggunakan Page Builder

Beberapa tema WordPress kompatibel dengan sejumlah page builder, seperti ElementorDivi, dan Beaver Builder. Sebagian besar kreator juga memungkinkan fungsionalitas drag-and-drop sehingga Anda bisa menyesuaikan tema tanpa coding manual.

Untuk cara ini, cukup instal page builder yang kompatibel dengan tema Anda lalu gunakan opsi yang disediakan untuk mulai memodifikasi desain halaman.

Meskipun page builder cukup fleksibel, Anda tetap harus mempertimbangkan beberapa faktor yang menjadi kekurangannya. 

WordPress builder mengubah layout menjadi shortcode khusus untuk plugin. Artinya, saat Anda menonaktifkan plugin page builder, kode tersebut pun tidak akan berfungsi, dan desain akan rusak. 

Selain itu, shortcode juga bisa memengaruhi waktu loading halaman website menjadi lebih lama.

Mengedit File Tema

Cara edit tema WordPress lainnya adalah dengan mengeditnya langsung dari file. Untuk melakukannya, buka dashboard hPanel Anda dan klik Pengelola File.

File Manager
  1. Temukan folder public_html.
    Folder Public HTML
  2. Klik folder dengan nama wp_content -> themes.
    Folder Tema hPanel
  3. Folder ini berisi semua tema yang sudah Anda unduh untuk situs WordPress Anda. Klik dua kali file tema yang sedang digunakan dan akan Anda edit.
    File Archive PHP
  4. Kemudian, pilih file tema, dan klik ikon Edit pada kolom menu.
  5. Editor teks akan terbuka, tempat Anda dapat mengubah coding sesuai kebutuhan. Setelah itu, klik tombol Simpan, dan tampilan website Anda pun akan diperbarui.
    Konten File Archive PHP

Daftar file tema mungkin akan berbeda-beda tergantung pada tema yang digunakan. Namun, setiap tema WordPress pasti akan menyertakan file-file penting berikut:

  • Stylesheet (style.css)– fitur desain, termasuk font, warna, dan layout.
  • Functions.php – fitur dan fungsionalitas tema, seperti widget dan logo kustom.
  • File template – kombinasi kode HTML, tag template, dan PHP yang menyusun konten website Anda.

Memanfaatkan Plugin WordPress

Apabila hanya perlu fungsi dasar untuk website Anda, cukup instal plugin tambahan. Ada ribuan opsi di direktori plugin WordPress, mulai dari plugin eCommerce dan keamanan hingga integrasi media sosial dan SEO.

Untuk menginstal plugin yang tepat, Anda harus memperhatikan tanggal pembaruan terakhir plugin, rating dari pengguna, dan kompatibilitasnya dengan versi WordPress terbaru.

Selain itu, apabila Anda hanya ingin mengedit gaya dan desain tema, gunakan plugin seperti CSS Hero. Plugin ini akan menyalin stylesheet dan menimpa yang asli. Jadi, Anda bisa memodifikasi desain dan gaya website tanpa harus mengubah apa pun pada file asli tema. 

Menginstal Child Theme

Child theme berfungsi sebagai sub-tema yang sangat mirip dengan tema utama. Namun, child theme tidak menyertakan fitur dan fungsi tema utama sehingga user bisa mengubah tema tanpa merusak fungsionalitas inti tema utama. 

Tema ini juga bisa menyimpan semua yang sudah Anda edit agar tidak hilang ketika tema utamanya diperbarui.

Pada child theme, terdapat file style.css dan functions.php sendiri yang tersimpan di direktori yang berbeda dari tema utama. Di sana, Anda bisa menambahkan file baru dan mengubah gaya, parameter layout, coding, dan skrip.

Ada beberapa cara untuk membuat child theme di WordPress. Langkah-langkahnya umumnya mencakup membuat child theme melalui File Manager hingga menginstal plugin, misalnya seperti Child Theme Generator.

Tips Saat Memulai Cara Edit WordPress Theme

Meskipun Anda bisa melakukan perubahan menyeluruh dengan theme editor, risiko yang mungkin ditimbulkannya juga bisa cukup parah, misalnya website Anda menjadi down atau kehilangan bagian kode penting. 

Tapi jangan khawatir, karena kami sudah menyiapkan beberapa tips keamanan yang harus Anda ikuti sebelum mulai mengedit tema WordPress.

Selalu Buat File Cadangan/Backup

Langkah ini penting apabila Anda melakukan perubahan yang cukup signifikan. Apabila terjadi eror, Anda pun tidak perlu mengulang semuanya dari awal. Cukup unduh file backup Anda, dan website pun akan kembali online.

Namun, terkadang Anda tidak perlu file backup yang menyeluruh. Cukup simpan file stylesheet.css tema. Jika terjadi eror, Anda pun bisa menghapus file dan mengunggah file dari cadangan.

Menyiapkan Server Testing Lokal

Saat mengubah tema WordPress, sebaiknya lakukan di server lokal terlebih dahulu. Dengan demikian, Anda pun bisa melihat preview semua perubahan yang Anda lakukan sebelum menerapkannya ke website secara online.

Untuk melakukannya, Anda perlu menginstal WordPress secara lokal menggunakan MAMP atau WampServer. Kemudian, Anda bisa mengakses staging environment

Di lingkungan ini, Anda bisa menguji coba perubahan tema dan mengecek konten website, seperti halaman atau postingan. Jika dirasa sudah sesuai keinginan, unggah file ke live website Anda.

Gunakan Version Control

Dengan demikian, Anda bisa memantau dan membatalkan perubahan yang dilakukan pada website. Cara ini juga memungkinkan Anda me-restore versi sebelumnya dan menghemat waktu.

Kontrol versi sangat berguna jika Anda bekerja dalam tim, karena tool ini juga akan sangat membantu dalam sistem kerja yang kolaboratif. 

Ada beberapa solusi yang bisa Anda gunakan untuk version control WordPress, mulai dari repositori Git, seperti GitHub dan GitLab, hingga menginstal plugin, seperti WP RollbackVersionPress, dan Revisr.

Kesimpulan

Sebagai platform CMS yang fleksibel, WordPress menyediakan banyak sekali opsi kustomisasi kepada penggunanya, termasuk WordPress theme code editor. Dengan tool ini, Anda bisa mengakses source code tema dengan mudah dan melakukan penyesuaian pada desain website. Anda pun tidak hanya bisa menginstal theme WordPress, tapi juga bisa mengeditnya.

Namun, sebaiknya hanya gunakan theme editor teks jika Anda sudah paham coding, karena sedikit kesalahan pun bisa membuat website menjadi down, atau menghapus semua kustomisasi yang sudah dilakukan. Atau, Anda juga bisa menggunakan metode lain yang risikonya lebih rendah, seperti menggunakan plugin sesuai kebutuhan dan membuat child theme.

Bagaimanapun, selalu perhatikan tips keamanan yang sudah kami sebutkan di atas untuk mendapatkan hasil terbaik. Semoga berhasil!