Cara Membuat Child Theme agar Ubahan Aman Saat Update

Pernah mengubah warna tombol atau menambah kode di file tema, lalu semuanya hilang setelah tema diperbarui? Itu terjadi karena update tema menimpa seluruh berkas lama dengan versi baru dari pembuatnya. Cara aman menghindarinya adalah child theme.

Child theme adalah tema terpisah yang "menumpang" pada tema induk (parent theme). Semua fitur dan tampilan diambil dari induk, sedangkan ubahanmu disimpan di folder child. Saat tema induk diperbarui, folder child tidak disentuh, jadi ubahan tetap utuh.

Kapan kamu butuh child theme?

Child theme diperlukan bila kamu mengubah berkas tema: menambah CSS dalam jumlah banyak, mengganti file template, atau menambah fungsi PHP. Kalau ubahanmu hanya lewat pengaturan Customizer atau Site Editor, ubahan itu tersimpan di database dan tidak ikut tertimpa update, jadi child theme belum tentu perlu.

Langkah membuat child theme untuk tema klasik

Contoh di bawah memakai tema induk dengan folder namaInduk. Ganti dengan nama folder tema induk yang sebenarnya, yang bisa kamu lihat di wp-content/themes/.

1. Buat folder child

Lewat File Manager di cPanel atau FTP, buat folder baru di wp-content/themes/, misalnya namaInduk-child. Nama folder bebas, tapi akhiran -child memudahkan dikenali.

2. Buat file style.css

Ini satu-satunya file yang wajib. Isi bagian kepala minimal seperti ini:

/*
Theme Name: Nama Induk Child
Template: namaInduk
Version: 1.0
*/

Baris Template harus sama persis dengan nama folder tema induk, bukan nama tampilannya. Salah satu huruf saja, WordPress akan menganggap tema induk tidak ditemukan.

3. Buat file functions.php untuk memuat CSS

Banyak tema klasik hanya memuat stylesheet tema yang sedang aktif. Agar tampilan induk tetap muncul dan CSS child ikut dimuat, buat functions.php di folder child:

<?php
add_action( 'wp_enqueue_scripts', function () {
    wp_enqueue_style( 'induk-style', get_parent_theme_file_uri( 'style.css' ) );
    wp_enqueue_style( 'child-style', get_stylesheet_uri(), array( 'induk-style' ) );
} );

Dokumentasi WordPress mengingatkan bahwa cara tiap tema memuat CSS berbeda-beda. Kalau setelah aktif ternyata CSS induk termuat dua kali, hapus baris pertama dan sisakan baris untuk child saja.

4. Aktifkan

Buka Appearance > Themes di dasbor, lalu aktifkan child theme. Cek halaman depan, artikel, dan halaman toko (bila ada). Pengaturan Customizer kadang perlu disesuaikan ulang karena WordPress menyimpannya per tema.

5. Pindahkan ubahan

Salin CSS buatanmu ke style.css child. Untuk mengubah template, salin file dari induk (misalnya footer.php) ke folder child dengan nama dan posisi folder yang sama, lalu edit salinannya. WordPress akan memakai versi child.

Bagaimana dengan tema blok?

Tema blok (yang memakai Site Editor) bisa juga punya child theme, dengan file wajib yang sama: style.css berisi baris Template. Bedanya, gaya tampilan diatur lewat theme.json. File theme.json di child akan digabung dengan milik induk, sehingga kamu cukup menulis bagian yang ingin diubah, misalnya palet warna. Template HTML di folder templates atau parts milik child akan menggantikan file bernama sama dari induk.

Ingat juga bahwa ubahan yang kamu buat lewat Site Editor tersimpan di database dan menimpa isi theme.json maupun template. Kalau ubahan child tidak terlihat, cek apakah ada kustomisasi lama di Site Editor yang perlu di-reset.

Kalau tidak ingin membuat file manual, plugin Create Block Theme dari tim WordPress menyediakan opsi membuat child theme dari tema blok yang sedang aktif.

Kesalahan yang membuat situs error

• Menyalin seluruh functions.php induk ke child. Dokumentasi WordPress menjelaskan bahwa functions.php child tidak menggantikan milik induk, keduanya dimuat (child lebih dulu). Menyalin fungsi yang sama akan memicu error karena nama fungsi ganda.
• Salah isi baris Template. Tema child akan tampil "rusak" atau tidak bisa diaktifkan.
• Menghapus tema induk. Child theme butuh induknya tetap terpasang.
• Mengedit langsung di server produksi. Satu titik koma yang hilang di PHP bisa membuat layar putih kosong. Coba dulu di staging WordPress dan siapkan backup.

Satu kebiasaan kecil yang membantu: tulis catatan singkat di bagian atas style.css atau file terpisah tentang apa saja yang sudah kamu ubah dan alasannya. Beberapa bulan kemudian, kamu atau pengelola website berikutnya tidak perlu menebak-nebak kenapa ada file template tertentu di folder child.

Setelah child theme aktif, alur update rutin tetap sama seperti biasa. Panduan lengkapnya ada di cara update WordPress, tema, dan plugin tanpa error.

Checklist sebelum mengaktifkan child theme:

• Backup berkas dan database sudah ada.
• Baris Template sama persis dengan nama folder induk.
• functions.php child hanya berisi fungsi baru, bukan salinan induk.
• Tampilan sudah dicek di staging atau saat situs sepi.
• Tema induk tetap terpasang dan rutin diperbarui.