Kamu baru saja merapikan tampilan tema, mengubah warna tombol, dan menambah sedikit CSS. Beberapa minggu kemudian muncul notifikasi update tema. Setelah diklik, semua perubahan tadi hilang karena file tema induk ditimpa versi baru. Child theme mencegah kejadian ini. Dengan menyimpan modifikasi di folder sendiri, kamu bisa memperbarui tema induk tanpa kehilangan apa pun.
Apa yang Sebenarnya Dilakukan Child Theme
Child theme adalah tema terpisah yang memakai seluruh kode dari tema induk, lalu menambahkan atau menimpa bagian tertentu. WordPress memuat file child theme lebih dulu. Kalau di folder child tidak ada file yang dibutuhkan, WordPress mengambil versi dari tema induk.
Karena mekanisme ini, child theme hanya perlu berisi file yang benar-benar kamu ubah. Untuk sekadar mengganti warna, satu file style.css sudah cukup. File PHP baru perlu disalin kalau kamu ingin mengubah struktur halaman tertentu seperti header atau footer.
Child theme tidak mempercepat atau memperlambat situs secara otomatis. Fungsinya menjaga modifikasi tetap aman saat tema induk diperbarui.
Menyiapkan Folder dan File Wajib
Mulai dari folder tema yang sedang aktif. Buka direktori /wp-content/themes/ lewat file manager hosting atau FTP. Kalau belum terbiasa dengan struktur folder ini, panduan dasar mengelola file di WordPress menjelaskan cara mengaksesnya dengan aman.
Buat folder baru di dalam themes, misalnya namatema-child. Jangan pakai spasi, cukup huruf kecil dan tanda hubung. Nama folder sebaiknya mengikuti nama tema induk agar mudah dikenali.
Di dalam folder tersebut, buat file style.css dengan teks berikut:
/*
Theme Name: Nama Tema Child
Template: namatema-induk
Version: 1.0
*/
Baris Template wajib sama persis dengan nama folder tema induk, bukan judul tampilannya. Kalau salah, WordPress akan menandai tema sebagai rusak. Untuk nama teknis tema induk, cek di menu Appearance, Themes, lalu lihat detail tema.
Mengaktifkan Child Theme
- Buka dashboard WordPress dan masuk ke Appearance, lalu Themes.
- Tema child baru akan muncul di daftar dengan label sesuai isi
Theme Name. - Klik Activate. Tampilan situs akan sama seperti sebelumnya karena tema induk masih dipakai di baliknya.
Setelah aktif, cek beberapa halaman untuk memastikan tidak ada elemen yang hilang. Kalau muncul error atau halaman putih, kemungkinan nilai Template tidak cocok dengan nama folder tema induk.
Cara Menambahkan CSS untuk Mengubah Tampilan
Saat kamu mengaktifkan child theme, WordPress tidak otomatis memuat style.css milik child. Stylesheet baru akan dimuat kalau tema induk mendaftarkannya sendiri, atau kalau kamu menambahkan fungsi enqueue.
Buat file functions.php di folder child, lalu isi dengan kode:
<?php
add_action( 'wp_enqueue_scripts', function() {
wp_enqueue_style(
'namatema-child',
get_stylesheet_directory_uri() . '/style.css',
array( 'namatema-induk-style' ),
'1.0'
);
} );
Nilai namatema-induk-style adalah handle stylesheet tema induk. Kalau handle-nya berbeda, gaya child tetap termuat, hanya urutan pemuatannya bisa tidak sesuai sehingga aturan CSS-mu kalah prioritas. Cara paling aman, buka stylesheet induk dan cari baris wp_enqueue_style.
Setelah itu, tambahkan aturan CSS di bawah komentar header style.css. Semua aturan di file ini dimuat setelah tema induk, jadi selector dengan spesifisitas sama akan menang.
Menimpa File Template Tanpa Merusak Tema Induk
Kalau perlu mengubah markup, salin file PHP dari tema induk ke folder child pada lokasi folder yang sama. Misalnya, tema induk menyimpan header.php di akar folder. Salin file itu ke akar folder child, lalu edit versi salinannya.
Aturan folder ini berlaku juga untuk subfolder seperti template-parts. Kesalahan penempatan membuat WordPress menganggap file tersebut tidak ada, sehingga situs kembali memakai versi induk tanpa kamu sadari.
Kapan Child Theme Sebaiknya Dipakai dan Kapan Tidak
Pakai child theme ketika kamu menyunting CSS atau template secara manual. Ini kondisi paling umum, termasuk saat menyesuaikan situs yang sudah berjalan lama dengan panduan membuat website WordPress pertama sebagai titik awal.
Kamu tidak perlu child theme kalau semua perubahan dilakukan lewat Customizer, editor situs blok, atau plugin. Perubahan jenis itu tersimpan di database, bukan di file tema, sehingga tidak terhapus saat update. Untuk tema blok modern yang hanya diubah lewat Site Editor, child theme juga jarang diperlukan.
Child theme mewarisi apa pun yang ada di tema induk. Kalau tema induknya diganti seluruhnya, child theme ikut tidak berfungsi. Sebelum mengubah tema, jalankan backup manual WordPress agar file child theme dan pengaturan lain bisa dipulihkan.
Melanjutkan dengan Kustomisasi yang Lebih Dalam
Setelah child theme aktif, kamu bisa menambah fungsi sendiri di functions.php, seperti mendaftarkan ukuran gambar atau menonaktifkan elemen tertentu dari tema induk. Simpan perubahan di file child, bukan di file induk, setiap kali ada opsi yang memungkinkan.
Kalau nanti kamu mengembangkan aplikasi pendamping untuk situs, misalnya menyimpan data formulir dari aplikasi seluler, pola pemisahan kode seperti ini juga muncul di platform lain. Contohnya saat memilih antara menyimpan data formulir iOS dengan UserDefaults, file, atau SwiftData. Prinsipnya sama: pisahkan bagian yang sering berubah dari bagian yang stabil.
Untuk pengembangan sisi server, kamu mungkin juga berurusan dengan penanganan error yang rapi. Ada pembahasan soal kapan memakai checked dan unchecked exception di Java yang relevan kalau kamu menulis layanan backend untuk situs.
Ringkasan
Child theme dibuat dengan tiga langkah inti: siapkan folder di wp-content/themes, isi style.css dengan header dan nilai Template yang benar, lalu aktifkan dari dashboard. Tambahkan functions.php untuk memuat stylesheet, dan salin file template hanya saat perlu mengubah markup. Dengan begitu, update tema induk berjalan tanpa menghapus pekerjaanmu.
Pertanyaan yang Sering Diajukan
Apakah child theme memperlambat situs WordPress?
Dampaknya kecil. WordPress hanya membaca satu file tambahan untuk CSS dan file PHP yang benar-benar kamu salin. Beban bertambah kalau kamu menyalin banyak file template yang sebenarnya tidak diubah.
Apakah pengaturan Customizer hilang setelah pindah ke child theme?
Sebagian bisa hilang karena pengaturan tersimpan per tema aktif. Catat atau ekspor pengaturan sebelum berpindah, lalu atur ulang di child theme. Perubahan CSS manual tetap perlu dipindahkan ke style.css child.
Bagaimana cara memperbarui child theme?
Child theme tidak punya update otomatis dari repositori. Kamu memperbaruinya sendiri dengan mengedit file di folder child, atau mengunggah ulang versi terbaru lewat FTP. Naikkan nilai Version di header agar browser memuat CSS terbaru.
