Belajar Pengembangan Plugin WordPress Dari Nol: Membangun Fungsi Khusus Pertama Anda

Menguasai pengembangan plugin WordPress merupakan keterampilan inti untuk memperluas fungsi situs web dan memenuhi kebutuhan personalisasi. Hal ini berbeda dengan hanya mengubah tampilan situs (tema). functions.php Dibandingkan dengan menggunakan file biasa, penggunaan plugin memastikan bahwa fungsionalitas suatu aplikasi tetap terpisah dari tema yang digunakan, sehingga memudahkan proses migrasi, manajemen, dan pemeliharaan. Artikel ini akan memandu Anda dari awal untuk membuat sebuah plugin yang memiliki struktur yang lengkap dan memenuhi standar pengkodean WordPress.

Preparasi dan pengaturan lingkungan.

Sebelum menulis baris kode pertama, Anda memerlukan lingkungan pengembangan yang sesuai serta pemahaman dasar tentang arsitektur WordPress.

Konfigurasi Lingkungan Pengembangan

Sebuah lingkungan pengembangan lokal yang standar merupakan fondasi penting untuk pengembangan yang efisien. Kami merekomendasikan penggunaan alat-alat seperti XAMPP, MAMP, atau Local by Flywheel, yang memungkinkan Anda menginstal Apache, MySQL/Nginx, PHP, dan WordPress dengan satu klik saja. Selain itu, pastikan bahwa editor teks atau IDE (seperti VS Code, PhpStorm) yang Anda gunakan mendukung penyorotan sintaks PHP dan fitur prediksi kode (code hints), hal ini akan sangat meningkatkan efisiensi pengembangan.

推荐阅读 Analisis Mendalam Pengembangan Plugin WordPress: Dari Pemula Hingga Penyesuaian yang Efisien。

Memahami arsitektur plugin WordPress

Pada dasarnya, sebuah plugin WordPress terdiri dari satu atau lebih file PHP, yang disimpan di dalam direktori tertentu dalam struktur file WordPress. Direktori tersebut biasanya berada di dalam folder `plugins` yang terletak di dalam direktori utama WordPress. wp-content/plugins/ Berada di dalam direktori tersebut. Prinsip utamanya adalah mekanisme “hook” (pengait). Plugin dapat menjalankan kode pada titik waktu tertentu melalui “action hook”, atau memodifikasi data yang dihasilkan oleh fungsi lain menggunakan “filter hook”. Semoga ini membantu Anda memahaminya. add_action 和 add_filter Kedua fungsi ini merupakan kunci utama untuk memulai pengembangan plugin.

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

Buatlah plugin pertamamu: Alat Penghormatan (Greeting Tool).

Kami akan membuat sebuah plugin sederhana yang bernama “Daily Greeting”. Plugin ini akan menampilkan sebuah alat tambahan (widget) selamat datang yang dapat disesuaikan di panel kontrol (dashboard) backend pengelolaan situs web.

Membuat file utama plugin

Pertama, di wp-content/plugins/ Buatlah sebuah folder baru di dalam direktori tersebut, dan beri nama folder tersebut… my-first-greeting-pluginDalam folder tersebut, buatlah file plugin utama. my-first-greeting-plugin.php。

Setiap plugin harus dimulai dengan komentar header plugin yang standar; ini merupakan penanda yang digunakan oleh WordPress untuk mengenali informasi plugin tersebut. Buka file utama (main file) dan masukkan kode berikut:

<?php
/**
 * Plugin Name: 每日问候
 * Plugin URI:  https://www.yourwebsite.com/my-first-greeting-plugin
 * Description: 这是一个示例插件，用于在仪表盘显示个性化问候。
 * Version:     1.0.0
 * Author:      Your Name
 * Author URI:  https://www.yourwebsite.com
 * License:     GPL v2 or later
 * Text Domain: my-first-greeting
 */

Setelah menyimpan file tersebut, masuklah ke halaman “Plugin” di panel administrasi WordPress. Anda seharusnya dapat melihat plugin “Daily Greeting” dalam daftar dan dapat mengaktifkannya. Saat ini, plugin tersebut belum memiliki fungsi apa pun.

推荐阅读 Panduan Utama Pengembangan Plugin WordPress: Membangun Plugin Pertama Anda dari Nol hingga Satu.。

Menambahkan alat tambahan (gadget) ke panel kontrol (dashboard)

Selanjutnya, kita akan menggunakan WordPress untuk… wp_dashboard_setup Gunakan “action hook” untuk menambahkan alat tambahan (widget) dashboard yang khusus dibuat. Di bawah komentar di bagian awal file utama, tambahkan kode berikut:

// 添加仪表盘小工具
function mfgp_add_dashboard_widget() {
    wp_add_dashboard_widget(
        'mfgp_dashboard_widget',          // 小工具唯一ID
        '每日问候',                       // 小工具标题
        'mfgp_dashboard_widget_content'  // 显示内容的回调函数
    );
}
add_action( 'wp_dashboard_setup', 'mfgp_add_dashboard_widget' );

// 定义小工具内容
function mfgp_dashboard_widget_content() {
    $user = wp_get_current_user();
    $hour = date('G'); // 获取当前小时（24小时制）

if ( $hour &gt;= 5 &amp;&amp; $hour < 12 ) {
        $greeting = '早上好';
    } elseif ( $hour >= 12 && $hour &lt; 18 ) {
        $greeting = &#039;下午好&#039;;
    } else {
        $greeting = &#039;晚上好&#039;;
    }

echo &#039;<p>' . sprintf( esc_html__( '%s，%s！欢迎回来。', 'my-first-greeting' ), $greeting, esc_html( $user-&gt;display_name ) ) . '</p>'; echo '
    echo '<p>' . esc_html__( '这是你的第一个插件创建的问候小工具。', 'my-first-greeting' ) . '</p>';
}

Kode ini melakukan dua hal: pertama, kode tersebut mendefinisikan sebuah fungsi. mfgp_add_dashboard_widget, menggunakan wp_add_dashboard_widget Fungsi tersebut digunakan untuk mendaftarkan sebuah alat kecil (tool). Setelah itu, definisi dari alat tersebut dibuat. mfgp_dashboard_widget_content Fungsi ini digunakan untuk menghasilkan konten sebuah alat bantu (tool) yang akan menampilkan ucapan selamat berbeda-beda tergantung waktu dalam sehari, serta menyebutkan nama pengguna yang sedang terdaftar (logged in). Perlu diperhatikan bahwa kami telah menggunakan… esc_html__() 和 esc_html() Mempersiapkan terjemahan fungsi dan mengeluarkan karakter escape merupakan praktik penting untuk memastikan keamanan dan internasionalisasi.

Setelah mengaktifkan plugin dan memperbarui halaman panel kontrol, Anda akan dapat melihat alat bantu “Sapaan Harian” (Daily Greeting).

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

Peningkatan Fungsi Plugin dan Praktik Keamanan

Sebuah plugin dasar sudah selesai dibuat, tetapi untuk menjadikannya lebih kuat dan lebih profesional, kita perlu memperhatikan aspek keamanan, kemudahan pemeliharaan (maintainability), serta kemampuan pengaturan oleh pengguna (user configuration).

Halaman Pengaturan Plugin

Akan lebih berguna jika pengguna dapat menyesuaikan ucapan selamat mereka sendiri. Kami akan membuat halaman pengaturan yang sederhana untuk plugin tersebut.

Pertama, gunakan admin_menu Action hook menambahkan halaman menu anak:

推荐阅读 Panduan Dasar Pengembangan Plugin WordPress: Membangun Plugin Kustom Pertama Anda Dari Nol。

// 添加设置菜单
function mfgp_add_admin_menu() {
    add_options_page(
        '每日问候设置',                // 页面标题
        '每日问候',                    // 菜单标题
        'manage_options',             // 所需权限
        'my-first-greeting-plugin',   // 菜单slug
        'mfgp_settings_page_content' // 回调函数
    );
}
add_action( 'admin_menu', 'mfgp_add_admin_menu' );

Kemudian, buat konten halaman pengaturan, opsi pengaturan pendaftaran, dan proses penyimpanan formulir:

// 设置页面内容
function mfgp_settings_page_content() {
    ?>
    <div class="wrap">
        <h1>\n</h1>
        <form action="/id/options.php/" method="post" data-trp-original-action="options.php">
            <?php
            settings_fields( 'mfgp_settings_group' ); // 输出安全字段
            do_settings_sections( 'my-first-greeting-plugin' ); // 输出设置区块
            submit_button(); // 输出提交按钮
            ?>
        <input type="hidden" name="trp-form-language" value="id"/></form>
    </div>
    <?php
}

// 初始化设置
function mfgp_settings_init() {
    register_setting(
        'mfgp_settings_group', // 选项组名
        'mfgp_custom_message', // 选项名
        array( 'sanitize_callback' => 'sanitize_text_field' ) // 清理回调
    );

add_settings_section(
        'mfgp_section', // 区块ID
        '自定义问候设置', // 区块标题
        null, // 区块描述回调（无）
        'my-first-greeting-plugin' // 所属页面
    );

add_settings_field(
        'mfgp_field',
        '自定义问候语前缀',
        'mfgp_field_callback', // 输出字段HTML的回调
        'my-first-greeting-plugin',
        'mfgp_section'
    );
}
add_action( 'admin_init', 'mfgp_settings_init' );

// 设置字段的回调函数
function mfgp_field_callback() {
    $value = get_option( 'mfgp_custom_message', '祝您有愉快的一天，' );
    echo '<input type="text" name="mfgp_custom_message" value="' . esc_attr( $value ) . '" class="regular-text" />'; echo '
    echo '<p class="description">Teks ini akan ditambahkan sebelum ucapan selamat.</p>';
}

Terakhir, modifikasi fungsi untuk mengubah isi alat bantu (tool) agar pengaturan khusus yang dibuat oleh pengguna dapat berlaku.

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 mfgp_dashboard_widget_content() {
    $user = wp_get_current_user();
    $hour = date('G');
    $custom_msg = get_option( 'mfgp_custom_message', '祝您有愉快的一天，' );

if ( $hour &gt;= 5 &amp;&amp; $hour < 12 ) {
        $greeting = '早上好';
    } elseif ( $hour >= 12 && $hour &lt; 18 ) {
        $greeting = &#039;下午好&#039;;
    } else {
        $greeting = &#039;晚上好&#039;;
    }

echo &#039;<p>' . esc_html( $custom_msg ) . sprintf( esc_html__( '%s，%s！', 'my-first-greeting' ), $greeting, esc_html( $user-&gt;display_name ) ) . '</p>';
}

Sekarang, di menu “Pengaturan” (Settings) di backend WordPress, akan muncul halaman opsi “Sapaan Harian” (Daily Greetings), di mana administrator dapat menyimpan sebuah prefiks sapaan yang telah disesuaikan.

Patuhi standar keamanan dan pengkodean.

Selama proses pengembangan, penting untuk mengikuti praktik keamanan WordPress: gunakan fungsi escape yang sesuai untuk semua data yang berasal dari pengguna atau basis data, yang akan ditampilkan ke pengguna. esc_html, esc_attr, esc_urlValidasi dan bersihkan semua input dari pengguna (misalnya, dengan menggunakan…) sanitize_text_field) ; Penggunaan wp_kses_post 或 wp_kses Ini memungkinkan penggunaan HTML yang aman. Selain itu, disarankan untuk mengikuti pedoman yang berlaku. Standar Pemrograman PHP Resmi WordPressHal ini dilakukan untuk memastikan kode tetap jelas dan konsisten.

Internasionalisasi plugin dan persiapan untuk penerbitan

Agar plugin Anda dapat digunakan oleh pengguna di seluruh dunia, internasionalisasi (pengaturan agar plugin dapat berfungsi dengan baik dalam berbagai bahasa) merupakan langkah yang sangat penting. Selain itu, untuk mempersiapkan plugin tersebut untuk dipublikasikan ke dalam direktori resmi, Anda juga perlu mengikuti beberapa standar atau pedoman tertentu.

Menginternasionalisasi plugin.

Kami sudah menggunakannya dalam kode kami. esc_html__() Untuk mengemas string yang perlu diterjemahkan. Untuk menyelesaikan internasionalisasi, Anda perlu membuat sebuah folder di bawah direktori plugin. languages Folder. Kemudian, tambahkan kode berikut setelah komentar di bagian awal file utama untuk memuat bidang teks (text field):

// 加载文本域以实现国际化
function mfgp_load_textdomain() {
    load_plugin_textdomain( 'my-first-greeting', false, dirname( plugin_basename( __FILE__ ) ) . '/languages/' );
}
add_action( 'plugins_loaded', 'mfgp_load_textdomain' );

Setelah itu, Anda dapat menggunakan alat seperti Poedit untuk memindai string terjemahan dalam kode plugin, sehingga dapat dihasilkan file terjemahan yang diperlukan. .pot File template, dan untuk berbagai bahasa (seperti bahasa Cina) zh_CN) Create .po Dan yang telah dikompilasi .mo File, masukkan ke dalam. languages folder.

Sedang mempersiapkan untuk dipublikasikan ke dalam direktori resmi.

Jika Anda berencana untuk mengirimkan plugin ke direktori plugin WordPress.org, Anda perlu memastikan kualitas kode dan menyertakan file metadata yang diperlukan. Misalnya, buatlah sebuah… readme.txt File tersebut harus memiliki format yang sesuai dengan persyaratan yang ditentukan. Spesifikasi Khusus WordPressBerisi nama plugin, deskripsi, langkah-langkah instalasi, pertanyaan umum, catatan pembaruan, dan lainnya. Selain itu, pertimbangkan untuk menambahkan fungsi “uninstall hook” yang berfungsi untuk membersihkan data yang terkait dengan plugin dari basis data saat pengguna menghapusnya.

// 插件卸载时清理选项
function mfgp_uninstall_hook() {
    delete_option( 'mfgp_custom_message' );
}
register_uninstall_hook( __FILE__, 'mfgp_uninstall_hook' );

Menyimpulkan.

Dengan membuat plugin “Salam Harian” ini, kita telah melalui seluruh proses inti pengembangan plugin WordPress: mulai dari membuat struktur file dasar, menambahkan fitur menggunakan action hooks, hingga membuat antarmuka pengelolaan, menerapkan standar keamanan, dan mempersiapkan fitur internasionalisasi. Kuncinya adalah memahami dan menguasai sistem hook WordPress dengan baik, serta selalu mengutamakan aspek keamanan dan standar kode. Contoh sederhana ini merupakan titik awal perjalanan Anda dalam pengembangan plugin; dari sini Anda dapat mengeksplorasi fitur yang lebih kompleks, seperti kode singkat (shortcodes), jenis artikel khusus (custom post types), endpoint REST API, dan lainnya, untuk mengembangkan plugin profesional yang berfungsi dengan sangat efektif.

FAQ - Pertanyaan yang Sering Diajukan.

Di mana direktori yang harus ditempatkan plugin-nya?

WordPress plugin harus ditempatkan di dalam direktori plugin situs web. wp-content/plugins/ Di dalam direktori tersebut, setiap plugin dapat berupa file PHP yang terpisah. Namun, yang lebih umum terjadi adalah plugin berbentuk folder dengan nama yang sama dengan nama plugin tersebut, di dalamnya terdapat file utama (main file) dan sumber daya lainnya (resources).

Mengapa plugin saya tidak terlihat di daftar backend?

Silakan periksa format komentar di bagian awal file plugin utama (seperti Plugin Name, Description, dll.) untuk memastikan bahwa formatnya benar dan lengkap. Pastikan file tersebut berada di direktori yang tepat, dan bahwa WordPress memiliki akses untuk membaca file tersebut. Selain itu, periksa juga apakah tidak ada spasi atau karakter tambahan di awal kode PHP.

Bagaimana cara men-debug kesalahan PHP dalam sebuah plugin?

在 wp-config.php Dalam dokumen tersebut, akan... WP_DEBUG Konstanta diatur ke trueIni akan memungkinkan WordPress untuk menampilkan kesalahan PHP, peringatan, dan notifikasi di halaman. Harap perhatikan bahwa fitur ini hanya boleh diaktifkan dalam lingkungan pengembangan, dan pastikan untuk menonaktifkannya sebelum situs Anda diunggah ke server publik.

Apa perbedaan antara file functions.php pada plugin dan tema?

Dalam topik tersebut… functions.php Fungsi-fungsi yang ditambahkan terikat pada tema tertentu. Ketika Anda mengganti tema, fungsi-fungsi tersebut mungkin tidak akan berfungsi lagi. Sebaliknya, fungsi yang disediakan oleh plugin bersifat independen dari tema; selama plugin tersebut diaktifkan, fungsi tersebut akan selalu tersedia, tidak peduli tema apa yang digunakan. Untuk fungsi-fungsi yang bersifat umum (dapat digunakan di berbagai tema), mengembangkan plugin merupakan pilihan yang lebih baik.

Bagaimana cara memungkinkan pengembang lain untuk memperluas (mengembangkan lebih lanjut) plugin saya?

Anda dapat memungkinkan pengembang lain untuk memperluas plugin Anda dengan menyediakan “action hooks” (pengait aksi) dan “filter hooks” (pengait filter) yang dapat disesuaikan. do_action() Buat “action hook” (pautan aksi) dan lakukan tindakan yang diperlukan di tempat-tempat di mana kode perlu disisipkan (di-inject). apply_filters() Ciptakan “filter hooks” yang memungkinkan mereka untuk mengubah nilai data tertentu dalam plugin Anda. Ini merupakan pola umum kerjasama antar-plugin dalam ekosistem WordPress.