Panduan Utama untuk Tema Anak WordPress

Pernahkah Anda menemukan tema WordPress yang hampir sempurna untuk situs web Anda tetapi memutuskan untuk tidak menggunakannya karena elemen desain kecil yang menegangkan yang tidak dapat Anda abaikan? Ini gaya font, palet warna, atau penempatan elemen desain, mungkin?

Pasar tema WordPress dipenuhi dengan begitu banyak tema hebat, baik gratis maupun premium, tetapi karena tidak mempekerjakan pengembang untuk membuat tema yang disesuaikan untuk situs Anda, kecil kemungkinan Anda akan menemukan yang sempurna hingga piksel terakhir.

Tema anak WordPress memungkinkan webmaster untuk memodifikasi file tema sambil mempertahankan fungsionalitas intinya tanpa risiko kehilangan modifikasi setiap kali tema diperbarui. Mereka memberi Anda kekuatan untuk mengubah tampilan tema dari sesuatu yang kecil seperti ajakan bertindak tombol hingga sepenuhnya mengubah setiap elemen desain.

Artikel ini akan membahas semua yang perlu Anda ketahui tentang tema anak, mulai dari apa itu hingga mengapa begitu penting. Kami akan mengakhiri dengan tutorial tentang penggunaan tema anak di situs WordPress Anda – dengan cara yang benar.

Kedengarannya bagus? Mari kita mulai!

Tema Anak WordPress: Dasar-dasar

Tema anak adalah tema terpisah yang secara aktif mewarisi fungsionalitas dari tema induknya. Fungsionalitas tema anak menggantikan makna tema induk yang berarti fungsionalitas tema anak akan diterapkan ke situs web Anda. Setelah Anda mengaktifkan tema anak, WordPress akan memeriksa apakah tema tersebut memiliki fungsi tertentu. Namun, jika fungsinya tidak ada, itu akan melihat ke file induk dan pergi dengan yang dikodekan di sana.

Dalam bahasa Inggris sederhana, tema anak adalah file tema duplikat dan setiap kali Anda merasa perlu untuk mengubah aspek desain atau beberapa fungsi, Anda mengeditnya ke dalam file tema anak. Ini adalah fitur hebat karena memungkinkan webmaster untuk membuat perubahan pada tema tanpa rasa takut berlama-lama mengacaukan file asli.

Sebagian besar tema WordPress saat ini hadir dengan tema anak (atau variasi tema anak mereka) langsung dari kotak.

Mengapa Anda Harus Menggunakan Tema Anak?

Membuat modifikasi dan perubahan pada tema Anda melalui tema anak adalah praktik terbaik yang diterima secara luas (dan direkomendasikan). Pikirkan seperti ini: jika Anda gagal untuk pertama kalinya, Anda selalu dapat mencoba lagi. Selain manfaat yang menonjol ini, tema anak penting untuk pemeliharaan dan pengembangan situs WordPress Anda.

Hilangkan Risiko Kehilangan Modifikasi

Membuat perubahan pada tema induk Anda (file tema asli) berarti perubahan tersebut akan hilang saat Anda memperbarui tema. Ini membuat Anda dalam keadaan buntu; jika Anda memperbarui tema, Anda kehilangan semua modifikasi tetapi jika Anda tidak memperbarui tema, Anda akan memiliki bug yang berada di situs Anda yang dapat memengaruhinya secara negatif.

Anda dapat menyalin-menempelkan kode yang terkait dengan modifikasi ke tema induk Anda setelah selesai diperbarui. Meskipun itu sangat mungkin, mengapa menghabiskan waktu mencari modifikasi yang Anda buat dan menyalin-tempelnya ke file tema yang diperbarui setiap kali Anda memperbarui tema? Ini adalah proses yang mudah namun bisa salah.

Di sinilah pentingnya tema anak pertama kali disadari. Dengan menggunakan tema anak, Anda dapat mempertahankan semua modifikasi dan memperbarui tema situs Anda dengan aman.

Pertahankan Organisasi Kode

Tema WordPress biasanya terdiri dari beberapa ribu baris kode dan beberapa file berbeda – HTML, CSS, PHP, JavaScript, dan banyak lagi. Dan karena itu, setiap perubahan kecil yang dibuat di sana-sini menjadi sulit untuk dilacak. Ketika saatnya tiba untuk kembali dan mengedit tema atau memperbaiki bug yang tidak terduga, itu akan terbukti cukup mahal (baik dari segi waktu dan anggaran).

Seperti dibahas di atas, tema anak secara aktif diwarisi dari tema induk. Setiap perubahan yang Anda buat pada tema anak tetap ada (apa yang terjadi pada tema anak tetap di tema anak!) dan lebih mudah dilacak karena hanya memiliki beberapa ratus baris kode (dalam keadaan paling agresif) dibandingkan dengan beberapa ribu.

Seperti yang kemungkinan besar Anda ketahui sekarang, tidak ada kerugian menggunakan tema anak. Sebenarnya, mereka melindungi situs Anda dari bug yang tidak disengaja.

Cara Membuat Tema Anak di WordPress

Sebagian besar tema datang dengan tema anak, tetapi jika Anda menemukan satu yang tidak sesuai dengan keinginan Anda, membuat tema anak sendiri tidaklah sulit. Saya akan mendemonstrasikan tutorial dengan membuat tema anak untuk tema Sparkling kami.

Langkah 1: Buat direktori untuk tema anak di instalasi WordPress Anda.

1. Arahkan ke direktori tema situs WordPress Anda ( /wp-content/themes ).
2. Buat folder baru dan beri nama sparkling-child . Ini adalah praktik terbaik untuk memberi tema anak Anda nama yang sama dengan orang tua dengan -anak ditambahkan di akhir.

Kami akan menambahkan semua file tema anak ke folder ini. Karena itu, satu-satunya file yang dibutuhkan tema anak untuk berfungsi dengan baik adalah file style.css .

Langkah 2: Buat file style.css untuk tema anak baru Anda.

1. Arahkan ke direktori tema anak yang dibuat pada Langkah 1 yaitu /wp-content/themes/sparkling-child .
2. Buat file .css baru di direktori dan beri nama style.css .
3. Salin dan tempel kode berikut ke dalam file style.css baru:

Dalam kode yang diberikan di atas, baris terpenting adalah yang dimulai dengan Nama Tema , Templat , dan @import . Anda harus mengisi baris ini dengan benar jika Anda membuat tema anak untuk tema induk lainnya. Baris @import memastikan Anda tidak perlu menulis ulang aturan CSS tema induk dari awal. Tanpa baris @import , situs baru hanya akan memuat konten ke dalamnya, tanpa gaya.

Jika tema induk Anda memiliki beberapa lembar gaya, lewati langkah ini. Kami akan menunjukkan cara mengimpor beberapa lembar gaya menggunakan fungsi WordPress asli dalam langkah-langkah berikut.

Langkah 3: Buat file functions.php (opsional).

File functions.php memungkinkan pengembang web untuk menambahkan fungsionalitas ke situs WordPress mereka dengan menggunakan fungsi WordPress asli dan kode PHP.

1. Arahkan ke folder tema anak Anda yaitu sparkling-child .
2. Buat file .php dan beri nama functions.php .
3. Tambahkan kode berikut ke file functions.php:

Penting untuk dicatat bahwa tema anak tidak memerlukan file functions.php untuk beroperasi. Sebenarnya, Anda hanya boleh menambahkan file ini jika Anda ingin memodifikasi fungsionalitas tema induk. Dalam kebanyakan kasus, sebuah lembar gaya sudah cukup tetapi jika tema induk Anda memiliki beberapa lembar gaya maka Anda harus membuat file functions.php .

Langkah 4: Impor beberapa lembar gaya (opsional).

Jika, misalnya, tema induk yang Anda pilih hadir dengan lebih dari satu lembar gaya, mengimpornya ke tema anak Anda @import akan memperlambat situs web Anda beberapa detik – yang tidak baik. Anda tidak ingin menambah waktu buka halaman situs Anda jika dapat dihindari dengan beberapa baris kode.

1. Arahkan ke direktori tema anak Anda dan buka file functions.php di editor teks.
2. Tambahkan baris kode berikut ke file functions.php di bawah tag pembuka <?php :

Fungsi wp_enqueue_style() yang digunakan dalam kode di atas akan mengimpor beberapa lembar gaya ke tema anak Anda tanpa memperlambat situs Anda.

Catatan: Praktik terbaik untuk membuat tema anak menyarankan agar Anda selalu mengimpornya menggunakan kode yang diberikan di atas, terlepas dari berapa banyak lembar gaya yang dimiliki tema induk Anda.

Langkah 5: Unggah tema anak.

Sekarang setelah Anda berhasil membuat tema anak, saatnya mengunggahnya ke situs WordPress Anda dan mengaktifkannya.

1. Kompres direktori tema anak menjadi file .zip .
2. Masuk ke panel admin WordPress Anda dan arahkan ke Appearance > Themes .
3. Klik tombol Tambah Baru pada layar berikut.

Anda juga dapat mengunggah tema anak melalui klien FTP Anda dengan langsung menyalin dan menempelkan file .zip ke direktori tema. Jika Anda membuat tema anak untuk tema lain, buat perubahan yang diperlukan pada kode yang diberikan di atas.

Tutorial ini hanya dimaksudkan untuk menunjukkan bagaimana tema anak dibuat. Kami telah membuat tema anak untuk Sparkling yang dapat Anda unduh secara langsung jika Anda tidak ingin menghabiskan waktu untuk membuatnya sendiri.

Menyesuaikan Tema Anak Anda

Dengan asumsi semuanya berjalan sesuai rencana, saat Anda mengaktifkan tema anak, situs web Anda akan terlihat sama seperti saat tema induk diaktifkan. Tapi tunggu! Bukankah inti dari membuat tema anak untuk membuat situs web Anda terlihat berbeda?

Di bagian ini, kami akan menunjukkan kepada Anda bagaimana Anda dapat mulai menyesuaikan tema anak untuk membuat modifikasi.

Menerapkan Gaya Kustom

Karena file pertama (dan file wajib) yang kami buat adalah , style.css , masuk akal untuk memulai dengan menambahkan gaya kustom ke tema anak yang menggunakannya. Dengan menambahkan kode CSS khusus ke lembar gaya, Anda akan dapat mengganti lembar gaya tema induk.

Dengan CSS, Anda dapat memodifikasi setiap aspek desain dan gaya dari tema yang diaktifkan dari warna dan tombol hingga dimensi dan gaya font. Pengembang web dengan bakat nyata untuk CSS memodifikasi seluruh tata letak tema anak untuk menjadikannya salah satu dari jenisnya.

Yang harus Anda lakukan adalah menambahkan kode CSS khusus ke bagian bawah file style.css tema anak Anda dan Anda siap melakukannya. Anda yang tidak ingin mengakses klien FTP situs mereka setiap kali perubahan sederhana perlu dilakukan dapat menavigasi ke editor default WordPress ( Appearance > Editor ) dan menambahkan kode CSS langsung dari sana. Arahkan ke Appearance > Editor dan tambahkan kode CSS langsung dari sana.

Yang harus Anda lakukan adalah menambahkan kode CSS khusus ke bagian bawah file tema anak Anda dan Anda siap melakukannya.

Teknik Modifikasi Tema Alternatif

Menambahkan kode CSS ke file style.css adalah cara paling sederhana untuk melakukan modifikasi pada tema anak. Namun, jika Anda ingin membawa hal-hal ke tingkat berikutnya dan mungkin menambahkan beberapa fungsi kustom baru ke tema anak, maka di situlah segalanya menjadi serius. Ada berbagai jenis modifikasi yang dapat Anda lakukan (selain mengubah elemen desain) seperti:

• Tambahkan fungsi baru ke file functions.php . Kami telah membuat file functions.php untuk tema anak Anda sehingga yang harus Anda lakukan sekarang adalah menambahkan beberapa fungsi kustom ke dalamnya tergantung pada fungsionalitas yang ingin Anda capai. Anda dapat membuat kode dalam PHP atau menggunakan fungsi WordPress asli.
• Mengedit file templat. Jika style.css dan functions.php tidak memotongnya dan Anda masih perlu memodifikasi tema, Anda dapat menyalin dan menempelkan file template dari tema induk dan mengeditnya sesuai dengan itu.
• Tambahkan file template baru. Jika Anda telah menemukan templat yang Anda sukai di tempat lain (bukan di direktori tema induk) atau jika Anda ingin membuat templat sendiri, Anda dapat menambahkannya langsung ke tema anak dan pergi dari sana.

Anda dapat yakin mengetahui bahwa situs web WordPress Anda akan aman dari bug berbahaya yang tidak diinginkan terlepas dari metode yang Anda gunakan untuk melakukan modifikasi pada tema yang diaktifkan. Jika mungkin, ada sesuatu dengan kode yang salah, Anda akan tahu persis di mana kesalahan itu terjadi dan dapat memperbaikinya. (Petunjuk: biasanya di baris terakhir yang Anda tambahkan!)

Salah satu hal terbaik tentang tema anak adalah mereka memungkinkan pengguna untuk sepenuhnya menyesuaikan tema induk agar sesuai dengan merek situs mereka yang sangat berguna baik untuk bisnis baru maupun yang sudah mapan. Dan jika Anda ingin mendesain ulang situs Anda sepenuhnya nanti berdasarkan tema induk yang sama atau tema induk baru, Anda selalu dapat membuat tema anak baru dan mulai dari sana!

Membungkusnya

Tema anak adalah cara yang disarankan untuk membuat modifikasi pada tema WordPress. Mereka menyelamatkan pengguna dari membuat kesalahan yang berpotensi membahayakan file tema asli mereka dan berisiko kehilangan modifikasi setiap kali tema diperbarui.

Kami membahas semua yang perlu Anda ketahui tentang tema anak di WordPress, membahas mengapa mereka begitu penting dan memandu Anda melalui tutorial mendalam tentang cara membuat tema anak Anda sendiri dari awal. Untuk membantu Anda memulai membuat modifikasi, kami menyimpulkan dengan bagian singkat tentang bagaimana Anda dapat memulai dengan menyesuaikan tema anak.

Apakah Anda setuju bahwa semua modifikasi desain dan fungsionalitas harus dilakukan melalui tema anak? Apakah Anda berhasil membuat tema anak dan mengaktifkannya di situs WordPress Anda? Kami akan senang mendengar tentang pengalaman Anda, jadi beri tahu kami dengan berkomentar di bawah!