Struktur dasar dan pembuatan plugin WordPress.

Struktur dasar dan pembuatan plugin WordPress.

Membangun sebuah plugin untuk WordPress dimulai dengan sebuah file PHP yang sederhana. File utama ini harus memuat komentar header tertentu, agar WordPress dapat mengenali file tersebut dan mengelolanya sebagai sebuah plugin. Plugin yang paling dasar bisa hanya terdiri dari satu file saja. my-first-plugin.php。

<?php
/**
 * Plugin Name: 我的第一个插件
 * Plugin URI:  https://example.com/my-first-plugin
 * Description: 这是一个用于演示的简单WordPress插件。
 * Version:     1.0.0
 * Author:      开发者姓名
 * License:     GPL v2 or later
 * Text Domain: my-first-plugin
 */

Komentar di bagian header file (“Plugin Name”) wajib disertakan, sedangkan informasi lainnya bersifat opsional. Setelah plugin diaktifkan, fungsinya diimplementasikan dengan menjalankan fungsi PHP pada waktu yang tepat. Salah satu cara yang paling umum adalah dengan menggunakan “action hook”. Misalnya, untuk menambahkan teks di bagian footer halaman web, Anda dapat menggunakan… wp_footer Kait (hook).

// 在页脚输出自定义内容
function myplugin_add_footer_text() {
    echo '<p style="text-align:center;">Terima kasih telah menggunakan plugin saya!</p>';
}
add_action( 'wp_footer', 'myplugin_add_footer_text' );

add_action Ini merupakan fungsi inti dari WordPress yang digunakan untuk memasang fungsi kustom ke hook aksi (action hook) yang ditentukan. Direkomendasikan agar direktori plugin ditempatkan di… /wp-content/plugins/your-plugin-name/ Di bawah (bagian yang ditunjuk dengan “di bawah”), selain file utama, juga dapat terdapat file sumber daya lainnya seperti CSS, JavaScript, gambar, dan lainnya.

推荐阅读 Panduan Utama Tema WordPress: Solusi Lengkap dari Pemilihan, Penyesuaian, hingga Pengembangan.。

Bagaimana cara menambahkan menu pengelolaan untuk plugin?

Untuk membuat plugin memiliki halaman pengaturan di backend WordPress, Anda perlu menambahkan menu administrasi untuk plugin tersebut. Hal ini biasanya dilakukan dengan… admin_menu Dilakukan dengan menggunakan “action hook” (pengait aksi).

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

Fungsi inti (core function) add_menu_page Digunakan untuk menambahkan sebuah menu utama beserta halaman pengaturannya di sidebar sisi belakang (backend).

function myplugin_add_admin_menu() {
    add_menu_page(
        '我的插件设置',      // 页面标题
        '我的插件',          // 菜单标题
        'manage_options',    // 所需权限
        'myplugin-settings', // 菜单slug
        'myplugin_settings_page', // 显示页面的回调函数
        'dashicons-admin-generic', // 图标（可选）
        6                    // 菜单位置（可选）
    );
}
add_action( 'admin_menu', 'myplugin_add_admin_menu' );

// 设置页面的HTML内容
function myplugin_settings_page() {
    ?>
    <div class="wrap">
        <h1>\n</h1>
        <form action="/id/options.php/" method="post" data-trp-original-action="options.php">
            <?php
            settings_fields( 'myplugin_options' ); // 输出安全字段
            do_settings_sections( 'myplugin-settings' ); // 输出设置区域
            submit_button(); // 输出提交按钮
            ?>
        <input type="hidden" name="trp-form-language" value="id"/></form>
    </div>
    \n&lt;?php
}

Setelah membuat menu, langkah selanjutnya adalah menggunakan API pengaturan (settings API) dari WordPress untuk mendefinisikan opsi-opsi yang dapat dikonfigurasi secara spesifik.

Menggunakan API pengaturan untuk menyimpan konfigurasi plugin

Mengelola proses pengiriman formulir dan verifikasi keamanan secara manual merupakan tugas yang merepotkan dan rentan terhadap kesalahan. API pengaturan (settings API) di WordPress menyediakan metode yang terstandarisasi untuk mendaftarkan, menampilkan, serta menyimpan pengaturan tersebut. Proses ini terutama melibatkan tiga fungsi utama:register_setting, add_settings_section 和 add_settings_field。

Berikut adalah contoh yang menunjukkan cara mendaftarkan sebuah grup opsi (option group) dan menambahkan sebuah bidang teks (text field).

推荐阅读 Panduan Optimasi Kinerja Situs WordPress: Analisis Mendalam dan Strategi Praktis.。

function myplugin_settings_init() {
    // 注册一个新的设置项到数据库 `wp_options` 表中
    register_setting( 'myplugin_options', 'myplugin_settings' );

    // 在设置页面添加一个新的区域
    add_settings_section(
        'myplugin_section_basic', // 区域ID
        '基础设置',                // 区域标题
        'myplugin_section_callback', // 区域说明的回调函数
        'myplugin-settings'       // 对应的页面slug
    );

    // 在区域中添加一个字段
    add_settings_field(
        'myplugin_field_text',    // 字段ID
        '示例文本',                // 字段标题
        'myplugin_field_text_cb', // 字段HTML输出的回调函数
        'myplugin-settings',      // 页面slug
        'myplugin_section_basic'  // 区域ID
    );
}
add_action( 'admin_init', 'myplugin_settings_init' );

// 区域说明的回调函数
function myplugin_section_callback() {
    echo '<p>Ini adalah area pengaturan dasar untuk plugin.</p>';
}

// 文本字段的回调函数
function myplugin_field_text_cb() {
    // 从数据库中获取之前保存的设置值
    $options = get_option( 'myplugin_settings' );
    $value = $options['myplugin_field_text'] ?? ''; // 使用空合并运算符提供默认值
    // 输出HTML输入框
    echo '<input type="text" name="myplugin_settings[myplugin_field_text]" value="' . esc_attr( $value ) . '" class="regular-text">'; echo '
    echo '<p class="description">Silakan masukkan beberapa contoh teks.</p>';
}

Nilai pengaturan yang disimpan dengan cara ini dapat digunakan di mana saja dalam kode plugin. get_option('myplugin_settings') Dapatkan dan gunakan dengan aman.

Keamanan dan praktik terbaik dalam pengembangan plugin

Keamanan merupakan hal yang sangat penting dalam pengembangan plugin. Sebuah plugin yang tidak aman dapat menjadi celah keamanan bagi seluruh situs web. Prinsip utama yang perlu dipegang adalah: Jangan pernah mempercayai input dari pengguna. Semua data yang berasal dari pengguna atau sumber eksternal harus diverifikasi, dibersihkan, atau di-escapase (dilindungi dari interpretasi yang salah) sebelum dimasukkan ke dalam basis data, sistem berkas, atau ditampilkan di halaman web.

Data Validation and Cleaning

Verifikasi adalah proses memeriksa apakah data yang dimasukkan sesuai dengan format yang diharapkan, misalnya apakah itu alamat email, angka, atau berada dalam rentang tertentu. WordPress menyediakan serangkaian fungsi bantu untuk melakukan hal ini. is_email(), absint()Pembersihan (cleaning) merupakan proses penghapusan karakter-karakter yang tidak sah atau tidak aman dari data, berdasarkan hasil verifikasi yang telah dilakukan sebelumnya. Untuk bidang teks (text fields), berbagai metode dapat digunakan untuk melakukan pembersihan tersebut. sanitize_text_field()。

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

// 在处理表单提交时
$user_input = $_POST['some_field'] ?? ''; // 使用空合并运算符避免未定义索引警告
// 清理输入
$clean_input = sanitize_text_field( $user_input );
// 验证是否是正整数
$clean_id = absint( $_POST['post_id'] );
if ( $clean_id <= 0 ) {
    // 处理无效ID的错误
}

Data yang akan diterjemahkan telah di-ekspos (di-escape) terlebih dahulu agar proses penerjemahan dapat berjalan dengan benar.

Ekspansi (escape) adalah proses untuk memastikan data dihasilkan dengan aman di berbagai konteks, seperti HTML, JavaScript, atau URL. Hal ini sangat penting untuk mencegah serangan jenis Cross-Site Scripting (XSS). WordPress menyediakan berbagai fungsi ekspansi yang kuat untuk membantu melakukan proses tersebut.
* esc_html()“:” digunakan untuk meng-ekspos (menghindari interpretasi) konten HTML, sehingga tag-tag HTML di dalamnya tidak akan diinterpretasikan oleh sistem.
* esc_attr()`: Digunakan untuk mengantisipasi (meng-ekspos) nilai atribut dari tag HTML yang bersifat spesial (misalnya, tag yang digunakan untuk menampilkan kode HTML).
* esc_url()“:” digunakan untuk mengantisipasi karakter khusus dalam URL (Uniform Resource Locator).
* wp_kses_post()Memungkinkan output HTML sebagian secara aman dengan menggunakan kumpulan aturan yang telah didefinisikan.

// 在设置页面或前端输出用户数据时
echo '<div class="notice">'`. esc_html($clean_input)`.'</div>';
echo '<input type="hidden" value="' . esc_attr( $clean_input ) . '">';
echo '<a href="/id/' . esc_url( $user_url ) . '/">tautan (di situs web)</a>';
echo wp_kses_post( $allowed_html_content ); // 允许文章级别的HTML标签

Selain itu, saat memproses kueri database, sebaiknya selalu menggunakan kelas database WordPress. $wpdb Metode pra-pemrosesan tersebut, atau penggunaan API yang lebih canggih seperti… WP_QueryMereka dilengkapi dengan perlindungan terhadap serangan jenis SQL injection (penyisipan kode SQL secara tidak sah). Saat melakukan operasi terhadap file, perlindungan tersebut akan digunakan. wp_upload_dir()、wp_handle_upload() Gunakan API yang sesuai untuk memastikan keamanan path (jalur akses data).

Menggunakan Hook (Pengait) untuk mencapai tingkat keandalan dan skalabilitas yang tinggi

Inti dari sistem plugin WordPress adalah mekanisme “hook” (pautan/konektor), yang terdiri dari “actions” (tindakan) dan “filters” (filter). Mekanisme hook ini memungkinkan plugin untuk mengubah perilaku atau data WordPress tanpa perlu memodifikasi kode inti WordPress, sekaligus memungkinkan pengembang lain untuk memperluas fungsionalitas plugin tersebut.

推荐阅读 Panduan Dasar Pengembangan Tema WordPress: Bangun Tema Kustom Pertamamu Dari Nol。

Kegunaan dan cara membuat “action hook” (pemanggil fungsi tertentu dalam aplikasi)

Action hooks menjalankan sepotong kode pada titik waktu tertentu, dan tidak memerlukan nilai kembalian (return value). Plugin dapat menggunakan ribuan hook bawaan yang disediakan oleh WordPress. init, wp_enqueue_scripts, save_postMereka juga dapat membuat “hook” (fungsi khusus) sendiri yang dapat digunakan oleh pengembang lain.

Kode yang diunggah ke hook tersebut adalah sebagai berikut:

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

// 在文章内容前自动添加一个横幅
function myplugin_prepend_content( $content ) {
    if ( is_single() ) {
        $custom_text = '<div class="myplugin-banner">Ini adalah sebuah iklan.</div>';
        $content = $custom_text . $content;
    }
    return $content;
}
add_filter( 'the_content', 'myplugin_prepend_content' );

Perhatikan: Meskipun kami telah mengubah kontennya, yang digunakan masih merupakan hook filter. the_contentKarena hal tersebut memerlukan pengembalian nilai yang telah dimodifikasi.

Cara membuat hook aksi kustom: do_action Fungsi:

// 在你的插件代码中定义一个动作点
function myplugin_complete_task() {
    // ... 执行一些任务 ...
    // 发出自定义动作，允许其他代码在此处添加功能
    do_action( 'myplugin_after_task_complete', $task_id, $result );
}

Plugin atau tema lainnya dapat diinstal melalui… add_action('myplugin_after_task_complete', 'callback', 10, 2) Untuk merespons tindakan ini…

Prinsip dan Contoh Penggunaan Filter Hooks

Filter hooks digunakan untuk memodifikasi data sebelum data tersebut digunakan. Hook ini menerima sebuah nilai sebagai input, dan harus mengembalikan sebuah nilai (yang mungkin telah dimodifikasi) sebagai output. Ini merupakan cara umum bagi plugin untuk memodifikasi teks, opsi, atau hasil pencarian.

Gunakan filter bawaan:

// 修改文章摘要的长度
function myplugin_excerpt_length( $length ) {
    return 20; // 将摘要字数限制改为20字
}
add_filter( 'excerpt_length', 'myplugin_excerpt_length' );

Membuat hook filter kustom untuk digunakan apply_filters Fungsi:

function myplugin_get_price( $product_id ) {
    $base_price = get_post_meta( $product_id, 'price', true );
    // 应用过滤器，允许其他代码动态修改价格（例如添加税费、折扣）
    $final_price = apply_filters( 'myplugin_product_price', $base_price, $product_id );
    return $final_price;
}

Dengan cara ini, plugin Anda menyediakan antarmuka yang fleksibel, sehingga pengembang lain dapat dengan mudah memodifikasi logika perhitungan harga tanpa perlu langsung mengubah kode sumber plugin Anda.

Internasionalisasi plugin dan manajemen sumber daya skrip

Sebuah plugin WordPress yang matang seharusnya mendukung internasionalisasi, sehingga dapat diterjemahkan ke berbagai bahasa, serta dapat mengelola sumber daya CSS dan JavaScript di bagian frontend dan backend dengan baik.

Menginternasionalisasi plugin.

Internasionalisasi dilakukan dengan menggunakan fungsi khusus untuk membungkus semua string teks yang perlu diterjemahkan. Proses ini melibatkan dua langkah utama: memuat file terjemahan menggunakan bidang teks (text fields), dan menandai string-string yang dapat diterjemahkan dalam kode.

Pertama-tama, definisikan hal tersebut di bagian awal (header) dari file utama plugin. Text Domain(Contohnya, my-first-pluginItulah bidang teks Anda. Kemudian, saat plugin diinisialisasi (biasanya pada…) init (K Hook), digunakan untuk… load_plugin_textdomain Fungsi ini digunakan untuk memuat file terjemahan.

function myplugin_load_textdomain() {
    load_plugin_textdomain(
        'my-first-plugin', // 文本域，必须与文件头一致
        false, // 已弃用参数
        dirname( plugin_basename( __FILE__ ) ) . '/languages' // 语言文件存放的相对路径
    );
}
add_action( 'init', 'myplugin_load_textdomain' );

Dalam kode, gunakan… __() Silakan terjemahkan dan kembalikan string tersebut menggunakan metode yang ditentukan. _e() Silakan terjemahkan teks tersebut, lalu hasilnya ditampilkan langsung sebagai string.

$settings_title = __( 'My Plugin Settings', 'my-first-plugin' );
_e( 'Hello World!', 'my-first-plugin' );

Para pengembang dapat menggunakannya. Poedit Alat-alat tersebut mengekstrak string-string tersebut dari kode sumber dan menghasilkannya. .pot File template. .po 和 .mo File tersebut disimpan di dalam plugin. /languages/ Di bawah menu.

Mengintegrasikan CSS dan JavaScript dengan benar

Jangan pernah mengkodekan nilai secara langsung (hardcode) di dalam file PHP. <link> 或 <script> Tag digunakan untuk memasukkan sumber daya (resource) ke dalam sistem. WordPress menyediakan sistem pengelolaan antrian (enqueue) yang terpadu untuk mengatur ketergantungan sumber daya, kontrol versi, dan waktu pengunduhan (loading).

Untuk sumber daya backend, gunakan… admin_enqueue_scripts Kait (hook).

function myplugin_admin_scripts( $hook ) {
    // 只在特定插件设置页面加载
    if ( $hook != 'toplevel_page_myplugin-settings' ) {
        return;
    }
    wp_enqueue_style(
        'myplugin-admin-style', // 句柄
        plugins_url( 'css/admin-style.css', __FILE__ ), // 文件URL
        array(), // 依赖
        '1.0.0'  // 版本号，可用于强制浏览器更新缓存
    );
    wp_enqueue_script(
        'myplugin-admin-script',
        plugins_url( 'js/admin-script.js', __FILE__ ),
        array( 'jquery' ), // 依赖jQuery
        '1.0.0',
        true // 在页脚加载
    );
}
add_action( 'admin_enqueue_scripts', 'myplugin_admin_scripts' );

Untuk sumber daya front-end, gunakan… wp_enqueue_scripts “Hook” (kait/pengaitan) memiliki logika yang serupa. Hal ini memastikan bahwa sumber daya (resource) diunduh dengan urutan yang tepat, mencegah terjadinya konflik, dan memungkinkan penggunaan cache (penyimpanan sementara) dari browser.

Menyimpulkan.

Pengembangan plugin WordPress merupakan sebuah proses yang sistematis, yang dimulai dengan membuat sebuah file utama yang memenuhi standar tertentu. Proses ini mencakup berbagai aspek, seperti pembuatan antarmuka backend, penanganan keamanan data, pemanfaatan mekanisme hook inti (core hooks), serta dukungan terhadap internasionalisasi (internationalization). Mengikuti praktik terbaik, terutama standar keamanan data yang ketat dan pemahaman yang mendalam tentang mekanisme hook, merupakan kunci untuk mengembangkan plugin yang stabil, aman, dan dapat diperluas (scalable) untuk keperluan komersial. Dengan menggunakan API pengaturan (setting API) dan sumber daya skrip manajemen (management script resources) dengan tepat, kualitas dan pengalaman pengguna plugin dapat ditingkatkan secara signifikan. Para pengembang sebaiknya selalu mempersiapkan fitur terjemahan (translation) dalam kode mereka, agar plugin dapat digunakan di berbagai bahasa dan lingkungan.

FAQ - Pertanyaan yang Sering Diajukan.

Sebuah plugin WordPress yang paling sederhana perlu mencakup elemen-elemen berikut:

Plugin yang paling sederhana hanya memerlukan satu file PHP, dan file tersebut harus memuat komentar header plugin yang standar. Baris komentar yang paling penting di dalamnya adalah “Plugin Name”. Di dalam file ini, Anda dapat langsung menulis kode PHP atau menambahkan fitur melalui mekanisme hook (pengaitan fungsi).

Misalnya, plugin yang hanya berisi kode singkat untuk menghasilkan output “Hello World” juga hanya memerlukan berkas tersebut untuk dapat dijalankan.

Bagaimana plugin berinteraksi dengan basis data WordPress?

Disarankan untuk menggunakan kelas operasi basis data yang sudah tersedia di dalam WordPress. $wpdbHal tersebut menyediakan metode pencarian data yang aman, terutama karena… prepare Metode ini dapat secara efektif mencegah serangan penyerangan jenis SQL injection.

Untuk sebagian besar operasi data (seperti mengambil artikel atau mengedit metadata), lebih disarankan untuk menggunakan fungsi-fungsi terpadu (encapsulated functions) tingkat lanjut dari WordPress. get_posts(), WP_Query, get_post_meta(), update_post_meta() Dengan fungsi-fungsi tersebut, masalah keamanan dan penggunaan cache telah ditangani di tingkat dasar. Untuk struktur data khusus (custom data structures), pengembang dapat membuat tabel data khusus saat plugin diaktifkan.

Di mana saya bisa menemukan semua aksi (actions) dan hook filter yang tersedia?

Dokumen pengembangan resmi WordPress merupakan sumber terbaik untuk mencari informasi mengenai hook (fungsi tambahan yang dapat digunakan dalam sistem WordPress). Selain itu, para pengembang juga dapat mencari hook dengan langsung mencari kode sumber inti WordPress.

Buka direktori akar WordPress di editor kode, lalu cari (search)… do_action 或 apply_filters Pemanggilan fungsi dapat mengidentifikasi semua hook yang telah didefinisikan beserta parameternya. Banyak sumber referensi online juga menyediakan daftar hook yang sering digunakan.

Bagaimana cara mendebug kode plugin WordPress saya?

Pertama-tama, pastikan bahwa di dalam sistem Anda… wp-config.php Debugging mode telah diaktifkan dalam file tersebut: define( 'WP_DEBUG', true );Ini akan memungkinkan penampilan kesalahan dan peringatan PHP. Untuk menghindari informasi kesalahan terlihat oleh pengunjung, Anda dapat mengatur hal tersebut secara bersamaan. define( 'WP_DEBUG_DISPLAY', false ); Dan catatkan kesalahan tersebut ke dalam berkas log:define( 'WP_DEBUG_LOG', true );。

Kedua, gunakan error_log() Fungsi tersebut akan mencatat informasi debug khusus ke dalam berkas log. Untuk struktur data yang kompleks (seperti array atau objek), hal tersebut dapat dilakukan dengan cara yang sesuai. print_r() 或 var_dump() Informasi tersebut hanya boleh dilihat oleh administrator yang telah masuk ke sistem. Untuk memastikan keamanan, gunakan alat debugging PHP profesional seperti Xdebug untuk melakukan proses debugging yang lebih efisien, termasuk penempatan titik henti (breakpoints) dan pelacakan tumpukan eksekusi kode (stack tracing).