» WP Themes » Membuat Halaman “Theme Options” Untuk Kostumisasi Setting Tema – Desain WP Theme Lanjutan #wp_advance

Membuat Halaman “Theme Options” Untuk Kostumisasi Setting Tema – Desain WP Theme Lanjutan #wp_advance

30menit.com – Apa sih theme options dan mengapa kita harus membuat halaman theme options? #wp_advance

Secara default theme options tidak ada pada menu wordpress. Bahkan di tema bawaan wp juga tidak ada. Lalu buat apa kita harus membuatnya? Sebenernya tidak harus ada jika tema yang anda buat hanya tema sederhana. Tapi jika anda adalah seorang theme creator yang membuat tema khusus seperti tema online shop, tema forum, tema profil perusahaan, dsb umumnya akan membutuhkan theme options ini untuk menampung setingan-setingan khusus untuk tema yang anda buat. Coba baca tutorial saya Membuat Custom WP_Query. Di tutorial tersebut ID Category dan Tag nya harus di tambahkan manual pada deretan source kodenya. Jika pengguna tema anda adalah orang yang kurang dalam hal coding ini akan menyulitkan pengguna untuk mengganti ID tersebut. Di sinilah fungsi theme options dibutuhkan. Istilahnya theme options ini adalah tampilan GUI untuk menangani settingan Custom WP_Query yang anda buat.

Sebagai tahapan belajar, kita akan modifikasi Custom WP_Query untuk di setting melalui theme options. Untuk selanjutnya anda dapat mengembangkan theme options ini untuk mengatur fungsi khusus apa saja yang akan anda buat. Untuk tampilan theme options ini kita manfaatkan style default wp. Selanjutnya bisa anda modifikasi sendiri. Agar lebih jelas silakan buka juga tutorial Custom WP_Query.

Silakan buka file functions.php pada tema anda. Belum pernah membuat tema wordpress? Silakan baca Tutorial Membuat Tema WP dengan bootstrap 4. Silakan tambahkan kode berikut sebagai kerangka theme options.

Dari kode kerangka di atas, silakan lebih fokus ke variable $options dan function my_theme_admin, karena kedua bagian ini yang paling penting. Jika kedepannya anda ingin melakukan perubahan setting, cukup melakukan perubahan pada kedua bagian tersebut. Variable $options adalah variable yang menampung data settingan yang ingin kita gunakan. Di dalamnya juga terdapat id options yang tersimpan dalam data base. Sedangakn function my_theme_admin adalah fungsi yang mengatur tampilan halaman theme options. Di fungsi inilah kode-kode html tampilan beserta style css nya di generalisasi. Sebenernya function mytheme_add_admin juga sangat penting, karena fungsi ini bertugas memproses data input form untuk di simpan dalam data base berdasarkan data-data yang ada di variable $options. Akan tetapi tetap fokus saja ke variable $options dan function my_theme_admin saja, karena proses pengembangan lanjutan cukup melakukan edit keduanya. Sampai di kode kerangka di atas sebenernya menu dan halaman theme options sudah terbentuk. Tetapi belum memiliki setingan sama sekali. Mari kita isi settingan yang ingin kita gunakan. Edit variable $options seperti di bawah

Variable $options tidak akan berguna jika tidak ada yang mewadahi atau yang menampilkan. Jadi function my_theme_admin akan bertugas menampilkan data-data dari variable tersebut. Dalam function my_theme_admin kita cukup membuat satu untuk satu jenis form saja. Maksudnya jika dalam halaman tersebut terdapat input text, kita cukup membuat satu saja yang nantinya dapat digunakan berkali-kali sesuai kebutuhan atau sesuai data variable $options. Kita gunakan fungsi switch dalam php untuk melakukan hal tersebut. Baik silakan modifikasi function my_theme_admin menjadi seperti berikut

Sampai disini proses pembuatan halaman theme options sebenernya sudah selesai. Akan tetapi data dalam databse yang dihasilkan dari theme option masih belum berguna karena belum diterapkan pada titik yang ingin di setting. Dalam hal ini adalah Custom WP_Query pada index.php. Titik yang di setting tidak selalu ada pada index.php, bisa dimana saja namun dalam contoh ini adalah Custom WP_Query. Untuk mengambil data hasil theme options dari data base gunakan perintah php get_theme_option(id_setting); id_setting disini maksudnya adalah id dari settingan yang ada di variable $options. Biar tidak bingung langsung ke penerapan saja. Jika dalam index.php ada sederetan kode berikut :

Modifikasi manjadi berikut :

Hasilnya sekarang ID Category dan ID Tag pada Custom WP_Query dapat di setting dari halaman theme options. Agar lebih mudah dalam memahami silakan simak video berikut :

Tulisan Terkait
Membuat Halaman “Theme Options” Untuk Kostumisasi Setting Tema – Desain WP Theme Lanjutan #wp_advance by :

Masyhuri Jamil

Tidak memiliki kompetensi di bidang coding. Tapi selalu semangat terus belajar html, css, php, mysql, java script (jquery). Suka oprek-oprek android juga dan yang pasti suka jalan-jalan (treveling).

Memiliki 141 tulisan.
Tambahkan Komentar Anda