Buat Dan Sesuaikan Tema Anak WordPress
Diterbitkan: 2020-09-29Jika Anda ingin membuat perubahan pada tema WordPress Anda, Anda mungkin pernah mendengar bahwa cara yang baik untuk melakukannya adalah dengan membuat dan menyesuaikan tema anak WordPress . Tapi tahukah Anda apa itu child theme dan mengapa ada baiknya menggunakannya? Jika tidak, Anda berada di tempat yang tepat.
Tema Anak WordPress
Memiliki tema anak menyiratkan bahwa ada juga tema induk. Hubungan orangtua-anak adalah sesuatu yang pernah Anda dengar jika Anda tahu sedikit tentang pengkodean. Ketika datang ke WordPress, khususnya, kami memiliki hubungan orang tua-anak dalam jenis posting khusus, misalnya. Kelas atau tema anak adalah sesuatu yang memiliki karakteristik induknya tetapi dapat memiliki lebih banyak karakteristik tambahan, yang akan membuatnya berbeda dari induknya. Saat berbicara tentang tema, tema anak dipasang di samping waktu induk. Tema anak memungkinkan kita untuk mengubah tema induk, tetapi dengan cara yang aman, tanpa mengedit tema induk secara langsung . Pada dasarnya, tema anak akan memiliki sebagian besar pengaturan desainnya sama dengan tema induk. Namun, jika Anda membuat beberapa perubahan, perubahan ini akan menimpa pengaturan awal.
Alasan Menggunakan Tema Anak
Jika Anda bertanya-tanya mengapa tidak membuat perubahan langsung ke tema induk, kami akan menjelaskannya sekarang. Alasan utama mengapa bukan ide yang baik untuk melakukan ini adalah karena pembaruan tema. Agar situs web Anda berfungsi dengan baik, Anda ingin menerapkan pembaruan . Namun, jika Anda menyesuaikan tema induk, Anda akan kehilangan semua perubahan setiap kali Anda memperbarui tema, karena perubahan akan ditimpa.
Bagaimana Tema Anak WordPress Bekerja
Tema anak disimpan dalam direktori terpisah dari tema induk. Setiap waktu memiliki file style.css dan functions.php sendiri. Meskipun Anda harus memiliki setidaknya dua file di direktori tema anak, agar dapat berfungsi dengan baik, Anda juga dapat menambahkan file lain. Dua file minimal dapat membantu Anda mengubah gaya, pengkodean dan skrip, dan parameter tata letak. Saat pengguna mengunjungi situs web Anda, WordPress memuat tema anak dan kemudian mengisi gaya dan fungsi yang hilang menggunakan bagian dari tema induk. Ini memungkinkan Anda untuk mendapatkan yang terbaik dari tema anak Anda dan menyesuaikannya, dan tidak mengorbankan fungsionalitas inti tema induk.
Cara Membuat Tema Anak
Ada beberapa cara Anda dapat membuat tema anak. Anda dapat melakukannya secara manual, menggunakan klien FTP atau direktori file, atau Anda dapat membuat tema anak menggunakan plugin atau generator online.
Secara manual
Untuk membuat tema anak secara manual, Anda harus menggunakan klien FTP atau pengelola file. Juga, perhatikan bahwa di sini kita akan membuat file style.css berdasarkan tema Twenty Seventeen.
- Melalui klien FTP atau pengelola file, akses folder public_html > wp-content > tema Anda
- Di sini, Anda harus membuat Folder Baru. Konvensi mengatakan bahwa Anda harus memberi nama folder ini, dengan nama tema induk, tetapi tambahkan -anak sebagai akhiran. Di sini, nama folder baru akan menjadi dua puluh tujuh belas anak.
- Buat file style.css di dalam folder dan tambahkan kode ini ke dalamnya:
/* Theme Name: Twenty Twenty Child Theme URL: http://yourdomain.com Description: Twenty Twenty Child Theme Author: Your Name Author URL: http://yourdomain.com Template: twentytwenty Version: 1.0.0 Text Domain: twentytwenty-child */- Sesuaikan nilainya sesuai kebutuhan. Berikan perhatian ekstra pada baris Template, karena ini memberi tahu WordPress tema induk mana yang terkait dengan tema anak Anda. Setelah selesai, simpan perubahan Anda dan tutup.
- Menggunakan editor teks, buat file lain bernama functions.php, tetapi jangan salin kode dari tema induk. Salin dan tempel kode ini di sana ke file kosong:
<?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' ); function enqueue_parent_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' ); } ?>- Setelah Anda menyimpan dan menutup file ini, kunjungi situs web Anda dan buka Appearance>Theme. Aktifkan tema anak, dan Anda akan melihatnya seperti tema induknya.
Menggunakan plugin tema anak
Menggunakan plugin tema anak mungkin lebih mudah dan lebih intuitif. Berikut adalah beberapa plugin yang dapat Anda gunakan misalnya Child Theme Generator, Child Theme Configurator, atau Child Theme Wizard. Perlu diingat bahwa menggunakan plugin juga membutuhkan pengetahuan. Misalnya, Anda mungkin perlu menonaktifkan plugin, tanpa mengakses area admin Anda, karena mungkin ada saatnya Anda tidak akan memiliki akses ini. Dan dibutuhkan beberapa keterampilan untuk melakukan ini. Namun, secara keseluruhan, plugin biasanya mudah digunakan, jadi jangan takut untuk menggunakannya.
Menggunakan generator online
Menggunakan generator tema anak online membuat proses ini lebih mudah. Anda hanya perlu pergi ke https://childtheme-generator.com dan ikuti langkah-langkahnya. Saat Anda membuat dan mengunduh tema, buka Penampilan> Tema dan unggah dan aktifkan tema anak Anda.
Cara Menyesuaikan Tema Anak
Untuk menyesuaikan tema anak Anda, Anda perlu tahu cara memeriksa elemen di halaman web dan memahami aturan dasar CSS. Untuk mempersonalisasi tema anak Anda, dari tema anak yang aktif, buka Kustomisasi> CSS Tambahan.
Ubah Warna Latar Belakang
Latar belakang yang tepat memainkan peran penting dalam tampilan situs web. Meskipun Anda dapat menambahkan gambar latar belakang di WordPress, di sini kita hanya akan berbicara tentang mengubah warna latar belakang tema anak Anda. Untuk melakukannya, tambahkan aturan CSS ini:
.situs-konten-berisi {
warna latar: #DEF0F5;
posisi: relatif;
}
Ingatlah bahwa Anda dapat mengubah nilainya setelah warna latar belakang. Nilai spesifik ini adalah nilai biru muda.
Ubah Warna Bilah Sisi
Ini adalah aturan CSS yang harus Anda masukkan untuk mengubah warna bilah sisi:
.widget {
latar belakang: #B9EBFA;
bantalan: 25px;
Sesuaikan Jenis Font, Ukuran dan Warna
Untuk mengubah jenis font, ukuran, dan warna tema anak WordPress Anda, masukkan kode di bawah ini. Perhatikan bahwa tag p mewakili teks paragraf.
p {
warna: merah muda;
}
p {
font-family: Georgia;
ukuran font: 18px;
}
Anda juga dapat mengubah teks bagian lain, seperti judul dan header, tetapi Anda perlu memeriksa elemen, menemukan tautan gaya CSS, menyalinnya, dan mengubah nilainya sesuai kebutuhan.
Kesimpulan
Jika Anda ingin menyesuaikan tema, tanpa langsung mengubah kodenya, tema anak adalah cara yang bagus untuk melakukannya. Dengan panduan ini, Anda akan dapat membuat dan menyesuaikan tema anak WordPress dan menggunakannya untuk berbagai tugas . Bagian terbaiknya adalah Anda tidak akan kehilangan perubahan setelah memperbarui tema induk.