Apa Itu Child Theme WordPress dan Bagaimana Cara Membuatnya? Panduan Lengkap + Contoh

Posted on by OmPuter

Jika kamu pernah mengubah tampilan situs WordPress menggunakan theme (tema), kamu mungkin tahu bahwa memodifikasi langsung file tema utama bukanlah ide yang baik. Kenapa? Karena semua perubahanmu bisa hilang saat tema di-update. Nah, di sinilah child theme berperan penting.

Dalam artikel ini, kamu akan mempelajari:

  • Apa itu child theme di WordPress
  • Apa gunanya membuat child theme
  • Cara membuat child theme sendiri, langkah demi langkah
  • Contoh child theme sederhana

Apa Itu Child Theme?

Child theme adalah tema turunan dari parent theme (tema induk) di WordPress. Ia mewarisi semua fungsi, fitur, dan desain dari tema induknya, namun bisa dimodifikasi tanpa mengubah file asli dari tema utama.

Dengan child theme, kamu bisa:

  • Mengubah style (CSS), layout, dan fungsi
  • Menambahkan fitur khusus
  • Tetap aman saat tema utama diperbarui

Kenapa Harus Membuat Child Theme?

Beberapa alasan penting kenapa kamu sebaiknya menggunakan child theme:

  1. Aman dari Update
    Semua perubahan kamu ada di folder child, bukan di folder tema induk. Jadi, saat parent theme di-update, perubahanmu tetap utuh.
  2. Modifikasi Terstruktur
    Kamu bisa lebih mudah mengelola dan mengorganisasi perubahan, terutama jika proyek WordPress-mu berkembang.
  3. Belajar WordPress Development
    Child theme adalah tempat aman untuk belajar mengutak-atik WordPress tanpa merusak situs utama.

Cara Membuat Child Theme WordPress (Langkah demi Langkah)

✅ Persiapan

  • Punya akses ke direktori WordPress (via FTP atau File Manager)
  • Punya tema induk yang ingin dimodifikasi (misalnya: twentytwentyfour)

🔧 Langkah 1: Buat Folder Child Theme

Masuk ke direktori:

wp-content/themes/

Buat folder baru, misalnya:

twentytwentyfour-child

📝 Langkah 2: Buat File style.css

Di dalam folder twentytwentyfour-child, buat file style.css dengan isi seperti ini:

/*
Theme Name:     Twenty Twenty-Four Child
Theme URI:      https://example.com/twenty-twentyfour-child/
Description:    Child theme for the Twenty Twenty-Four theme
Author:         Nama Kamu
Author URI:     https://example.com
Template:       twentytwentyfour
Version:        1.0.0
*/

/* Tambahkan custom CSS di bawah ini */
body {
    background-color: #f4f4f4;
}

Catatan penting:
Bagian Template: harus sesuai dengan nama folder tema induk (case-sensitive).

🧠 Langkah 3: Buat File functions.php

Buat file baru bernama functions.php dan isi dengan kode berikut:

<?php
// Load style dari parent theme
add_action('wp_enqueue_scripts', function () {
    wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css');
});

Ini memastikan stylesheet tema induk tetap dimuat bersama dengan child theme.

✅ Langkah 4: Aktifkan Child Theme

  1. Masuk ke Dashboard WordPress
  2. Buka Appearance → Themes
  3. Cari Twenty Twenty-Four Child
  4. Klik Activate

Selesai! 🎉

Contoh Modifikasi Child Theme

Misalnya kamu ingin mengubah ukuran font judul utama:

Tambahkan di bawah CSS style.css:

h1 {
    font-size: 36px;
    color: darkblue;
}

Atau kamu bisa menambahkan file header.php di child theme untuk mengganti bagian header, cukup dengan meng-copy dari parent lalu modifikasi sesuai kebutuhan.

Kesimpulan

Child theme adalah solusi aman dan fleksibel untuk memodifikasi tema WordPress tanpa takut kehilangan perubahan saat tema diperbarui. Dengan membuat child theme sendiri, kamu punya kontrol penuh atas tampilan dan fungsi situsmu, tanpa mengorbankan kestabilan.

Kalau kamu merasa artikel ini membantu, jangan ragu untuk membagikannya atau menyimpan panduan ini untuk proyek WordPress-mu berikutnya. Selamat mencoba dan bereksperimen!

Post Views: 286