Cara Menghindari Kesalahan Umum Pengembangan Tema WordPress
Diterbitkan: 2021-02-16WordPress dikenal sangat fleksibel, terutama dalam hal pengembangan tema dan plugin. Jika Anda ingin melihat buktinya, tanyakan saja kepada sekelompok pengembang bagaimana mereka akan menerapkan fitur tertentu. Kemungkinannya adalah Anda akan menerima beberapa metode berbeda untuk mencapai hasil yang sama. Forum dukungan dipenuhi dengan contoh-contoh semacam ini.
Tetapi dengan fleksibilitas itu juga adalah kenyataan bahwa mudah untuk melakukan hal-hal dengan cara yang "salah". Sekarang, dalam hal ini, "salah" berarti ada sesuatu yang tidak efisien atau sedikit merepotkan untuk dipertahankan. Meskipun mungkin berfungsi dalam arti fungsional, biasanya ada cara yang lebih baik untuk menyelesaikan sesuatu.
Mari kita lihat lima kesalahan umum yang ditemukan dalam pengembangan tema, bersama dengan alternatif yang akan menyelamatkan Anda dari sakit kepala di masa depan.
1. Menggunakan URL Absolut di Template
Jika Anda pernah melihat kode HTML yang dihasilkan halaman atau posting WordPress, Anda akan melihat bahwa gambar dan tautan internal menggunakan URL absolut (penuh). Tapi ini bukan cara terbaik untuk menyelesaikan sesuatu saat menambahkan kode ke template tema Anda.
Sebagai contoh, katakanlah Anda sedang mengembangkan situs web yang menggunakan URL sementara. URL absolut yang di-hardcode dalam template berarti Anda harus membuat perubahan kode secara manual saat Anda siap meluncurkan situs di domain permanennya. Meskipun ini dapat dilakukan, terlalu mudah untuk melupakan semua tempat di mana jenis kode ini dapat bersembunyi.
WordPress memiliki cara bawaan untuk menentukan URL yang benar – ditarik langsung dari Settings > General
area Dashboard.
Untuk tautan, esc_url( home_url() )
akan memberikan path lengkap ke halaman beranda. Jadi, alih-alih secara eksplisit menempatkan URL dalam kode Anda, Anda dapat menambahkan tautan sederhana kembali ke beranda Anda seperti:
<a href="<?php echo esc_url( home_url() ); ?>" />Home</a>
Terlebih lagi, Anda juga dapat menggunakan ini untuk menunjuk ke halaman sekunder. Misalnya, jika kami ingin menautkan ke halaman Tentang Kami di situs kami, kami dapat menggunakan kode berikut:
<a href="<?php echo esc_url( home_url() ); ?>/about-us/" />About Us</a>
Cuplikan serupa juga berfungsi untuk gambar. Contoh ini mengambil gambar dari subfolder /images/
tema aktif kami:
<img src="<?php echo esc_url( get_stylesheet_directory_uri() ) ; ?>/images/hello.png" />
2. Menambahkan Skrip dan Gaya Langsung ke Template
Menggunakan skrip dan gaya pihak ketiga dengan WordPress adalah dunianya sendiri. Saat pertama kali memulai membangun tema, Anda mungkin tergoda untuk menempatkan <script>
atau <style>
, atau bahkan kode embed Google Font langsung ke header tema Anda. Ini umumnya bagaimana hal-hal dilakukan dengan situs HTML statis, jadi masuk akal untuk melakukan hal yang sama di sini.
Tapi, seperti hampir semua hal lain di WordPress, ada cara yang lebih baik untuk melakukannya. Sebagai gantinya, manfaatkan wp_enqueue_script()
dan wp_enqueue_style()
– yang menambahkan skrip dan stylesheet ke tempat yang tepat untuk Anda. Itu juga membuat pengelolaan aset menjadi lebih mudah, karena semuanya dipanggil dari file functions.php
tema Anda.
Daripada menemukan kembali roda di sini, Buku Pegangan Tema WordPress memiliki panduan fantastis tentang cara menambahkan skrip dan gaya dengan benar ke tema Anda.
3. Memanggil Instance Luar jQuery
Dalam catatan terkait, salah satu rahasia tersembunyi WordPress adalah ia sudah menyertakan salinan jQuery, bersama dengan beberapa fitur UI populer. Jadi, Anda tidak perlu menginstal jQuery atau memanggilnya dari jarak jauh. Ini memudahkan untuk memanfaatkan pustaka JavaScript populer dan mengimplementasikan elemen seperti tab, datepicker, dialog, dan banyak lagi lainnya.
Satu-satunya tangkapan adalah Anda harus secara khusus mengaktifkan item yang ingin Anda gunakan melalui file functions.php
tema Anda. Sementara itu menciptakan sedikit kurva belajar, itu juga mengurangi kembung.
Dan, sejujurnya, tidak terlalu sulit untuk mengimplementasikan elemen jQuery UI yang diinginkan. Misalnya, untuk mengaktifkan penggunaan Tab UI jQuery, cukup tambahkan cuplikan berikut ke functions.php
Anda:
function my_jquery_elements() { wp_enqueue_script( 'jquery-ui-tabs', array('jquery')); add_action( 'template_redirect', my_jquery_elements ', 10 );
Ini memberitahu WordPress untuk memuat elemen dari perpustakaan yang sudah ada. Dari sana, rancang tab Anda dan tentukan seperti yang ditentukan dalam dokumentasi jQuery UI.
4. Mengambil Kustomisasi Terlalu Jauh
Kemampuan untuk menambahkan bidang khusus dan jenis posting khusus dapat membuat hidup pengembang dan editor konten situs menjadi lebih mudah. Mereka menawarkan kenyamanan, pengaturan konten yang lebih baik, dan UX yang lebih intuitif. Tapi terkadang kita mengambilnya terlalu jauh.
Saya penggemar berat bidang khusus, misalnya. Tetapi bahkan saya akui bahwa ada kalanya saya telah menyesuaikan tema hingga tidak fleksibel. Bidang sangat bagus untuk pengaturan di mana kami tahu persis konten apa yang perlu dimasukkan – seperti bidang profil anggota staf.
Namun, itu bisa menjadi berantakan ketika ada inkonsistensi dalam jenis konten yang ingin ditambahkan seseorang. Klien terkenal memiliki pengecualian "kecil" dalam konten yang dapat membuat penggunaan penyesuaian menjadi lebih sulit. Logika bersyarat dapat menjelaskan beberapa hal ini, tetapi Anda hanya dapat mengambilnya sejauh ini sebelum UI lepas kendali.
Tidak ada aturan keras dan cepat untuk jenis penyesuaian ini. Satu-satunya hal yang benar-benar dapat kami lakukan adalah menggunakan penilaian terbaik kami tentang apa yang harus disesuaikan dan apa yang dapat lebih baik diserahkan kepada editor konten WordPress atau bahkan plugin khusus. Ketika kami menambahkan bidang atau jenis posting, ketahuilah bahwa hal-hal dapat berubah di kemudian hari dan cobalah untuk membangun dengan mengingat hal itu.
5. Gagal Mengomentari Kode
Saya akan membuat pengakuan lain di sini: Mengomentari kode bukanlah salah satu kelebihan saya. Bukannya saya tidak menggunakan komentar sama sekali, tetapi lebih karena mereka tidak terlalu mengartikulasikan. Biasanya, saya akan menunjukkan awal dan akhir item tertentu tanpa banyak wawasan di antaranya. Haruskah saya melakukan lebih banyak? Mungkin begitu.
Mengomentari itu penting karena setidaknya memberikan beberapa poin referensi di dalam kode. Saat menggali file PHP atau JS yang berisi lebih dari satu hal, Anda pasti ingin tahu di mana menemukan item tertentu.
Bahkan jika Anda satu-satunya yang akan mengedit kode itu, komentar sangat disarankan. Jika, misalnya, Anda perlu mengubah sesuatu enam bulan dari sekarang, kecil kemungkinan Anda akan mengingat tempat persisnya Anda meletakkan potongan kode.
Jadi, saya tidak akan menjadi seorang munafik besar dan memohon Anda untuk mengomentari semuanya dengan sangat mendalam. Tetapi saya akan mengatakan bahwa bahkan upaya minimal di sini membuat pemeliharaan di masa mendatang lebih mudah bagi Anda atau pengembang lain yang harus menyisir pekerjaan Anda.
Teknik yang Lebih Baik Seiring Waktu
Membangun tema WordPress Anda sendiri bisa menjadi pengalaman yang luar biasa. Tetapi perlu sedikit latihan untuk memahami detail yang lebih baik dalam membuat tema yang dikodekan dengan baik dan mudah dirawat. Semakin banyak pengalaman yang Anda peroleh, semakin banyak teknik Anda akan berkembang.
Saya dapat dengan jujur mengatakan bahwa beberapa tema pertama yang saya kumpulkan sama sekali tidak seefisien sekarang. Dan saya juga yakin bahwa mereka mungkin masih belum matang jika dilihat oleh pengembang yang benar-benar ahli. Dalam pengertian itu, evolusi kita adalah evolusi yang konstan.
Akhirnya, saya ingin mencatat bahwa saya secara pribadi telah melakukan setiap kesalahan yang disebutkan di atas. Hanya melalui percobaan dan kesalahan, bersama dengan beberapa kunjungan ke Codex, saya menemukan cara untuk mulai melakukan sesuatu dengan "Cara WordPress".
Pelajarannya adalah bahwa kita semua akan membuat kesalahan. Tetapi masing-masing memberi kita kesempatan untuk belajar dan berkembang.