Membangun Plugin WordPress Pertama Anda Secara Bertahap: Dari Pengantar hingga Pengembangan Praktis.

Dasar-Dasar Pengembangan Plugin WordPress dan Persiapan Lingkungan

Pada dasarnya, plugin WordPress merupakan sekumpulan file PHP yang digunakan untuk memperluas fungsi-fungsi inti WordPress melalui API yang disediakan oleh WordPress. Ukuran sebuah plugin bisa sangat kecil (hanya berupa beberapa baris kode singkat) atau sangat besar (bahkan mencakup sistem manajemen yang lengkap). Sebelum mulai mengkode, sangat penting untuk memahami struktur dasarnya. Setiap plugin harus memiliki sebuah file utama, yang umumnya dinamai sesuai dengan nama plugin tersebut. my-first-plugin.phpKeterangan di bagian atas file tersebut merupakan kunci bagi WordPress untuk mengenali plugin.

Pengembangan lingkungan merupakan fondasi penting untuk bekerja secara efisien. Anda perlu membangun lingkungan pengujian di lokal yang sebisa mungkin serupa dengan lingkungan online. Kami merekomendasikan penggunaan paket server lokal seperti XAMPP, MAMP, atau Local by Flywheel. Selain itu, pastikan bahwa editor kode atau lingkungan pengembangan terintegrasi (IDE) Anda mendukung penyorotan sintaks PHP dan fitur debugging, seperti VS Code, PhpStorm, atau Sublime Text. Aktifkan juga fitur-fitur terkait WordPress di lingkungan pengujian tersebut.WP_DEBUG“Mode sangat penting dalam proses pengembangan untuk menemukan dan memperbaiki kesalahan. Anda dapat menggunakannya di situs web Anda…”wp-config.phpDalam file tersebut, hal tersebut dilakukan dengan cara mendefinisikan (defining) sesuatu.define('WP_DEBUG', true);Gunakanlah untuk mengaktifkannya.

Buatlah file plugin pertamamu.

Mari kita mulai dengan membuat plugin yang paling sederhana; plugin ini akan menampilkan pemberitahuan khusus di panel administrasi situs web.

推荐阅读 Panduan Pengembangan Plugin WordPress: Membuat Fitur Eksklusif Anda dari Nol hingga Satu.。

Membuat file utama plugin dan header komentar

Pertama-tama, di dalam direktori instalasi WordPress Anda…wp-content/pluginsDalam folder tersebut, buatlah sebuah folder baru dengan nama…my-first-pluginDalam folder tersebut, buatlah sebuah file PHP dengan nama yang sama.my-first-plugin.php。

UltaHost – Hosting untuk WordPress

Jaminan pengembalian uang dalam 30 hari, bandwidth dan basis data yang tidak terbatas, perlindungan DDoS gratis, diskon 50% untuk pembelian selama 3 tahun (dari harga normal: 50%).

halaman akses

Buka file ini, lalu masukkan kode penjelasan (metadata) plugin berikut sesuai standar yang ditentukan. Informasi tersebut akan ditampilkan di halaman pengelolaan plugin (Plugins) di panel administrasi WordPress.

<?php
/**
 * Plugin Name:       我的第一个插件
 * Plugin URI:        https://example.com/my-first-plugin
 * Description:       这是一个学习WordPress插件开发的入门示例。
 * Version:           1.0.0
 * Author:            你的名字
 * Author URI:        https://example.com
 * License:           GPL v2 or later
 * Text Domain:       my-first-plugin
 * Domain Path:       /languages
 */

Setelah menyimpan file tersebut, masuklah ke halaman “Plugin” di panel administrasi WordPress. Anda seharusnya dapat melihat “My First Plugin” muncul dalam daftar plugin. Aktifkan plugin tersebut. Meskipun plugin tersebut belum menjalankan fungsi apa pun, ia telah berhasil diunduh dan dimuat oleh WordPress.

Membangun fungsi notifikasi dasar di backend

Sekarang, kita akan menambahkan fitur pertama untuk plugin ini: menampilkan pesan selamat datang di bagian atas halaman administrasi. Kita akan menggunakan fitur yang tersedia di WordPress.admin_notices“Hook.” Di dalam file utama plugin tersebut, tepat di bawah bagian komentar, tambahkan kode berikut:

// 在管理后台显示自定义通知
function mfp_show_admin_notice() {
    ?>
    <div class="notice notice-success is-dismissible">
        <p><?php _e( '欢迎使用“我的第一个插件”！', 'my-first-plugin' ); ?></p>
    </div>
    &lt;?php
}
add_action( &#039;admin_notices&#039;, &#039;mfp_show_admin_notice&#039; );

Penjelasan kode: Kami telah membuat sebuah file kode yang diberi nama…mfp_show_admin_noticeFungsi tersebut menghasilkan kode notifikasi HTML yang sesuai dengan format backend WordPress. Gunakanlah fungsi tersebut sesuai kebutuhan Anda._e()Fungsi tersebut dirancang untuk mendukung proses internasionalisasi (i18n) di masa depan. Akhirnya, melalui…add_action()Fungsi tersebut menggantungkan fungsi kustom kita ke dalam sistem WordPress.admin_noticesPada “kait” ini. Setelah menyimpan file, lakukan pembaruan halaman backend WordPress, dan Anda akan melihat pesan peringatan berwarna hijau yang menunjukkan keberhasilan.

推荐阅读 Panduan Lengkap untuk Mengembangkan Plugin WordPress: Dari Nol hingga Tutorial Praktis Tingkat Lanjut.。

Mengembangkan Fungsi Inti dari Plugin secara Mendalam

Setelah memahami struktur dasarnya, kita dapat mengembangkan fitur yang lebih praktis. Salah satu kebutuhan yang umum adalah menambahkan teks kustom secara otomatis di akhir isi artikel.

Menggunakan filter untuk memodifikasi isi artikel

WordPress menyediakan banyak “filter” untuk memodifikasi berbagai jenis data. Untuk menambahkan teks di akhir isi artikel, kita akan menggunakan salah satu filter tersebut.the_contentFilter. Tambahkan fungsi baru berikut ke dalam file utama plugin:

// 在文章内容末尾添加自定义文本
function mfp_append_to_content( $content ) {
    // 确保只在主循环的单篇文章页面执行
    if ( is_single() && in_the_loop() && is_main_query() ) {
        $custom_text = '<div class="my-plugin-footer"><p>Terima kasih telah membaca! Artikel ini disajikan untuk Anda oleh “My First Plugin”.</p></div>';
        $content .= $custom_text;
    }
    return $content;
}
add_filter( 'the_content', 'mfp_append_to_content' );

Fungsi ini menerima data asli (original data).$contentDengan menggunakan penilaian kondisi, kami memastikan bahwa teks HTML khusus kami hanya ditambahkan pada halaman artikel yang bersangkutan dan hanya ketika halaman tersebut merupakan hasil dari kueri utama. Setelah modifikasi selesai, konten yang telah diubah dikembalikan. Metode ini bersifat non-invasif, sehingga tidak mengubah isi asli dalam basis data.

hosting.com hosting bersama

Kinerja tinggi, dilengkapi dengan CPU AMD EPYC, penyimpanan SSD NVMe, dan LiteSpeed, dukungan internal ahli 24 jam sehari, langkah-langkah keamanan canggih termasuk SSL, brute force, malware, dan perlindungan DDoS, menghemat hingga 731 TB/bulan.

halaman akses

Membuat halaman pengaturan manajemen yang sederhana

Agar pengguna dapat menyesuaikan teks yang ingin ditambahkan di akhir artikel, kita perlu membuat halaman pengaturan untuk plugin tersebut. Proses ini melibatkan beberapa langkah, yaitu: mendaftarkan menu yang digunakan untuk mengakses halaman pengaturan, membuat fungsi pemanggil (callback function) untuk halaman tersebut, serta memproses data yang dikirim melalui formulir.

Pertama, gunakanadmin_menuTambahkan halaman menu anak ke dalam fitur “kuk” (hook):

// 添加插件设置菜单到后台
function mfp_add_admin_menu() {
    add_options_page(
        '我的第一个插件设置', // 页面标题
        '我的插件设置',       // 菜单标题
        'manage_options',    // 权限要求
        'my-first-plugin',   // 菜单slug
        'mfp_options_page_html' // 显示页面内容的回调函数
    );
}
add_action( 'admin_menu', 'mfp_add_admin_menu' );

Selanjutnya, definisikan fungsi panggilan balik (callback function).mfp_options_page_htmlBerikut adalah kode HTML untuk halaman pengaturan yang akan digunakan untuk merender formulir. Kita juga perlu menggunakan API pengaturan WordPress untuk mendaftarkan, menyimpan, dan mengambil opsi secara aman. Untuk kesederhanaan, berikut adalah versi yang disederhanakan dari implementasinya:

推荐阅读 Panduan Lengkap Pengembangan Plugin WordPress: Dari Pemula hingga Membangun Ekstensi Tingkat Profesional.。

// 设置页面的HTML内容
function mfp_options_page_html() {
    // 检查用户权限
    if ( !current_user_can( 'manage_options' ) ) {
        return;
    }
    ?>
    <div class="wrap">
        <h1>\n</h1>
        <form action="/id/options.php/" method="post" data-trp-original-action="options.php">
            <?php
            // 输出设置字段、非ce等安全字段
            settings_fields( 'mfp_options_group' );
            do_settings_sections( 'my-first-plugin' );
            submit_button( '保存设置' );
            ?>
        <input type="hidden" name="trp-form-language" value="id"/></form>
    </div>
    <?php
}

// 初始化插件设置
function mfp_settings_init() {
    // 注册一个设置
    register_setting( 'mfp_options_group', 'mfp_footer_text' );

// 添加一个设置区域
    add_settings_section(
        'mfp_section',
        '自定义文本设置',
        null,
        'my-first-plugin'
    );

// 向区域中添加字段
    add_settings_field(
        'mfp_field_footer',
        '文章页脚文本',
        'mfp_field_footer_html',
        'my-first-plugin',
        'mfp_section'
    );
}
add_action( 'admin_init', 'mfp_settings_init' );

// 渲染文本输入字段
function mfp_field_footer_html() {
    $option = get_option( 'mfp_footer_text', '感谢阅读！本文由“我的第一个插件”为您呈现。' );
    ?>
    <input type='text' name='mfp_footer_text' value='<?php echo esc_attr( $option ); ?>' class='regular-text'>
    <p class="description">Konten yang dimasukkan di sini akan ditampilkan di akhir setiap artikel.</p>
    \n&lt;?php
}

Terakhir, modifikasi yang telah dilakukan sebelumnya…mfp_append_to_contentFungsi tersebut memungkinkan pengambilan data dari opsi database.mfp_footer_textTeks dibaca dari sumber tertentu, bukan dari teks yang telah dikodekan secara tetap (hard-coded).

Keamanan plugin, optimisasi, dan persiapan untuk penerbitan

Pada tahap terakhir pengembangan, perlu diperhatikan aspek keamanan, kualitas kode, dan proses penyebaran (deployment), agar plugin tersebut dapat berfungsi dengan baik dan stabil.

Hosting bersama InterServer.

Hosting bersama seharga $2,50 USD per bulan, diskon $0,1 USD untuk bulan pertama dengan kode promo tryinterserver, serta 461 skrip aplikasi cloud yang dapat diinstal dengan sekali klik.

halaman akses

Mengikuti praktik terbaik keamanan

Semua input dari pengguna harus di-escapasi atau diverifikasi sebelum ditampilkan di browser atau disimpan ke dalam basis data. Saat menampilkan hasil, gunakan…esc_html()、esc_attr()、esc_url()Fungsi-fungsi seperti ini digunakan saat menangani pengiriman formulir atau permintaan AJAX.wp_verify_nonce()和check_admin_referer()Untuk memverifikasi keabsahan sebuah permintaan dan mencegah serangan jenis Cross-Site Request Forgery (CSRF), jangan pernah langsung mempercayai data yang dikirimkan dalam permintaan tersebut.$_GET、$_POST或$_REQUESTData yang terdapat di dalamnya.

Mengimplementasikan dukungan internasionalisasi (internationalization).

Agar plugin dapat digunakan oleh pengguna di seluruh dunia, semua string yang ditujukan untuk pengguna dalam kode perlu diinternasionalisasi. Kita sudah melakukannya dalam contoh-contoh sebelumnya._e()Gunakan fungsi untuk menghasilkan teks terjemahan. Selain itu, Anda perlu menyatakan hal tersebut di dalam komentar header plugin.Text Domain和Domain Path。
Saat plugin diinisialisasi (misalnya melalui…)plugins_loaded(K Hook), digunakan untuk…load_plugin_textdomain()Fungsi untuk memuat file bahasa:

function mfp_load_textdomain() {
    load_plugin_textdomain( 'my-first-plugin', false, dirname( plugin_basename( __FILE__ ) ) . '/languages/' );
}
add_action( 'plugins_loaded', 'mfp_load_textdomain' );

Kemudian, Anda dapat menggunakan alat seperti Poedit untuk mengekstrak string dari kode sumber plugin tersebut.__()， _e()String yang dibungkus oleh fungsi-fungsi seperti (…).potFile template, digunakan oleh penerjemah untuk membuat terjemahan..po和.moDokumen.

Organisasi Kode dan Pertimbangan Kinerja (Code Organization and Performance Considerations)

Seiring dengan bertambahnya fitur plugin, tidak seharusnya semua kode disimpan dalam satu file utama. Pendekatan yang tepat adalah membagi kode ke dalam modul-modul fungsional yang berbeda, sesuai dengan kegunaannya..phpFile tersebut berisi berbagai konten, dan file utama dapat secara selektif memasukkan (mengandung) bagian-bagian tertentu dari file tersebut. Sebagai contoh, Anda dapat membuat…includes/admin/Direktori tersebut berisi kode terkait bagian belakang (backend) dari aplikasi.includes/public/Tempat untuk menyimpan kode terkait front end (bagian pengguna interface).includes/class-*.phpTempat untuk menyimpan definisi kelas (class definitions).
Untuk operasi yang membutuhkan banyak sumber daya, pertimbangkan untuk menggunakan fitur cache sementara (Transients API) di WordPress untuk menyimpan hasil dari kueri yang memakan waktu, atau gunakan fitur tugas terjadwal (Cron API) untuk menangani tugas-tugas yang tidak perlu segera diselesaikan di latar belakang. Pastikan bahwa plugin tersebut dapat diunduh dengan benar saat dinonaktifkan, melalui mekanisme hook pengunduhan yang telah diatur sebelumnya.register_uninstall_hook()Bersihkan data dan opsi yang telah dibuat, agar situs tetap rapi dan teratur.

Menyimpulkan.

Dalam tutorial ini, kita telah menyelesaikan proses pembuatan sebuah plugin WordPress yang memiliki fungsi yang lengkap, mulai dari awal hingga akhir. Kita memulai dengan memahami struktur dasar plugin dan membangun lingkungan pengembangan, lalu membuat berkas utama yang berisi header komentar standar. Setelah itu, kita melakukan proses pengembangan dengan cara “menggantungkan” (mounting) komponen-komponen plugin tersebut ke dalam struktur aplikasi WordPress.admin_notices和the_contentDua hook inti ini memungkinkan terlaksananya notifikasi dari backend dan penampilan teks di bagian kaki artikel. Untuk meningkatkan kepraktisan plugin, kami juga memperkenalkan API pengaturan WordPress dan membuat halaman manajemen yang memungkinkan pengguna untuk mengatur teks secara khusus. Selain itu, kami membahas praktik keamanan yang sangat penting dalam pengembangan plugin, dukungan terhadap berbagai bahasa (internasionalisasi), serta pengoptimalan struktur kode. Proses ini dengan jelas menunjukkan paradigma utama dalam pengembangan plugin WordPress: memanfaatkan hook dan filter yang tersedia untuk menambahkan fitur baru, mengikuti spesifikasi API dalam pembuatan antarmuka pengguna, serta selalu mengutamakan aspek keamanan dan kemudahan pemeliharaan kode. Dengan memahami dasar-dasar ini, Anda sudah siap untuk mengeksplorasi dunia pengembangan plugin yang lebih kompleks.

FAQ - Pertanyaan yang Sering Diajukan.

Apa saja pengetahuan dasar yang diperlukan untuk mengembangkan plugin WordPress?

Anda perlu memiliki dasar pemrograman PHP yang kuat, karena kode plugin sebagian besar ditulis dalam PHP. Selain itu, Anda perlu memahami dasar-dasar HTML, CSS, dan JavaScript agar dapat mengelola tampilan dan interaksi di sisi pengguna (front end). Kemampuan dalam memahami konsep-konsep dasar WordPress, seperti tema (themes), jenis artikel (article types), sistem klasifikasi (taxonomy), serta sistem Hook-nya (termasuk Action dan Filter), sangat penting.

###
Apa saja file dasar yang harus dimiliki oleh sebuah plugin WordPress?

Dalam kasus yang paling sederhana, sebuah plugin hanya perlu berisi satu file PHP. Namun, file tersebut harus memuat bagian penjelasan informasi plugin yang sesuai dengan standar WordPress di bagian awalnya, yaitu Plugin Headers, seperti yang ditunjukkan dalam contoh kami.Plugin Name、DescriptionDan bidang-bidang lainnya. Inilah satu-satunya dasar yang digunakan oleh WordPress untuk mengenali plugin tersebut dan menampilkan informasinya dalam daftar pengelolaan plugin.

###
Bagaimana saya sebaiknya menamai fungsi dan variabel dalam plugin saya?

Untuk menghindari konflik dengan kode inti WordPress, tema, atau plugin lainnya, semua fungsi kustom, kelas, variabel, dan konstanta harus menggunakan prefix yang unik. Umumnya disarankan untuk menggunakan prefix yang berkaitan dengan singkatan atau nama plugin tersebut. Seperti yang digunakan dalam contoh kami.mfp_(Mewakili My First Plugin.) Nama kelas juga harus mengikuti aturan ini, dan sebaiknya menggunakan nama lengkap yang bermakna.

###
Apakah tabel basis data atau opsi yang dibuat dalam plugin akan dihapus setelah plugin tersebut dihapus?

Secara default, tidak akan terjadi. Jika Anda melakukannya melalui…add_option()、update_option()Opsi yang dibuat, atau tabel data yang dikustomisasi, akan tetap tersisa di dalam basis data ketika pengguna menghapus file plugin melalui panel administrasi WordPress. Untuk memberikan pengalaman pengunduhan yang lebih bersih (tanpa data yang tidak diperlukan), Anda sebaiknya menggunakan…register_uninstall_hook()Fungsi ini digunakan untuk mendaftarkan sebuah fungsi penanganan balik (callback) yang bertugas membersihkan data. Dalam fungsi tersebut, semua opsi yang terkait dengan plugin, tabel basis data, serta cache sementara akan dihapus.

###
Bagaimana cara membuat plugin saya kompatibel dengan lebih banyak versi WordPress?

Di dalam kode, hindari penggunaan versi PHP atau fungsi khusus WordPress yang terlalu baru. Sebelum menggunakan suatu fungsi, kelas, atau hook, pastikan terlebih dahulu untuk membaca dokumentasi resminya untuk mengetahui versi WordPress mana fungsi tersebut diperkenalkan. Anda dapat melakukan hal ini dengan menambahkan catatan di bagian header file utama plugin Anda.Requires at least:Deklarasi bidang tersebut mencantumkan versi WordPress minimum yang didukung. Dalam kode, hal ini dapat digunakan bersamaan dengan pernyataan kondisional untuk memastikan bahwa fitur tertentu hanya akan berfungsi jika versi WordPress yang digunakan lebih tinggi dari versi minimum yang ditentukan.function_exists()或class_exists()Periksa untuk menyediakan solusi pengganti (degradasi) atau pesan peringatan yang ramah (friendly message).