Panduan Lengkap Pengembangan Plugin WordPress: Membangun Plugin Fungsional Pertama Anda Dari Nol

Mempersiapkan dan mengonfigurasi lingkungan.

Sebelum memulai menulis kode, Anda memerlukan lingkungan pengembangan yang sesuai. Ini mencakup instalasi WordPress lokal, sebuah editor kode, serta pengetahuan dasar yang diperlukan.

Pertama-tama, pastikan Anda memiliki lingkungan server lokal. Anda dapat menggunakan alat-alat seperti XAMPP, MAMP, Local by Flywheel, atau Docker untuk membangunnya dengan cepat. Setelah menginstal dan mengonfigurasi WordPress, Anda akan memiliki lingkungan yang aman (seperti “sandbox”) di mana Anda dapat melakukan pengujian tanpa perlu khawatir akan mempengaruhi situs web yang berjalan di internet.

Kedua, Anda memerlukan editor kode yang nyaman dan efisien untuk digunakan. Visual Studio Code,PhpStorm, atau Sublime Text semuanya merupakan pilihan yang sangat baik. Editor-editor tersebut memberikan dukungan yang baik untuk bahasa pemrograman PHP, HTML, JavaScript, dan CSS, serta dilengkapi dengan fitur seperti penyorotan kode (code highlighting), autocompletion (pembuatan kode secara otomatis), dan alat debugging (pemecahan masalah dalam kode).

推荐阅读 Dari Nol hingga Satu: Panduan Memulai dan Praktik Terbaik untuk Mengembangkan Plugin WordPress.。

Terakhir, memahami struktur dasar plugin WordPress sangat penting. Sebuah plugin pada dasarnya merupakan satu atau lebih file PHP yang disimpan dalam direktori instalasi WordPress. /wp-content/plugins/ Di dalam folder tersebut, setiap plugin harus memiliki sebuah file utama yang berisi informasi header khusus untuk plugin tersebut, yang digunakan untuk memberitahu sistem WordPress tentang keberadaan dan fungsi plugin tersebut.

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

Pembuatan dan Pernyataan File Utama Plugin

Langkah pertama dalam membuat sebuah plugin adalah membuat berkas utama (main file) dan menambahkan komentar header yang sesuai. Berkas ini biasanya diberi nama sesuai dengan fungsi plugin tersebut, misalnya… my-first-plugin.phpSilakan lakukan hal tersebut di lingkungan lokal Anda. /wp-content/plugins/ Buatlah sebuah folder baru di dalam direktori tersebut, dan beri nama folder tersebut… my-first-pluginKemudian, buat file utama di dalam folder tersebut.

Header plugin merupakan kumpulan metode informasi tentang plugin tersebut, yang memberitahu WordPress nama plugin, deskripsi, versi, penulis, dan lainnya. Berikut adalah contoh header plugin yang paling dasar:

<?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
 * Domain Path:       /languages
 */

Setelah menyimpan file tersebut, masuk ke panel administrasi WordPress Anda, lalu kunjungi halaman “Plugin”. Anda seharusnya melihat sebuah plugin baru dengan nama “My First Feature Plugin” yang muncul di daftar plugin. Anda dapat mengaktifkannya, meskipun plugin ini belum memiliki fungsi apa pun untuk saat ini.

Core Architecture: Action and Filter Hooks

Inti dari kemampuan ekspansi yang kuat pada WordPress terletak pada sistem Hook-nya, yang memungkinkan pengembang untuk menyisipkan kode mereka pada titik waktu tertentu, atau sebelum/después penggunaan data. Hook terbagi menjadi dua jenis: Action dan Filter.

推荐阅读 Panduan Dasar Pengembangan Tema WordPress: Membangun Template Situs Web Khusus Anda Dari Nol。

Action hooks memungkinkan Anda untuk menjalankan fungsi kustom saat peristiwa tertentu di WordPress terjadi. Misalnya, saat sebuah artikel diterbitkan (when an article is published).publish_post), saat memuat menu di backend pengelolaan (admin_menu) atau saat skrip diunduh dan dijalankan di bagian atas halaman web (header of the web page).wp_enqueue_scriptsGunakan. add_action() Fungsi tersebut digunakan untuk memasang (menghubungkan) fungsi Anda ke “action hook” yang tersedia.

Gunakan action hook untuk menambahkan menu latar belakang (background menu).

Misalkan kita ingin menambahkan halaman pengaturan untuk sebuah plugin ke dalam panel administrasi WordPress. Kita akan menggunakan… admin_menu “Action Hook” ini: tambahkan kode berikut ke dalam file utama Anda, setelah informasi header plugin:

// 在管理后台添加菜单
function mfp_add_admin_menu() {
    add_menu_page(
        '我的插件设置',          // 页面标题
        '我的插件',             // 菜单标题
        'manage_options',       // 所需权限
        'my-first-plugin',      // 菜单 slug
        'mfp_settings_page',    // 用于显示页面内容的回调函数
        'dashicons-admin-generic', // 图标（可选）
        80                     // 菜单位置（可选）
    );
}
add_action( 'admin_menu', 'mfp_add_admin_menu' );

// 设置页面的回调函数
function mfp_settings_page() {
    ?>
    <div class="wrap">
        <h1>\n</h1>
        <p>Selamat datang di halaman pengaturan untuk plugin pertama saya!</p>
    </div>
    \n&lt;?php
}

Filter hooks memungkinkan Anda untuk memodifikasi data. Mereka menerima sebuah nilai, yang setelah diproses oleh fungsi Anda, harus mengembalikan nilai yang telah dimodifikasi. Sebagai contoh, modifikasi judul artikel.the_titleMengubah isi artikel (modifying the content of an article).the_content) atau mengubah panjang kutipan (excerpt_lengthGunakan. add_filter() Fungsi tersebut digunakan untuk memasang (menghubungkan) fungsi Anda ke “hook” filter.

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

Menggunakan filter untuk memodifikasi isi artikel

Mari kita buat sebuah fitur sederhana: menambahkan pernyataan hak cipta secara otomatis di akhir setiap isi artikel.

// 在文章内容后添加自定义文本
function mfp_add_copyright_to_content( $content ) {
    // 仅对网站前端的主循环中的文章生效
    if ( is_single() && in_the_loop() && is_main_query() ) {
        $custom_text = '<p><em>Pernyataan Hak Cipta: Isi artikel ini milik situs kami. Mohon cantumkan sumbernya jika Anda ingin mengutip atau membagikannya.</em></p>';
        $content .= $custom_text;
    }
    return $content;
}
add_filter( 'the_content', 'mfp_add_copyright_to_content' );

Implementing specific functionality: Abbreviations and short codes

Shortcode adalah fitur yang sangat berguna yang disediakan oleh WordPress, yang memungkinkan pengguna untuk memasukkan tag sederhana ke dalam artikel atau halaman, sehingga dapat melakukan berbagai tindakan tertentu. [my_shortcode]Hal ini memungkinkan konten dinamis yang kompleks untuk dihasilkan atau fungsi-fungsi tertentu untuk dijalankan. Hal tersebut memberikan fleksibilitas yang sangat besar bagi para pencipta konten.

Buatlah dan daftarkan sebuah kode singkat yang sederhana.

Membuat sebuah kode singkat (shortcut code) memerlukan dua langkah: pertama, mendefinisikan fungsi untuk memproses kode singkat tersebut, dan kedua, menggunakannya. add_shortcode() Fungsi tersebut mendaftarkannya ke dalam WordPress. Mari kita buat sebuah kode singkat yang menampilkan tanggal saat ini dan ucapan selamat.

推荐阅读 Dari Pemula Hingga Ahli: Panduan Lengkap dan Tutorial Praktis Pengembangan Plugin WordPress。

// 定义简码的处理函数
function mfp_show_greeting_shortcode( $atts ) {
    // 使用 shortcode_atts 定义默认参数，并合并用户传入的参数
    $atts = shortcode_atts(
        array(
            'name' => '访客',
        ),
        $atts,
        'greeting'
    );

// 获取当前时间
    $current_time = current_time( 'mysql' );
    $hour = date( 'H', strtotime( $current_time ) );

// 根据时间生成问候语
    if ( $hour < 12 ) {
        $greeting = '上午好';
    } elseif ( $hour < 18 ) {
        $greeting = '下午好';
    } else {
        $greeting = '晚上好';
    }

// 构建输出
    $output = &#039;<div class="mfp-greeting">'$output .= sprintf( '<p>%s, %s!</p>'`, esc_html($atts['name'])), esc_html($greeting));  
    $output .= sprintf('<p>Waktu saat ini adalah: %s</p>'`, esc_html($current_time));  
    $output .= '</div>';

return $output;
}
// 注册简码，第一个参数是用户使用的标签名
add_shortcode( 'greeting', 'mfp_show_greeting_shortcode' );

Sekarang, pengguna dapat menggunakan fitur ini di editor artikel. [greeting name="张三"]Pada halaman tersebut, akan muncul pesan: “Zhang San, selamat siang! Waktu saat ini adalah: 2026-...”. Jika tidak ada parameter yang diberikan, maka secara default akan digunakan istilah “Pengunjung”.

Praktik Lanjutan: Membuat Tabel Basis Data dan Halaman Opsi

Plugin yang lebih kompleks mungkin memerlukan penyimpanan data sendiri. WordPress menyediakan dua metode utama untuk hal ini: menggunakan WordPress Options API untuk menyimpan data berupa pasangan kunci-nilai yang sederhana, atau membuat tabel basis data khusus untuk menyimpan data yang terstruktur.

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

Menggunakan API opsi untuk menyimpan pengaturan

API opsi sangat cocok untuk menyimpan informasi konfigurasi plugin. Kami akan menyempurnakan halaman pengaturan backend yang telah kami buat sebelumnya, sehingga dapat menyimpan dan membaca pengaturan yang sederhana.

Pertama-tama, kita perlu membuat sebuah formulir. mfp_settings_page() Dalam fungsi tersebut, tambahkan sebuah formulir sederhana untuk memproses pengaturan:

function mfp_settings_page() {
    // 检查用户是否提交了表单
    if ( isset( $_POST['mfp_submit_settings'] ) ) {
        // 安全检查：验证 nonce
        if ( ! isset( $_POST['mfp_settings_nonce'] ) || ! wp_verify_nonce( $_POST['mfp_settings_nonce'], 'mfp_save_settings' ) ) {
            wp_die( '安全验证失败！' );
        }
        // 权限检查
        if ( ! current_user_can( 'manage_options' ) ) {
            wp_die( '权限不足！' );
        }
        // 清理并保存选项
        $custom_message = sanitize_textarea_field( $_POST['custom_message'] );
        update_option( 'mfp_custom_message', $custom_message );
        echo '<div class="notice notice-success is-dismissible"><p>Pengaturan telah disimpan!</p></div>';
    }

// 从数据库读取现有值
    $saved_message = get_option( 'mfp_custom_message', '这是默认的欢迎信息。' );
    ?&gt;
    <div class="wrap">
        <h1>\n</h1>
        <form method="post" action="" data-trp-original-action="">
            <?php wp_nonce_field( 'mfp_save_settings', 'mfp_settings_nonce' ); ?>
            <table class="form-table">
                <tr>
                    <th scope="row"><label for="custom_message">Pesan Khusus:</label></th>
                    <td>
                        <textarea name="custom_message" id="custom_message" rows="5" cols="50" class="large-text"><?php echo esc_textarea( $saved_message ); ?></textarea>
                        <p class="description">Teks ini akan ditampilkan saat kode sederhana [show_message] digunakan.</p>
                    </td>
                </tr>
            </table>
            <?php submit_button( '保存更改', 'primary', 'mfp_submit_settings' ); ?>
        <input type="hidden" name="trp-form-language" value="id"/></form>
    </div>
    \n&lt;?php
}

Kemudian, kami membuat kode singkat baru untuk menampilkan pesan yang telah disimpan tersebut:

function mfp_show_message_shortcode() {
    $message = get_option( 'mfp_custom_message', '这是默认的欢迎信息。' );
    return '<div class="mfp-custom-message">'`. wp_kses_post( wpautop( '$message' ) ).`'</div>'php
add_shortcode('show_message', 'mfp_show_message_shortcode');

Sekarang, administrator dapat mengatur pesan secara khusus di halaman pengaturan plugin, sementara penulis hanya perlu menggunakan pesan tersebut dalam artikel mereka. [show_message] Cukup gunakan kode singkat untuk mengirimkan pesan tersebut.

Ketika plugin diaktifkan, tabel khusus (custom table) akan dibuat.

Untuk plugin yang memerlukan penyimpanan data relasional yang kompleks, seperti pesanan dan log, mungkin diperlukan pembuatan tabel database sendiri. Proses ini biasanya dilakukan saat plugin diaktifkan. WordPress menyediakan fasilitas untuk melakukan hal tersebut. register_activation_hook Gunakan ini untuk mendefinisikan fungsi yang akan dijalankan saat proses aktivasi berlangsung.

Perhatian: Kode di bawah ini hanyalah contoh saja. Dalam pengembangan nyata, diperlukan mekanisme penanganan kesalahan yang lebih ketat serta lapisan abstraksi basis data yang lebih baik (misalnya…). $wpdbPenggunaan dari … (Use of …).

// 插件激活时运行的函数
function mfp_create_custom_table() {
    global $wpdb;
    $table_name = $wpdb->prefix . 'mfp_plugin_logs'; // 确保表名唯一
    $charset_collate = $wpdb->get_charset_collate();

$sql = "CREATE TABLE IF NOT EXISTS $table_name (
        id mediumint(9) NOT NULL AUTO_INCREMENT,
        log_time datetime DEFAULT CURRENT_TIMESTAMP NOT NULL,
        user_id bigint(20) DEFAULT 0,
        action varchar(255) NOT NULL,
        details text,
        PRIMARY KEY  (id)
    ) $charset_collate;";

// 引入 WordPress 升级 API，用于执行 dbDelta 函数
    require_once( ABSPATH . 'wp-admin/includes/upgrade.php' );
    dbDelta( $sql );
}
// 注册激活钩子
register_activation_hook( __FILE__, 'mfp_create_custom_table' );

Menyimpulkan.

Dengan panduan ini, Anda telah melewati proses inti dalam pengembangan plugin WordPress. Mulai dari membangun lingkungan pengembangan hingga menulis kode dasar plugin, Anda telah belajar cara memperluas fungsi WordPress menggunakan action dan filter hook, menyediakan cara yang fleksibel bagi pengguna untuk memasukkan konten melalui shortcode, serta memahami cara menyimpan pengaturan menggunakan Option API dan membuat tabel basis data khusus. Semua ini merupakan fondasi penting dalam membuat sebuah plugin yang fungsional. Ingatlah bahwa struktur kode yang baik, aspek keamanan (seperti verifikasi nonce dan pemeriksaan hak akses), serta persiapan untuk mendukung penggunaan bahasa internasional (internationalization) merupakan bagian yang tidak terpisahkan dari pengembangan plugin yang profesional. Selanjutnya, Anda dapat mengeksplorasi WordPress REST API, jenis artikel khusus (custom post types), metadata (Meta Boxes), serta standar penggunaan skrip dan gaya tampilan (front-end scripts and styles) untuk membuat plugin yang lebih kompleks dan kuat.

FAQ - Pertanyaan yang Sering Diajukan.

Apakah sebuah plugin hanya boleh memiliki satu file utama?

Bukan begitu. Sebuah plugin dapat berisi beberapa file PHP. Namun, harus ada satu file utama yang berisi informasi header plugin; file ini merupakan pintu masuk bagi WordPress untuk mengenali plugin tersebut. Plugin yang kompleks biasanya mengorganisir kode dengan fungsi yang berbeda ke dalam beberapa file, dan kode tersebut diintegrasikan melalui file utama, sehingga memungkinkan manajemen kode yang lebih baik dan pendekatan yang lebih termodulasi.

Bagaimana cara memproses data yang dikirim oleh pengguna melalui formulir di frontend dengan aman?

Saat memproses data yang dikirim oleh pengguna, diperlukan verifikasi yang ketat, pembersihan (cleaning), dan proses penggantian karakter khusus (escaping). Untuk data yang dimasukkan, gunakan metode yang sesuai untuk memastikan keamanan dan kualitas data tersebut. sanitize_text_field()、sanitize_email()、sanitize_textarea_field() Gunakan fungsi-fungsi tertentu untuk melakukan pembersihan data. Untuk data yang akan ditampilkan di halaman HTML, gunakan… esc_html()、esc_attr() 或 wp_kses_post() Lakukan proses “escaping” (penghindaran dari interpretasi yang salah terhadap karakter tertentu). Selain itu, pastikan untuk menggunakan mekanisme nonce (numerical identifier) dari WordPress untuk mencegah penipuan melalui permintaan antar-situs (cross-site requests). current_user_can() Periksa hak akses pengguna.

Bagaimana cara agar plugin saya tidak mengalami konflik nama fungsi dengan plugin lain?

Praktik terbaik adalah menggunakan namespace (PHP 5.3+) atau menempatkan semua fungsi, kelas, dan konstanta di bawah sebuah prefiks yang unik. Misalnya, semua fungsi dalam panduan ini diawali dengan “mfp_” (singkatan dari “My First Plugin”). Jika Anda menggunakan pemrograman berorientasi objek, mengenkapsulasi kode dalam kelas juga merupakan cara yang efektif untuk menghindari konflik penamaan.

Setelah pengembangan selesai, bagaimana cara mendistribusikan atau mengunggah plugin tersebut ke direktori resmi?

Untuk mengirimkan plugin ke direktori plugin resmi WordPress.org, Anda perlu membuat paket plugin yang memenuhi standar yang ditetapkan oleh WordPress. Paket plugin tersebut umumnya mencakup struktur berkas yang terstandarisasi, seperti… README.txtAnda perlu mengajukan akun pengembang di WordPress.org, kemudian menggunakan alat SVN untuk mengirimkan kode ke repositori kode yang ditentukan. Selain itu, diperlukan dukungan terjemahan yang lengkap dan pernyataan mengenai kompatibilitas, serta memastikan bahwa kode tersebut mematuhi standar pengkodean WordPress.