Tutorial Ultimate untuk Pembangunan Plugin WordPress: Membina Plugin Pertama Anda Dari Awal Hingga Selesai

Asas Pembangunan Plugin WordPress dan Persediaan Persekitaran

Sebelum mula menulis kod, adalah sangat penting untuk memahami konsep asas plugin WordPress dan menyediakan persekitaran pembangunan yang sesuai. Sebuah plugin WordPress pada dasarnya merupakan koleksi satu atau lebih fail PHP yang digunakan untuk memperluas atau mengubah fungsi asas WordPress melalui sistem Hook yang disediakan oleh WordPress. Plugin boleh bersifat ringkas, hanya dengan menambahkan beberapa baris kod, atau boleh menjadi kompleks, sehingga membina sistem e-dagang yang lengkap.

Inti daripada persekitaran pembangunan adalah untuk membina sebuah persekitaran pelayan setempat. Anda boleh menggunakan alat seperti XAMPP, MAMP, Local by Flywheel, atau Docker untuk dengan cepat membina sebuah laman web WordPress setempat yang mengandungi PHP, MySQL, dan Apache/Nginx. Pastikan bahawa versi PHP yang anda gunakan adalah selaras dengan versi yang disyorkan oleh pihak WordPress. Dari segi editor kod, Visual Studio Code,PhpStorm, atau Sublime Text semuanya merupakan pilihan yang baik, kerana ia menyediakan fungsi seperti penyorotan sintaks, cadangan kod, dan sokongan untuk penyelidikan kesilapan (debugging), yang dapat meningkatkan kecekapan pembangunan dengan ketara.

Sebuah plugin WordPress yang standard mesti mengandungi sekurang-kurangnya satu fail PHP utama, dan bahagian atas fail tersebut perlu mengandungi ulasan maklumat plugin yang khusus. Ulasan-ulasan ini adalah kunci untuk WordPress mengenal pasti plugin tersebut. Selain itu, walaupun tidak wajib, adalah amalan yang baik untuk membuat direktori yang berasingan untuk plugin anda, kerana ini akan membantu dalam menguruskan fail sumber, pakej bahasa, dan kebergantungan lain.

Diperoleh daripada WEB\nDisyorkan untuk membaca. Pembangunan Plugin WordPress: Panduan Lengkap Dari Permulaan Hingga Kemahiran Tinggi – Membina Laman Web Yang Diperibadikan。

Cipta fail plugin pertama anda.

Sekarang, mari kita mulakan dengan membuat fail inti untuk plugin pertama kita. Pertama sekali, anda perlu masuk ke direktori pemasangan WordPress./wp-content/plugins/Folder. Di sini, buatlah folder baru untuk plugin anda, contohnya dengan nama “my-plugin-folder”.my-first-plugin。

UltaHost – Penyedia Hosting untuk WordPress

Jaminan pemulangan wang dalam tempoh 30 hari, lebar jalur dan pangkalan data yang tidak terhad, perlindungan DDoS percuma, diskaun 50% untuk pembelian selama 3 tahun.

Lawati halaman

Dalam folder tersebut, buat sebuah fail PHP utama. Biasanya, fail utama ini akan mempunyai nama yang sama dengan folder plugin tersebut, contohnya:my-first-plugin.phpPada awal fail ini, maklumat kepala plugin standard mesti disertakan.

<?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
 */

Komen ini menyediakan semua maklumat meta yang diperlukan untuk latar belakang plugin WordPress. Selepas menyimpan fail tersebut, anda akan dapat melihat dan mengaktifkan plugin ini di halaman “Plugins” di latar belakang WordPress. Buat masa ini, plugin ini tidak mempunyai sebarang fungsi, tetapi strukturnya sudah siap dibina.

Tambahkan satu fungsi yang mudah untuk plugin tersebut.

Setelah mengaktifkan plugin tersebut, kita akan menambahkan fungsi pertama yang sebenar kepadanya: menampilkan baris teks khusus di bahagian kaki laman web (footer). Kita akan menggunakan ciri-ciri yang tersedia dalam WordPress untuk mencapai ini.wp_footerKuku.

Dalam fail utama pluginmy-first-plugin.phpDi bawah ulasan kepala (header comment), tambahkan kod berikut:

Diperoleh daripada WEB\nDisyorkan untuk membaca. Belajar membangunkan plugin WordPress dari awal: Membina fungsi khusus dan ekstensi。

// 在网站页脚输出自定义文本
function myfp_add_footer_text() {
    echo '<p style="text-align: center; color: #666;">Terima kasih kerana menggunakan laman web ini! Dikendalikan oleh “My First Plugin”.</p>';
}
add_action( 'wp_footer', 'mfp_add_footer_text' );

Di sini,mfp_add_footer_textIni adalah fungsi yang kami buat sendiri, dan ia mengandungi kandungan HTML yang perlu dipaparkan.add_action()Ia merupakan fungsi utama yang digunakan untuk menambahkan “hook” tindakan (action hooks), yang membenarkan fungsi kita “dipasang” (mounted) pada kod inti WordPress.wp_footerPada titik pelaksanaan ini, simpan fail dan kemudian segar semula halaman web. Anda akan dapat melihat baris teks tersebut di bahagian bawah halaman.

Gunakan kod pendek untuk memperluas fungsi penyuntingan kandungan.

Shortcode merupakan ciri yang sangat berguna yang disediakan oleh WordPress, yang membenarkan pengguna untuk memasukkan kandungan dinamik ke dalam artikel atau halaman dengan menggunakan tag yang mudah. Seterusnya, kita akan membuat sebuah shortcode yang mudah untuk menunjukkan tarikh semasa.

Dalam fail utama yang sama, teruskan dengan menambahkan kod berikut:

hosting.com Hosting Bersama

Prestasi tinggi, menampilkan CPU AMD EPYC, storan SSD NVMe dan LiteSpeed, dengan sokongan pakar dalaman 24/7, langkah keselamatan canggih termasuk SSL, perlindungan serangan paksa kata laluan, perisian hasad dan DDoS, menjimatkan sehingga 73%.

Lawati halaman

// 创建一个显示当前日期的短代码
function mfp_show_current_date( $atts ) {
    // 定义短码的默认属性
    $attributes = shortcode_atts(
        array(
            'format' => 'Y年m月d日',
        ),
        $atts
    );

// 根据属性中的格式返回日期
    return date( $attributes['format'] );
}
add_shortcode( 'show_date', 'mfp_show_current_date' );

fungsimfp_show_current_dateLogik untuk mendefinisikan kod singkatan telah ditentukan.shortcode_atts()Fungsi ini digunakan untuk menggabungkan atribut yang ditentukan oleh pengguna dengan atribut lalai, bagi memastikan kekuatan (robustness) kod tersebut. Akhirnya,add_shortcode()Fungsi tersebut akan…[show_date]Tag ini berkaitan dengan fungsi pemprosesan yang kita buat sendiri.

Sekarang, anda boleh memasukkan kandungan tersebut dalam mana-mana artikel, halaman, atau editor teks untuk alat tambahan (widget).[show_date]Untuk menunjukkan tarikh dalam format lalai, atau menggunakan…[show_date format="F j, Y"]Untuk menunjukkan tarikh dalam format bahasa Inggeris.

Mengerti dengan mendalam tentang hook dan filter

Falsafah utama dalam pembangunan plugin WordPress adalah penggunaan “Hook”. Hook terbahagi kepada dua jenis: Action dan Filter. Kami telah menggunakan kedua-duanya sebelum ini.add_action()Hanya perlu menambahkan satu “action hook” sahaja.

Diperoleh daripada WEB\nDisyorkan untuk membaca. Dari awal: Membina plugin WordPress pertama anda。

Hook tindakan (action hook) akan menjalankan kod anda pada titik masa yang ditentukan, dan ia tidak memerlukan nilai pulangan. Ia biasanya digunakan untuk menghasilkan kandungan atau melaksanakan tugas tertentu, seperti menambahkan teks di bahagian kaki halaman (footer). Sebaliknya, hook penapis (filter hook) digunakan untuk mengubah data. Hook penapis menerima sebuah nilai, memprosesnya melalui fungsi anda, dan kemudian harus mengembalikan nilai yang telah diubah.

Menggunakan penapis untuk mengubah tajuk artikel

Mari kita buat sebuah penapis untuk menambahkan prefiks secara automatik kepada semua tajuk artikel. Tambahkan kod berikut ke dalam fail utama plugin:

Hosting Bersama InterServer

Hosting kongsi: 1TB/bulan pada $2.50 USD, bulan pertama pada $0.10 USD dengan kod promo tryinterserver. 461 skrip aplikasi awan tersedia untuk pemasangan satu klik.

Lawati halaman

// 使用过滤器为文章标题添加前缀
function mfp_add_title_prefix( $title, $id = null ) {
    // 确保只在主循环且是文章页面的标题上生效
    if ( in_the_loop() && is_single() && get_post_type( $id ) === 'post' ) {
        $title = '【推荐阅读】' . $title;
    }
    return $title;
}
add_filter( 'the_title', 'mfp_add_title_prefix', 10, 2 );

Di sini,the_titleIni adalah satu hook penapis (filter hook).add_filter()Parameter ketiga, “10”, mewakili keutamaan (semakin kecil nombor, semakin awal fungsi tersebut akan dijalankan), manakala parameter keempat, “2”, menunjukkan bahawa fungsi pemprosesan kita menerima dua parameter (parameter asal).$title(Fungsi ini akan memeriksa syarat-syarat dan hanya menambahkan awalan pada tajuk apabila berada pada halaman artikel tunggal dan dalam gelung utama.)

Keselamatan plugin dan amalan terbaik.

Semasa membangunkan plugin, keselamatan merupakan faktor utama yang perlu diambil kira. Jangan pernah percaya pada data yang dimasukkan oleh pengguna; data tersebut mesti disahkan, dibersihkan, dan diubah suai (dengan menggunakan mekanisme “escaping”) sebelum digunakan.

Pemverian Data dan Penyisihan (Data Validation and Escaping)

Apabila plugin perlu memproses data yang datang dari borang atau URL, fungsi keselamatan yang disediakan oleh WordPress mesti digunakan. Sebagai contoh, gunakan…sanitize_text_field()Untuk membersihkan input teks, gunakan…esc_html()或esc_attr()Outputkan HTML atau atribut untuk mencegah serangan Cross-Site Scripting (XSS).

Membina halaman tetapan yang ringkas

Sebuah plugin yang lengkap biasanya memerlukan halaman tetapan di bahagian belakang (backend). Di sini, kami akan menunjukkan cara untuk membuat halaman pilihan yang ringkas dan menyimpan item tetapan tersebut dengan selamat.

// 在后台管理菜单中添加一个选项页面
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' );

// 注册一个设置项
function mfp_settings_init() {
    register_setting( 'mfpPlugin', 'mfp_settings' ); // 设置组，选项名

add_settings_section(
        'mfp_plugin_section', // 区块ID
        '基础设置',           // 区块标题
        null,                 // 区块介绍的回调函数（此处为null）
        'my-first-plugin'     // 所属页面slug
    );

add_settings_field(
        'custom_text',        // 字段ID
        '自定义显示文本',     // 字段标签
        'mfp_custom_text_field_html', // 用于输出字段HTML的回调函数
        'my-first-plugin',    // 页面slug
        'mfp_plugin_section'  // 所属区块ID
    );
}
add_action( 'admin_init', 'mfp_settings_init' );

// 渲染设置字段的HTML
function mfp_custom_text_field_html() {
    $options = get_option( 'mfp_settings' );
    $value = isset( $options['custom_text'] ) ? esc_attr( $options['custom_text'] ) : '';
    ?>
    <input type='text' name='mfp_settings[custom_text]' value='<?php echo $value; ?>'>
    <p class="description">Teks yang dimasukkan di sini akan dipaparkan di bahagian kaki halaman.</p>
    <?php
}

// 渲染整个选项页面的HTML
function mfp_options_page_html() {
    // 检查用户权限
    if ( ! current_user_can( 'manage_options' ) ) {
        return;
    }
    ?>
    <div class="wrap">
        <h1><?php echo esc_html( get_admin_page_title() ); ?></h1>
        <form action="/ms/options.php/" method="post" data-trp-original-action="options.php">
            <?php
            settings_fields( 'mfpPlugin' ); // 输出安全字段
            do_settings_sections( 'my-first-plugin' ); // 输出设置区块和字段
            submit_button( '保存设置' );
            ?>
        <input type="hidden" name="trp-form-language" value="ms"/></form>
    </div>
    &lt;?php
}

Kod ini membuat halaman sub yang terletak di bawah menu “Seting”, yang digunakan untuk menyimpan teks khusus yang ditentukan oleh pengguna. Perhatikan pemeriksaan hak akses pengguna yang dilakukan dalam kod tersebut.current_user_can）dan pengekstrakan data yang dihasilkan (）esc_html, esc_attrIni semua merupakan sebahagian daripada amalan keselamatan. Selepas itu, anda boleh mengubah fungsi yang sebelum ini digunakan untuk menghasilkan kandungan di bahagian kaki halaman (footer).get_option( 'mfp_settings' )Nilai ini dibaca daripada sumber untuk ditampilkan secara dinamik.

RINGKASAN

Melalui tutorial ini, anda telah menyelesaikan keseluruhan proses pembinaan sebuah plugin WordPress yang berfungsi sepenuhnya bermula dari kosong. Anda telah belajar bagaimana untuk mencipta struktur fail asas sebuah plugin, serta cara menggunakan “action hooks”.add_actionTambahkan kandungan di bahagian bawah halaman, melaluiadd_shortcodeMencipta kod pendek khusus, serta menggunakan pengait penapis (filter hooks)add_filterMengubah data artikel. Yang lebih penting, anda telah memahami konsep asas keselamatan plugin dan telah mengamalkan cara untuk membuat halaman tetapan backend yang selamat untuk mengurus pilihan plugin.

Pembangunan plugin adalah proses pembelajaran dan amalan yang berterusan. Langkah seterusnya, anda boleh mencuba untuk menambahkan sokongan antarabangsa (internationalization) kepada plugin tersebut.__()和_e()Anda boleh menggunakan fungsi tertentu, mengintegrasikan sumber JavaScript dan CSS, atau menggunakan pengaturcaraan berorientasikan objek (Object-Oriented Programming/OOP) untuk mengubah suai struktur kod agar lebih mudah diselenggara dan diperluas. Ingatlah bahawa membaca manual rasmi plugin WordPress dan kod terasnya adalah cara terbaik untuk meningkatkan kemahiran anda.

FAQ - Soalan Lazim

Bagaimana untuk men-debug plugin WordPress saya?

Langkah pertama adalah untuk mengaktifkan mod pembangunan (debug mode) pada WordPress. Pada laman web…wp-config.phpDalam fail tersebut, akan…WP_DEBUGKonstanta ditetapkan kepadatrue. Ini akan memaparkan ralat PHP, amaran dan notis terus pada halaman. Untuk penyahpepijat yang lebih kompleks, anda boleh menggunakanerror_log()Fungsi tersebut akan menulis maklumat ke dalam log ralat server, atau menggunakan alat pembangunan profesional seperti Query Monitor untuk memeriksa pertanyaan pangkalan data, pelaksanaan fungsi tertentu (hook), dan data prestasi.

Bagaimanakah plugin saya dapat bersesuaian dengan pelbagai versi WordPress?

Dalam kod plugin, anda harus menggunakan pengesahan keadaan (conditional checks) untuk memeriksa kewujudan fungsi, kelas, atau konstanta teras WordPress sebelum menggunakannya. Anda boleh menggunakan kaedah berikut:function_exists()、class_exists()或defined()Melakukan penilaian. Pada masa yang sama, dalam plugin…readme.txtDalam fail tersebut, dinyatakan dengan jelas versi WordPress minimum yang disokong oleh plugin anda (melalui…)Requires at leastField), ini dapat membantu pengguna memahami keserasian (compatibility).

Adakah pembangunan plugin mesti menggunakan pengaturcaraan berorientasikan objek?

Ia bukanlah sesuatu yang wajib. Anda boleh menggunakan pemrograman prosedural murni (seperti contoh dalam tutorial ini) untuk membangunkan plugin yang mempunyai fungsi yang lengkap. Kelebihan utama pemrograman berorientasikan objek (OOP) adalah organisasi kod yang lebih baik, pengasingan komponen (encapsulation), dan kebolehgunaan semula kod (reusability), yang sangat berguna untuk projek plugin yang besar dan kompleks. Bagi plugin yang kecil, pemrograman prosedural mungkin lebih mudah dan langsung. Anda boleh memilih kaedah yang sesuai berdasarkan skala dan kerumitan projek tersebut.

Bagaimana untuk mengeluarkan plugin saya ke direktori plugin rasmi WordPress?

Pertama sekali, anda perlu mendaftar akaun di WordPress.org dan menghantar kod plugin tersebut. Kod plugin anda mesti mematuhi piawaian dan garis panduan rasmi, termasuk aspek keselamatan, tiada kandungan berbahaya, dan menggunakan lesen yang serasi dengan GPL. Anda juga perlu membuat dokumentasi yang terperinci…readme.txtAnda perlu memastikan fail-fail tersebut lengkap, dan bahagian ulasan di kepala fail utama plugin mematuhi piawaian yang ditetapkan. Setelah dihantar, sukarelawan daripada pasukan semakan plugin akan melakukan pemeriksaan. Jika lulus, plugin tersebut boleh diterbitkan.