CSS Kustom: Haruskah Anda menggunakan Tema Anak WordPress atau Penyesuai?

Diterbitkan: 2022-06-15

WordPress adalah alat yang fleksibel secara dinamis yang dapat digunakan oleh pengembang web ahli maupun pemilik situs pemula. Jika Anda tidak dapat menemukan cara untuk menata sesuatu sesuai keinginan Anda, Anda dapat menambahkan gaya yang disesuaikan, juga disebut CSS (Cascading Stylesheets) untuk mengubah tampilan dan nuansa situs Anda, mulai dari tata letak dan pemosisian hingga warna, font, dan banyak lagi.

Secara historis, pengguna WordPress telah menggunakan tema anak untuk menyesuaikan tampilan dan nuansa situs web WordPress. Tema anak mewarisi semua kualitas tema induk, namun sedikit lebih banyak. Saat Penyesuai WordPress telah ditambahkan, menjadi lebih mudah untuk menambahkan sedikit CSS untuk mempengaruhi beberapa hal yang sama yang telah kita lakukan secara tradisional dengan tema anak.

Kapan Anda menggunakan tema anak versus hanya menambahkan CSS ke penyesuai? Apakah ada kasus ketika plugin cuplikan kode lebih masuk akal?

Dalam posting blog ini, kami melihat menyesuaikan tema Anda dengan CSS Anda sendiri melalui berbagai cara dan mendiskusikan kapan masuk akal untuk menggunakan satu metode di atas yang lain. Namun, pertama-tama, mari kita perjelas beberapa istilah. Apa itu penyesuai, apa itu tema anak, dan plugin apa yang melakukan pekerjaan ini juga?

Apa itu tema anak?

Tema anak adalah tema WordPress yang mewarisi semua kualitas tema WordPress lainnya. Tema utama, tema induk, dapat berupa tema komersial, yang Anda kembangkan sendiri, atau salah satu tema gratis di direktori tema WordPress.org. Dan ya, Anda dapat membuat tema anak Kadence. Kami akan berbicara nanti di posting ini tentang apakah Anda mungkin tidak perlu, atau kasus di mana Anda mungkin ingin.

Untuk membuat tema anak, Anda akan membuat direktori terpisah di bawah wp-content/themes/ pada tingkat yang sama dengan tema induk. Biasanya ini akan dimulai dengan dua file, style.css dan functions.php, tetapi Anda juga dapat menambahkan banyak penyesuaian lain ke tema anak yang Anda inginkan. Kami memiliki panduan yang membahas tentang membuat tema anak jika Anda memerlukannya. Ada sejumlah plugin yang akan membuat tema anak untuk Anda, dan Anda dapat menghapus plugin konfigurasi tema anak ini setelah tema anak dibuat.

Mengapa orang menggunakan tema anak?

Pengguna WordPress membuat tema anak ketika mereka perlu melakukan modifikasi pada tema induk, tetapi mereka menginginkan proses peningkatan yang mudah untuk tema induk.

Misalnya, Anda ingin menambahkan tag Google Analytics ke tajuk situs Anda, atau Anda ingin memastikan bahwa semua formulir, gambar, atau tombol ditata dengan cara tertentu, atau mungkin Anda membuat penyesuaian pada email WooCommerce yang perlu disimpan di area tema Anda.

Saat Anda membuat tema anak, semua penyesuaian Anda disimpan dan dilindungi dari penimpaan saat tema induk Anda memerlukan pembaruan. Untuk alasan keamanan dan fungsional, selalu penting untuk selalu memperbarui tema dan plugin. Tetapi Anda tidak ingin harus menyesuaikan ulang tema Anda setiap kali tema Anda memerlukan pembaruan, jadi menambahkan gaya ke tema anak masuk akal. Dengan cara ini, tema induk diperbarui sementara tema anak Anda tetap sama.

Apakah Anda memerlukan tema anak?

Dalam sejarah WordPress, menambahkan tema anak telah menjadi salah satu penyesuaian terpenting dari situs WordPress baru. Apa pun yang Anda lakukan dengan WordPress, satu tema tidak pernah menjadi akhir dari segalanya, menjadi segalanya. Secara historis ada dua alasan untuk membuat tema anak.

  1. Untuk menambahkan CSS tambahan.
  2. Untuk menambahkan fungsi tambahan.

Secara historis, untuk sebagian besar penyesuaian, tema anak telah menjadi cara termudah untuk melakukannya sambil menjaga integritas tema induk. Tetapi banyak yang telah berubah dengan penambahan WordPress Customizer.

Apa itu penyesuai?

Saat Anda melihat halaman atau posting WordPress sebagai pengguna yang masuk dengan hak pengeditan atau administratif, ada opsi di bilah admin untuk menyesuaikan WordPress. Saat mengklik ini, itu membuka bingkai dua jendela di mana ada penyesuai di sebelah kiri dan situs itu sendiri di sebelah kanan.

penyesuai, di sini

Di penyesuai, Anda memiliki akses ke semua yang dapat disesuaikan untuk situs tertentu. Ada beberapa kontrol umum yang ditambahkan inti WordPress, tetapi banyak tema, termasuk Kadence, menambahkan beberapa opsi pengaturan di sini juga.

menggunakan penyesuai dengan Kadence

Penambahan penyesuai memberi pemilik situs cara baru untuk mengatur apa pun, termasuk opsi untuk menambahkan CSS tambahan. Di masa lalu, satu-satunya cara untuk menerapkan CSS tambahan ke situs WordPress adalah dengan melakukannya melalui tema anak.

Pengaturan dari warna, font, dan bahkan tata letak header/footer semuanya dapat dilakukan dengan penyesuai.

Kadence mengambil tema anak, penyesuai, dan plugin

Kadence telah mengambil sikap bahwa Anda harus dapat menyesuaikan situs WordPress Anda melalui Customizer sebanyak mungkin. Ada berbagai pengaturan yang tersedia untuk Anda dalam opsi Kustomisasi Kadence, dan Anda bahkan dapat menambahkan kode Google Analytics Anda melalui Customizer ke situs bertema Kadence Anda menggunakan versi Kadence Pro.

Dan jika menambahkan fungsi tambahan ke situs WordPress Anda, melakukannya dengan plugin Cuplikan Kode adalah cara termudah untuk melakukannya bagi sebagian besar pengguna.

Dengan cara ini, bagi sebagian besar pengguna WordPress, Kadence telah menyederhanakan cara menambahkan gaya dan fungsionalitas tambahan ke WordPress sehingga pengelolaan situs WordPress menjadi lebih mudah.

Meskipun demikian, tidak semua situs WordPress sama, tidak semua pengguna WordPress sama, dan kebutuhan satu situs serta implementasinya mungkin berbeda dari yang lain. Juga, ada banyak sekali metode untuk menyelesaikan sesuatu dengan WordPress.

Berikut adalah beberapa hal yang perlu dipertimbangkan saat menambahkan kode khusus ke situs WordPress Anda.

Kapan Anda harus menggunakan penyesuai?

Jika Anda hanya menambahkan beberapa baris kode CSS, penyesuai akan menjadi pilihan terbaik Anda. Anda dapat dengan mudah menambahkan beberapa baris, menerbitkan, dan melihat bagaimana CSS berlaku di situs WordPress Anda langsung dalam tampilan penyesuai.

Bagi sebagian besar pemilik situs, hanya penyesuai yang mereka butuhkan.

Untuk pengguna Kadence Pro, ada tempat acara di penyesuai untuk menambahkan skrip header, footer, dan tag tubuh, jadi meskipun Anda menggunakan Google Pengelola Tag, Google Analytics, atau layanan lain yang memerlukan penambahan skrip khusus, Penyesuai dapat dengan mudah mengakomodasi kustomisasi Anda.

Kapan Anda harus menggunakan Plugin Cuplikan Kode

Jika Anda hanya menambahkan beberapa baris kode PHP, plugin Cuplikan Kode adalah cara yang bagus untuk menambahkan kode. Anda dapat dengan mudah mengaktifkan dan menonaktifkan kode menggunakan plugin untuk menguji dan memastikan bahwa kode berfungsi dengan baik.

Pada contoh di atas, beberapa kode ditambahkan ke situs menggunakan Cuplikan Kode agar hanya dijalankan di area admin untuk membuat LearnDash dan Elementor bekerja lebih baik bersama-sama untuk pengeditan kursus. Ini bisa dilakukan dengan tema anak juga, tetapi untuk pemilik situs ini, Cuplikan Kode adalah alternatif yang lebih mudah.

Tentu saja, untuk plugin minimalis yang ingin menjalankan situs mereka dengan plugin sesedikit mungkin, plugin Code Snippets mungkin merupakan lompatan besar. Menyeimbangkan lebih sedikit plugin dengan fungsionalitas yang diperlukan adalah sesuatu yang harus dilakukan berdasarkan kasus per kasus.

Kapan sebaiknya Anda menggunakan tema anak?

Jika Anda menambahkan lebih dari beberapa baris kode CSS atau memperluas fungsionalitas situs dengan kode PHP tambahan, tema anak mungkin merupakan cara terbaik. Area CSS Penyesuai agak kecil, jadi menambahkan banyak CSS di sana bisa membuat Anda kewalahan atau membingungkan untuk dikelola. Dalam kasus seperti ini, tema anak akan lebih mudah. Selain itu, jika Anda menambahkan fungsi khusus yang lebih dari yang dapat dikelola dengan mudah oleh plugin Cuplikan Kode, tema anak dapat dengan mudah melakukannya.

Tema anak memungkinkan Anda untuk menambahkan beberapa baris CSS dan mengelolanya dengan sistem file daripada menyimpan CSS dalam database dan ditambahkan ke setiap halaman. Melalui tema anak, CSS dimuat melalui file style.css, yang dapat di-cache oleh browser yang memberikan sedikit manfaat kinerja. Jika Anda menambahkan sedikit kode khusus atau fungsi khusus, tema anak adalah cara terbaik untuk melakukannya.

Masalah perfoma

Saat menggunakan fungsi CSS tambahan penyesuai, gaya yang ditambahkan akan menambahkan kode Anda sebaris dalam tag <style> di kepala setiap halaman. Ini berarti bahwa jika Anda memiliki banyak CSS, Anda akan menambah ukuran semua halaman Anda satu per satu. Peramban pengunjung situs Anda akan mengunduh gaya khusus Anda beberapa kali.

Di sisi lain, sementara menambahkan CSS ke file stylesheet berarti browser perlu mengunduh stylesheet tambahan, itu juga berarti browser dapat menyimpan file dalam cache sehingga gaya tambahan tidak perlu diunduh lagi untuk setiap halaman individual.

Masalah pemeliharaan

Menambahkan CSS ke CSS Tambahan berarti Anda perlu menggunakan editor di Customizer, yang cukup sempit, dan tidak cocok untuk CSS dalam jumlah besar. Jika Anda menambahkannya dalam stylesheet, Anda dapat menggunakan editor teks mana pun yang Anda suka, dengan ukuran yang lebih nyaman. Anda bahkan dapat menggunakan editor tema di wp-admin untuk mengedit File CSS langsung di dalam browser. Anda dapat menemukan editor tema di bawah Appearance > Theme File Editor . Pastikan Anda beralih ke tema yang benar saat mengedit, dan kami sangat menyarankan Anda membuat cadangan situs Anda sebelum mengedit file tema anak Anda.

Mengedit file tema Anda

Kami sangat menyarankan Anda menggunakan salah satu metode yang tercantum ini daripada mengedit file tema induk utama Anda, baik Anda menggunakan Kadence atau tema lainnya. Mengedit file tema Anda tidak hanya dapat merusak situs Anda, tetapi Anda juga akan kehilangan penyesuaian tersebut saat tema Anda diperbarui lagi.

Atau lebih buruk lagi, saat menambahkan kode atau memodifikasi kode dalam file tema, Anda akan ditempatkan pada posisi mencoba mencari cara untuk mempertahankan penyesuaian sambil tetap memperbarui tema untuk fitur baru atau untuk memperbaiki masalah keamanan.

Kesimpulan

Kami berharap tampilan tema anak ini membantu dalam memahami kapan harus menggunakan tema anak, kapan tidak, dan cara baru untuk menyesuaikan situs Anda untuk kinerja yang optimal saat menambahkan penyesuaian. Jika semua hal ini tampak terlalu banyak untuk dipertimbangkan, Anda mungkin baik-baik saja dengan alat di Customizer saat ini.