Cara Membuat Tema Anak WordPress: Playbook Lengkap Untuk Siapa Saja Di 2022

Anda telah menemukan tema WordPress yang fantastis. Tetapi Anda ingin menambahkan beberapa fungsi tambahan untuk menonjol di pasar. Anda dapat melakukannya dengan banyak cara. Salah satu cara terbaik untuk melakukannya adalah dengan mengedit beberapa kode di stylesheet CSS Anda.

Tetapi proses ini juga memiliki beberapa keterbatasan. Setelah Anda memperbarui tema, Anda akan kehilangan semua perubahan Anda. Anda dapat mempertimbangkan untuk menggunakan tema anak untuk keluar dari masalah ini. Ini akan memungkinkan Anda untuk melakukan kustomisasi sebanyak yang Anda inginkan tanpa risiko kehilangan perubahan kustom apa pun.

Perubahan akan tetap sama meskipun Anda memperbarui tema induk. Artikel ini akan menunjukkan cara membuat tema anak di WordPress dan menjelaskan beberapa manfaat penting yang dapat ditawarkannya kepada Anda.

Daftar isi

• Apa itu Tema Anak?
• Manfaat Menggunakan Tema Anak WordPress
• Panduan Langkah Demi Langkah Tentang Cara Membuat Tema Anak WordPress
• Cara Menyesuaikan Tema Anak WordPress Anda
• Di mana Menemukan Tema Anak Resmi Dari Tema WordPress Populer
• FAQ tentang Tema Anak WordPress
• Apakah Anda Siap Membuat Tema Anak WordPress Anda?

Apa itu Tema Anak?

Tema anak bukanlah tema WordPress yang berdiri sendiri. Itu mewarisi semua elemen tema induk dalam folder terpisah di direktori tema. Ini memungkinkan Anda untuk membuat segala jenis perubahan pada tema tanpa menyentuh file tema utama.

Karena file tema anak disimpan dalam folder terpisah, tidak pernah kehilangan penyesuaian apa pun, bahkan jika tema induk diperbarui. Inilah sebabnya mengapa tema anak adalah cara teraman untuk menyesuaikan tema WordPress Anda yang sudah ada.

Manfaat Menggunakan Tema Anak WordPress

Anda mungkin perlu menyesuaikan tema WordPress yang sedang berjalan untuk berbagai tujuan seperti pengujian, pengembangan, dan perbaikan bug. Membuat tema WordPress anak dapat memberi Anda manfaat berikut dalam situasi seperti itu.

1. Menjaga Tema Asli Tetap Aman

Tema anak memungkinkan Anda membuat kesalahan sebanyak yang Anda inginkan. Jika Anda pernah mengalami bug dengan tema anak, Anda dapat dengan cepat menyelesaikan masalah dengan memulihkan tema induk.

Anda cukup menghapus file kesalahan dan mulai dengan tema anak baru tanpa kehilangan konten tema utama.

2. Kencangkan Proses Pengembangan

Pengkodean untuk membangun seluruh tema WordPress dari awal akan memakan waktu seharian. Tetapi jika Anda menggunakan tema anak, Anda tidak harus memulai semuanya dari nol. Anda dapat mengambil tema WordPress induk sebagai fondasi Anda.

Anda dapat terus mengubahnya dalam skala yang lebih kecil hingga sesuai dengan kebutuhan Anda. Keseluruhan proses pengembangan akan menghemat waktu dan hemat biaya.

3. Perluas Fungsionalitas

Dengan menambahkan beberapa perubahan CSS tweaker ke tema anak Anda, Anda dapat memperluas fungsionalitas situs web Anda dan memberikan tampilan yang menonjol. Anda harus membuat file style.css terpisah untuk tema anak Anda dan menerapkan penyesuaian sesuai kebutuhan. Ini akan mengurangi ketergantungan Anda pada plugin pihak ketiga juga.

4. Buat Tampilan Web Serupa

Ada banyak perusahaan di dunia yang memiliki banyak situs web bisnis. Beberapa dari mereka ingin mempertahankan konsistensi visual di semua situs web bisnis mereka. Dengan menggunakan file tema anak, Anda dapat mewujudkannya di semua situs web Anda.

Ikon web, palet warna, dan logo adalah hal-hal yang dapat Anda tukar dengan mudah dengan sebagian besar tema WordPress. Misalkan Anda memiliki beberapa tema berbeda yang diinstal di semua situs web Anda. Jika Anda memiliki tema anak untuk masing-masing tema, Anda dapat menyalin kode CSS seseorang dan menempelkannya ke file style.css orang lain.

Ini akan membuat semua situs web Anda terlihat agak mirip. Ide ini dapat membantu menyebarkan nilai merek Anda di antara semua situs web Anda yang sedang berjalan.

5. Mudah Dibagikan Dengan Orang Lain

Karena tema anak WordPress disimpan dalam folder terpisah, Anda dapat dengan mudah membaginya dengan orang lain tanpa khawatir. Anda cukup mengunggah file tema anak ke repositori publik (GitHub, Bitbucket).

Panduan Langkah Demi Langkah Tentang Cara Membuat Tema Anak WordPress

Anda dapat membuat tema anak WordPress secara manual atau dengan menggunakan plugin. Kami akan menunjukkan kepada Anda kedua metode ini di bagian ini. Nanti Anda dapat memutuskan metode mana yang paling cocok untuk Anda. Baca terus!

Cara Memasang Tema Anak Hello Elementor

Hello Elementor adalah tema WordPress yang cepat, ringan, dan super responsif. Jika Anda adalah pengguna Elementor, Anda pasti pernah mendengar tema ini. Poin bagus tentang tema ini adalah Anda akan mendapatkan tema anak resmi Hello Elementor dari mereka.

Jadi, Anda tidak perlu membuatnya dari awal. Sebelum itu, Anda harus memastikan tema induk Hello Elementor diinstal. Setelah Anda memilikinya, ikuti langkah-langkah di bawah ini untuk menginstal tema anak Hello Elementor di situs web Anda.

• Unduh tema anak Elementor Hello resmi.
• Kemudian, navigasikan ke dashboard WordPress > Appearance > Themes , dan klik Add new .
• Klik pada Unggah tema .
• Pilih file tema anak dari tempat Anda menyimpannya.
• Selanjutnya, instal dan aktifkan .

Prosesnya sangat sederhana. Ini tidak akan membawa Anda lebih dari hanya lima menit. Sekarang, Anda dapat mulai menyesuaikan tema anak menggunakan Elementor . Kami telah menjelaskan prosesnya di bawah ini.

Jika Anda ingin membuat tema anak bermerek Anda sendiri, maka Anda dapat mengubah nama, URL penulis, dan lainnya di file style.css Anda. Tapi ini tidak perlu. Anda dapat meninggalkan mereka apa adanya. Tema anak Anda akan berfungsi dengan baik.

 Theme Name: Hello Elementor Child Theme URI: https://elementor.com/ Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team Author: Elementor Team Author URI: https://elementor.com/ Template: hello-elementor Version: 1.0.0 Text Domain: hello-elementor-child Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready

Tambahkan gaya khusus apa pun setelah:

 /* Add your custom styles here */

Jika Anda ingin menyesuaikan gaya judul dan warna tautan, Anda harus mengedit hal-hal berikut:

 /* Link Styling */ a, a:active, a:visited { color: #000080; } a:hover { color: #ffd700; } /* Heading H1-H6 Styling */ h1, h2, h3, h4, h5, h6 { font-family: Georgia, serif; color: #3a3a3a; line-height: 35px; font-weight:500; letter-spacing: 1px; } h1 { font-size: 30px; line-height: 1.2; } h2 { font-size: 28px; line-height: 1.3; } h3 { font-size: 26px; line-height: 1.4; } h4 { font-size: 24px; line-height: 1.5; } h5 { font-size: 22px; line-height: 1.6; } h6 { font-size: 20px; line-height: 1.2; } .entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6 { margin-bottom: 20px; }

Kode-kode ini bukan batasnya. Anda dapat menggunakan lebih banyak kelas CSS untuk menyesuaikan tema anak lebih lanjut. Untuk informasi lebih lanjut, kunjungi buku pegangan ini.

Buat Tema Anak WordPress Menggunakan Plugin

Anda juga dapat membuat tema anak dari tema lain selain Hello Elementor atau tema yang menyediakan tema anak secara default. Dalam hal ini, Anda dapat melakukannya dengan mudah dengan plugin. Anda akan menemukan banyak plugin di perpustakaan WordPress. Di sini kita akan menggunakan salah satu yang terbaik untuk menjelaskan prosesnya.

Konfigurator Tema Anak

Dengan 300.000+ instalasi aktif, Child Theme Configurator adalah salah satu plugin WP paling populer untuk membuat tema anak. Itu tidak hanya membuat tema anak tetapi juga lembar gaya font secara akurat dan mengantrekan tema yang ada dan menangani sintaks khusus vendor.

Child Theme Configurator memiliki penganalisis yang secara otomatis memindai format penerbitan konten Anda, widget, dan opsi penyesuai yang tersedia di situs Anda yang sedang berjalan. Ini mempertimbangkan semua masalah ini saat membuat tema anak agar konsisten dengan format web Anda. Sejauh ini bagus!

Catatan: Pastikan Anda memiliki cadangan situs web lengkap sebelum membuat tema anak. Jika situs web Anda mogok, cadangan ini akan menjadi penyelamat Anda.

Setelah cadangan siap, instal dan aktifkan plugin Child Theme Configurator dari WordPress.org. Kemudian ikuti langkah-langkah berikut.

• Buka Alat > Tema Anak .

• Dari menu tarik-turun ' Pilih Tema Induk ', pilih tema yang ingin Anda jadikan tema anak.

Catatan: Anda harus sudah menginstal tema di bagian tampilan Anda.

• Selanjutnya, klik tombol Analisis . Ini akan menilai dependensi tema induk itu.

Ketika analisis selesai, Anda akan mendapatkan beberapa opsi tambahan. Biarkan mereka apa adanya jika Anda tidak tahu apa yang harus dilakukan secara khusus dalam pengaturan ini.

• Klik tombol Buat Tema Anak Baru dari bagian bawah halaman.

Plugin akan mulai membuat tema anak. Tapi itu tidak akan mengaktifkan tema. Anda harus melakukannya secara manual. Untuk mengaktifkan tema anak, navigasikan ke:

• Penampilan > Tema . Anda akan melihat tema anak tersedia di sana.
• Anda dapat mengklik tombol Pratinjau Langsung untuk memverifikasi bahwa itu benar-benar berfungsi.
• Kemudian, klik tombol Aktifkan yang biasanya Anda lakukan dengan tema lain. Pastikan tema induk diinstal.

Setelah tema diaktifkan, saatnya untuk menyalin-tempel file yang diperlukan dari tema induk ke tema anak sehingga Anda dapat mengeditnya.

• Cukup buka tab File . Di sini, Anda akan melihat semua yang tersedia di tema induk dan anak Anda.
• Misalkan Anda ingin membuat beberapa perubahan pada file header.php. Periksa file dan klik tombol Salin yang Dipilih ke Tema Anak .

• Anda bahkan dapat menghapus file yang tidak perlu dari tema anak dari tab ini. Misalkan Anda ingin menghapus file sidebar.php dan functions.php. Periksa mereka dan klik tombol Hapus yang Dipilih .

Sekarang Anda tahu cara membuat anak menggunakan plugin Child Theme Configurator.

Plugin Alternatif: Wizard Tema Anak

Jika Anda mencari alternatif untuk plugin pertama yang kami tunjukkan di atas, Anda dapat mempertimbangkan Child Theme Wizard di daftar periksa Anda. Ini akan memungkinkan Anda menyesuaikan judul tema, deskripsi, URL tema, URL penulis, dan banyak lagi saat mengonfigurasi tema anak.

Ini adalah plugin lain yang mudah digunakan yang akan membuat tema anak dari salah satu tema yang Anda instal dalam waktu singkat. Mari kita periksa prosesnya.

Catatan: Anda akan mendapatkan pemberitahuan 'Plugin ini belum diuji dengan 3 rilis utama terbaru' di WordPress.org. Jangan khawatir! Kami menghubungkan dukungan mereka terhadap Child Theme Wizard. Mereka memastikan kami bahwa plugin tidak memiliki masalah. Kami juga menemukan bahwa plugin berfungsi dengan baik di akhir kami setelah beberapa pengujian.

Namun, plugin ini berfungsi dengan baik hingga versi WordPress 6.1. Anda perlu memeriksa kompatibilitasnya di situs pengujian ketika WordPress 6.2 datang ke pasar.

• Arahkan ke Tools > Child Theme Wizard .

• Pertama, pilih tema induk yang ingin Anda buatkan tema anak. Klik ikon tarik-turun dari bidang Tema Induk . Anda akan mendapatkan daftar tema yang Anda instal di sana. Pilih salah satu yang Anda inginkan.
• Selanjutnya, Anda dapat menulis judul, deskripsi, dan URL khusus untuk tema anak. Jika Anda ingin menambahkan Lisensi GPL, Anda dapat melakukannya dari bidang Sertakan Lisensi GPL .
• Klik Buat Tema Anak dari bagian bawah daftar.

Catatan: Judul kustom Anda harus mirip dengan nama tema induk. (Biasanya orang tidak menyimpan nama yang sama, melainkan menambahkan teks – Anak di suatu tempat di judul)

Hanya perlu beberapa menit untuk menyiapkan tema anak. Jika sudah siap, kamu bisa melihatnya dari bagian Appearance.

• Pergi ke Penampilan > Tema .
• Klik Pratinjau Langsung untuk memeriksa semuanya baik-baik saja.
• Kemudian, klik tombol Aktifkan .

Itu dia! Ini adalah bagaimana Anda dapat membuat tema anak di WordPress.

Cara Membuat Tema Anak WordPress Secara Manual

Anda dapat membuat tema anak secara manual jika Anda tidak suka bergantung pada plugin pihak ketiga. Untuk melakukannya, Anda harus membuat dua file: style.css dan functions.php .

File style.css akan berisi semua aturan dan deklarasi CSS untuk tema anak. Functions.php akan memungkinkan Anda untuk mengantrekan stylesheet. Tema anak Anda akan gagal menerapkan CSS tema induk Anda tanpa ini dan terlihat aneh. Mari kita buat file-file ini.

1. #style.css

Buat file bernama style.css dan sertakan informasi berikut –

/*
Nama Tema: Halo Elementor – Anak
URI Tema: https://github.com/elementor/hello-theme/
Deskripsi: Ini adalah tema anak Hello Elementor
Pengarang: *****
URI Penulis: *****
Templat:
Versi: 2.0.1
Domain Teks: hello-elementor-child
Lisensi: Lisensi GPL
URI Lisensi: *****
*/

Catatan: Informasi ini akan berbeda berdasarkan tema Anda. Selain itu, Anda tidak perlu memasukkan apa pun di bidang Template . Tema induk akan melakukannya sendiri. Jadi, tetap bebas stres!

2. #functions.php

Tambahkan kode berikut ke file functions.php Anda. Ini akan memungkinkan Anda untuk menambahkan gaya kustom Anda di masa mendatang.

<?PHP
/* Berfungsi untuk mengantrekan stylesheet dari parent theme */
function child_enqueue__parent_scripts() {
wp_enqueue_style( 'induk', get_template_directory_uri().'/style.css' );
}
add_action( 'wp_enqueue_scripts', 'child_enqueue__parent_scripts');

3. Unggah File style.css dan functions.php ke Situs WordPress Anda

Masuk ke cPanel Anda.

• Buka File Manager > Files > Public_html > wp-content > themes .
• Pilih file tema dan klik +Folder .
• Ini akan membuat folder baru menyalin folder tema.

Catatan: Ganti nama folder baru dengan sesuatu seperti 'anak-tema-elementor', sehingga Anda dapat dengan cepat mengidentifikasi folder.

Unggah file style.css dan functions.php ke dalam folder baru ini. Selanjutnya, pergi ke Appearance > Themes . Anda akan menyiapkan tema anak di sana. Klik tombol Activate seperti yang Anda lakukan pada bagian di atas. Jadi sekarang Anda tahu cara membuat tema anak WordPress- secara manual dan menggunakan plugin.

Cara Menyesuaikan Tema Anak WordPress Anda

Jika Anda seorang programmer web profesional, Anda dapat menyesuaikan tema anak melalui pengkodean CSS. Tetapi bagaimana jika Anda adalah pengguna tanpa kode? Jangan khawatir! Lewatlah sudah hari-hari ketika Anda harus membuat kode untuk menyesuaikan tampilan web Anda.

Elementor adalah plugin pembuat tema yang hebat. Ini memiliki antarmuka drag-and-drop. Jika Anda menggunakan Elementor pro, Anda dapat melakukan hal-hal berikut dengan cukup mudah.

1. Buat Header yang Menarik

Anda akan mendapatkan banyak koleksi template header di perpustakaan Elementor. Anda dapat mengimpornya ke situs web Anda hanya dengan satu klik dan menyesuaikannya sesudahnya. Lihat panduan terperinci tentang cara mendesain tajuk khusus hanya dalam beberapa menit.

2. Buat Footer Kustom

Mirip dengan header, Anda akan mendapatkan banyak koleksi template footer di perpustakaan Elmentor. Anda dapat mengimpornya ke situs web Anda atau membuat yang baru dari awal. Lihat cara membuat footer khusus.

3. Desain Halaman Web Bisnis

Elementor memiliki banyak halaman siap pakai yang dengannya Anda dapat menyiapkan situs web bisnis atau eCommerce Anda hanya dengan beberapa klik. Baik itu bisnis eCommerce, restoran, atau perjalanan, tidak perlu banyak waktu untuk menyiapkan halaman arahan Anda dengan Elementor. Periksa untuk merancang situs web eCommerce.

4. Buat Ajakan Bertindak

Elemen memiliki widget ajakan bertindak. Ini dapat membantu Anda menarik perhatian pengunjung web Anda dan mendorong mereka untuk mengambil tindakan yang Anda inginkan. Di sini sekali lagi, Anda akan menemukan banyak template CTA siap pakai di Elementor. Dapatkan sentuhan dengan widget ajakan bertindak Elementor.

Elementor Pro memiliki hampir semua yang Anda butuhkan untuk menghias situs web Anda dengan desain yang Anda harapkan. Cukup jelajahi plugin dan blog yang sudah diterbitkan di situs web HappyAddons kami. Anda dapat memberi tahu kami melalui bagian komentar jika Anda memiliki pertanyaan.

Di mana Menemukan Tema Anak Resmi Dari Tema WordPress Populer

Jika Anda tidak ingin repot membuat tema anak, Anda dapat langsung mengunduhnya dari situs web resmi masing-masing tema. Saat ini, hampir semua pengembang tema WordPress populer menawarkan opsi untuk menghasilkan tema anak dari situs web mereka secara otomatis. Berikut adalah daftar singkat dari mereka.

Halo Elementor

Hello Elementor adalah salah satu tema WordPress super cepat yang pernah Anda temukan. Kami telah menyediakan tautan resmi ke tema anak Hello Elementor di atas. Jika Anda melewatkannya, kami menyematkannya di sini lagi- unduh tema anak Hello Elementor.

Astra

Dengan 1,5+ juta pengguna aktif, Astra adalah tema WordPress multiguna cepat yang dikembangkan oleh Brainstorm Force. Ini sederhana, terjangkau, dan memungkinkan Anda membuat situs web apa pun. Ini memiliki integrasi markup dan pembuat halaman yang ramah SEO. Di sini Anda akan mendapatkan tema anak resmi Astra.

HasilkanTekan

GreneratePress adalah tema ringan yang hebat. Mudah untuk dikustomisasi, kompatibel dengan semua jenis pembuat halaman, dan sepenuhnya responsif. Anda akan mendapatkan banyak opsi pengeditan di dalamnya yang dengannya Anda dapat mengatur situs web Anda untuk mendukung semua jenis proyek. Lihat cara mendapatkan tema anak resmi GeneratePress.

Neve

Neve adalah tema WordPress yang bersih, elegan, super ringan, dan serbaguna. Anda akan menemukan berbagai pilihan penyesuaian yang tersedia di dalamnya. Neve memiliki pembuat halaman yang efektif, antarmuka yang ramah pengguna, dan fitur terjemahan yang siap. Berikut adalah cara membuat tema anak online untuk Neve.

bloksy

Jika Anda mencari sejumlah fitur luar biasa dalam tema gratis, Anda harus mempertimbangkan Blocksy di daftar periksa Anda. Beberapa fitur gratis teratasnya adalah widget pemberitahuan cookie, modul pelanggan buletin, modul posting tren, jenis posting khusus, WooCommerce, dll. Klik tautan ini untuk mendapatkan tema anak Blocksy.

kadence

Kadence adalah pesaing sejati Astra dalam hal fitur, widget, dukungan, dan kompatibilitas. Ini memiliki solusi desain mutakhir, pembuat header/footer gratis, integrasi dengan WooCommerce, addon sakelar warna, dan banyak lagi. Cek di sini untuk mendapatkan child theme dari Kadence.

FAQ tentang Tema Anak WordPress

Bagian ini akan menjawab pertanyaan umum tentang tema anak WordPress yang biasa ditemukan online.

Apakah Anda Siap Membuat Tema Anak WordPress Anda?

Memiliki tema anak dapat memastikan keamanan web Anda dalam banyak hal. Salah satunya adalah website Anda tidak akan crash meskipun Anda melakukan kesalahan saat mengedit kode CSS. Jika Anda memiliki situs web eCommerce atau bisnis yang populer, waktu henti dapat menyebabkan Anda menghasilkan ribuan dolar.

Misalnya, Amazon kehilangan lebih dari $60K hanya dalam satu menit waktu henti. Sebagian besar pengembang memiliki pengalaman merusak situs web mereka saat membuat beberapa perubahan CSS pada tema induknya.

Tetapi jika Anda memiliki tema anak, tidak peduli berapa banyak kesalahan yang Anda buat, tema induk Anda akan sepenuhnya diamankan.

Semoga artikel ini bermanfaat bagi Anda. Namun, jika Anda menghadapi masalah apa pun saat mengikuti langkah-langkah yang dijelaskan di atas, cukup beri komentar di bawah. Kami akan menjawab pertanyaan Anda dalam waktu singkat.

Terima kasih sudah membaca! Semua yang terbaik.