คู่มือเริ่มต้นการพัฒนา WordPress Plugin: สร้างส่วนขยายแรกของคุณตั้งแต่เริ่มต้น

การเตรียมสภาพแวดล้อมการพัฒนา WordPress Plugin

ก่อนที่คุณจะเริ่มเขียนโค้ด สภาพแวดล้อมการพัฒนาที่เหมาะสมเป็นสิ่งสำคัญมาก นี่ไม่เพียงแต่ทำให้คุณทำงานได้อย่างมีประสิทธิภาพ แต่ยังจำลองสภาพแวดล้อมการผลิตจริง เพื่อหลีกเลี่ยงปัญหาความไม่สอดคล้องกันระหว่างเครื่องท้องถิ่นและออนไลน์ สภาพแวดล้อมการพัฒนาทั่วไปจำเป็นต้องรวมสภาพแวดล้อมเซิร์ฟเวอร์ท้องถิ่น ตัวแก้ไขโค้ด และเครื่องมือดีบัก

ประการแรก คุณต้องมีสภาพแวดล้อมเซิร์ฟเวอร์ท้องถิ่นที่สามารถรัน WordPress ได้ แนะนำให้ใช้ชุดสภาพแวดล้อมแบบรวม เช่น Laragon, XAMPP หรือ Local by Flywheel เครื่องมือเหล่านี้สามารถติดตั้ง Apache/Nginx, PHP และ MySQL ได้ด้วยคลิกเดียว ช่วยประหยัดกระบวนการกำหนดค่าที่ซับซ้อน โปรดตรวจสอบให้แน่ใจว่ารุ่น PHP ของคุณเข้ากันได้กับรุ่นหลักปัจจุบันของ WordPress โดยทั่วไปแนะนำให้ใช้ PHP 7.4 หรือสูงกว่า ในขณะเดียวกัน ใน “เครื่องมือ” -> “สุขภาพไซต์” ในแผงควบคุม WordPress ตรวจสอบให้แน่ใจว่าไม่มีปัญหาสำคัญที่ส่งผลต่อการพัฒนาปลั๊กอิน

ประการที่สอง เลือกตัวแก้ไขโค้ดที่มีประสิทธิภาพ Visual Studio Code เป็นตัวเลือกที่ได้รับความนิยมมากในปัจจุบัน มันเบา ฟรี และมีส่วนขยายที่หลากหลาย เช่น PHP Intelephense (สำหรับคำแนะนำโค้ดอัจฉริยะ), WordPress Snippet (ส่วนของโค้ด) เป็นต้น อีกตัวเลือกคลาสสิกคือ PhpStorm ซึ่งให้การสนับสนุนการพัฒนา WordPress ที่บูรณาการลึกซึ้งกว่า แต่เป็นซอฟต์แวร์แบบเสียเงิน

แนะนำให้อ่าน จากศูนย์ถึงหนึ่ง: คู่มือการพัฒนา WordPress Plugin แบบครบวงจรและแนวปฏิบัติที่ดีที่สุด。

สุดท้าย การเปิดโหมดดีบักเป็นขั้นตอนที่จำเป็นอย่างยิ่งในกระบวนการพัฒนา โดยการแก้ไขที่wp-config.phpไฟล์ คุณสามารถเปิดใช้งานการรายงานข้อผิดพลาดแบบละเอียด ซึ่งมีความสำคัญอย่างยิ่งในการค้นหาและแก้ไขปัญหาภายในโค้ด ค้นหาตำแหน่งในไฟล์ที่กำหนดWP_DEBUGค่าคงที่ หรือเพิ่มโค้ดต่อไปนี้:

UltaHost WordPress โฮสติ้ง

การรับประกันคืนเงินภายใน 30 วัน, แบนด์วิธและฐานข้อมูลไม่จำกัด, การป้องกัน DDoS ฟรี, ซื้อ 3 ปีลดราคา 50%

เข้าถึงหน้าเว็บ

// 启用 WordPress 调试模式
define( 'WP_DEBUG', true );
// 将错误记录到 /wp-content/debug.log 文件
define( 'WP_DEBUG_LOG', true );
// 在页面上显示错误（开发环境推荐，生产环境必须关闭）
define( 'WP_DEBUG_DISPLAY', true );

สร้างไฟล์ปลั๊กอินแรกของคุณ

ปลั๊กอิน WordPress สามารถมีเพียงแค่ไฟล์เดียวเท่านั้น ปลั๊กอินทั้งหมดต้องถูกจัดเก็บไว้ใน/wp-content/plugins/ไดเรกทอรี แต่ละปลั๊กอินสามารถมีไดเรกทอรีย่อยของตัวเอง ซึ่งช่วยในการจัดระเบียบโครงสร้างโค้ดที่ซับซ้อนมากขึ้น

ส่วนหัวความคิดเห็นของปลั๊กอิน

ไฟล์หลักของปลั๊กอินทุกตัวต้องเริ่มต้นด้วยความคิดเห็นส่วนหัว PHP ที่ได้มาตรฐาน นี่เป็นวิธีที่ WordPress ใช้ระบุข้อมูลของปลั๊กอิน สร้างไฟล์ใหม่ตั้งชื่อว่าmy-first-plugin.phpและวางไว้ในโฟลเดอร์/wp-content/plugins/my-first-plugin/เนื้อหาไฟล์มีดังนี้:

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

ความคิดเห็นนี้ให้ข้อมูลเมตาทั้งหมดที่ปลั๊กอินแสดงในหน้า “ปลั๊กอิน” ของแอดมิน WordPress โดยText Domain和Domain Pathเตรียมพร้อมสำหรับการทำให้ปลั๊กอินเป็นสากล (i18n)

การใช้งานฟังก์ชันพื้นฐาน

ตอนนี้ มาทำให้ปลั๊กอินนี้มีฟังก์ชันง่ายๆ: เพิ่มข้อความที่กำหนดเองโดยอัตโนมัติที่ส่วนท้ายของเนื้อหาบทความ เราจะใช้ WordPressthe_contentฟิลเตอร์ฮุค ในที่ที่คุณเพิ่งสร้างmy-first-plugin.phpใต้ความคิดเห็นส่วนหัวของไฟล์ ให้เพิ่มฟังก์ชันต่อไปนี้:

แนะนำให้อ่าน เรียนรู้การพัฒนา WordPress Plugin: สร้างฟังก์ชันที่กำหนดเองตั้งแต่เริ่มต้น。

// 在文章内容末尾添加自定义文本
function my_first_plugin_add_footer_text( $content ) {
    // 确保只在主循环的单篇文章页面执行
    if ( is_single() && in_the_loop() && is_main_query() ) {
        $footer_text = '<p><em>ขอบคุณที่อ่าน! บทความนี้ถูกนำเสนอโดย “ปลั๊กอินแรกของฉัน”</em></p>';
        $content .= $footer_text;
    }
    return $content;
}
add_filter( 'the_content', 'my_first_plugin_add_footer_text' );

หลังจากบันทึกไฟล์แล้ว เข้าสู่ระบบในแผงควบคุม WordPress ของคุณ ไปที่หน้า “ปลั๊กอิน” คุณควรจะเห็นปลั๊กอินชื่อ “ปลั๊กอินแรกของฉัน” เปิดใช้งานมัน แล้วไปดูบทความบล็อกสักหนึ่งบทความ คุณจะพบว่าส่วนท้ายของเนื้อหาบทความได้เพิ่มข้อความที่เราตั้งค่าไว้สำเร็จแล้ว

ใช้ WordPress Core API

เมื่อพัฒนาในระดับลึก คุณจะต้องมีปฏิสัมพันธ์กับ API ต่าง ๆ ที่ WordPress จัดให้อย่างสม่ำเสมอ ซึ่งที่สำคัญที่สุดคือระบบ “Hooks” ซึ่งประกอบด้วย “Actions” และ “Filters”

ทำความเข้าใจกับแอ็กชันฮุค

Action hooks allow you to execute custom code at specific points in time. For example, when an article is published, you want to send an email notification. In this case, you can usepublish_postaction. The following example demonstrates how to create a function that logs information in the error log when an article is published:

hosting.com 共享主机

高性能，配备 AMD EPYC CPU、NVMe SSD 存储和 LiteSpeed，全天候24小时、全天候的专家内部支持，高级安全措施，包括 SSL、暴力破解、恶意软件和 DDoS 防护，节省高达 73%

เข้าถึงหน้าเว็บ

// 定义文章发布时执行的动作函数
function my_first_plugin_log_post_published( $post_id, $post ) {
    // 避免无限循环和非文章类型
    if ( wp_is_post_revision( $post_id ) || $post->post_type != ‘post’ ) {
        return;
    }
    // 记录日志
    error_log( “文章 ID {$post_id} 已发布，标题为：{$post->post_title}” );
}
// 将函数挂载到 publish_post 动作钩子上
add_action( ‘publish_post’， ‘my_first_plugin_log_post_published’， 10, 2 );

ฟังก์ชันadd_actionThe third parameter is the priority (default 10), the smaller the number, the higher the priority; the fourth parameter is the number of arguments the function accepts.

เข้าใจฮุกตัวกรอง

Filter hooks are used to modify data. In the chapter “Creating Your First Plugin File”, we usedthe_contentเป็นเพียง hook กรอง มันรับเนื้อหาดั้งเดิม อนุญาตให้คุณแก้ไขแล้วส่งคืน อีกตัวอย่างที่ใช้บ่อยคือการปรับเปลี่ยนความยาวของบทสรุปบทความ:

// 修改摘要的默认字数
function my_first_plugin_custom_excerpt_length( $length ) {
    return 30; // 将摘要字数改为30字
}
add_filter( ‘excerpt_length’， ‘my_first_plugin_custom_excerpt_length’ );

เพิ่มเมนูทางเข้า

เพื่อโต้ตอบกับผู้ใช้ เรามักจะต้องเพิ่มหน้าเมนูในแถบด้านข้างการจัดการของ WordPress หลังบ้าน ซึ่งสามารถทำได้ผ่านadd_menu_pageฟังก์ชัน รหัสต่อไปนี้เพิ่มหน้าเซ็ตติ้งระดับบนสุดให้กับปลั๊กอิน:

แนะนำให้อ่าน คู่มือการพัฒนา WordPress Plugin แบบครบวงจร: สร้างคุณสมบัติส่วนขยาย WordPress ที่มีคุณภาพตั้งแต่เริ่มต้นจนสำเร็จ。

// 创建插件管理菜单
function my_first_plugin_add_admin_menu() {
    add_menu_page(
        ‘我的第一个插件设置’， // 页面标题
        ‘我的插件’，           // 菜单标题
        ‘manage_options’，     // 所需权限
        ‘my-first-plugin’，    // 菜单slug
        ‘my_first_plugin_settings_page’， // 回调函数，用于输出页面内容
        ‘dashicons-admin-plugins’， // 图标（可选）
        100                    // 菜单位置（可选）
    );
}
add_action( ‘admin_menu’， ‘my_first_plugin_add_admin_menu’ );

// 设置页面的回调函数
function my_first_plugin_settings_page() {
    ?>
    <div class="“wrap”">
        <h1>การตั้งค่าปลั๊กอินแรกของฉัน</h1>
        <p>นี่คือหน้าการตั้งค่าปลั๊กอิน คุณสามารถเพิ่มฟอร์มและตัวเลือกได้ที่นี่ในอนาคต</p>
    </div>
    &lt;?php
}

ความปลอดภัยของปลั๊กอินและแนวทางปฏิบัติที่ดีที่สุด

เมื่อพัฒนาปลั๊กอินสำหรับผู้อื่น การรักษาความปลอดภัยและคุณภาพของโค้ดไม่ควรถูกมองข้าม การปฏิบัติตามแนวทางปฏิบัติที่ดีที่สุดสามารถปกป้องเว็บไซต์จากการโจมตี และรับรองความเข้ากันได้และบำรุงรักษาของปลั๊กอิน

การตรวจสอบและหลีกเลี่ยงข้อมูล

อย่าไว้ใจข้อมูลที่ผู้ใช้ป้อนหรือข้อมูลจากฐานข้อมูลโดยเด็ดขาด ต้องทำการหนีอักขระก่อนแสดงผลในเบราว์เซอร์ และต้องทำการตรวจสอบและทำความสะอาดก่อนบันทึกลงในฐานข้อมูล WordPress มีฟังก์ชันช่วยเหลือมากมาย

โฮสติ้งแบบแชร์ของ InterServer

共享主机每月 $2.50 USD , 首月 $0.1 USD 优惠码 tryinterserver, 461个云应用脚本，一键安装。

เข้าถึงหน้าเว็บ

• การหนีผลลัพธ์: ใช้ฟังก์ชันเช่นesc_html()、esc_attr()、esc_url()和wp_kses_post()ฟังก์ชันเหล่านี้จะทำการหนีอักขระข้อมูลตามบริบท
• ตรวจสอบข้อมูลนำเข้า: ใช้sanitize_text_field()、sanitize_email()、intval()ฟังก์ชันที่ใช้ทำความสะอาดข้อมูลฟอร์มที่ผู้ใช้ส่งมา

ตัวอย่างเช่น เมื่อประมวลผลข้อมูลฟอร์มในหน้าการตั้งค่า:

$user_input = $_POST[‘some_field’] ?? ‘’; // 使用空合并运算符提供默认值
$clean_input = sanitize_text_field( $user_input ); // 清理数据
update_option( ‘my_plugin_option’， $clean_input ); // 安全存储

ใช้การตรวจสอบ nonce และสิทธิ์

เมื่อประมวลผลคำขอฟอร์ม (โดยเฉพาะคำขอจาก admin-ajax.php หรือ admin-post.php) จำเป็นต้องใช้wp_verify_nonce()เพื่อตรวจสอบความถูกต้องของคำขอและป้องกันการโจมตีแบบข้ามไซต์ (CSRF) พร้อมกันนี้ ให้ใช้current_user_can()ตรวจสอบว่าผู้ใช้ปัจจุบันมีสิทธิ์ในการดำเนินการหรือไม่

function my_first_plugin_handle_form_submit() {
    // 1. 检查nonce
    if ( ! isset( $_POST[‘my_nonce_field’] ) || ! wp_verify_nonce( $_POST[‘my_nonce_field’]， ‘my_action’ ) ) {
        wp_die( ‘安全校验失败！’ );
    }
    // 2. 检查权限
    if ( ! current_user_can( ‘manage_options’ ) ) {
        wp_die( ‘权限不足！’ );
    }
    // 3. 安全地处理数据…
}

การจัดระเบียบโค้ดและการทำให้เป็นสากล

สำหรับปลั๊กอินที่ซับซ้อน แนะนำให้ใช้การเขียนโปรแกรมเชิงวัตถุ (OOP) ในการจัดระเบียบโค้ด โดยแบ่งฟังก์ชันการทำงานออกเป็นคลาส ซึ่งช่วยเพิ่มความสามารถในการอ่านและนำโค้ดกลับมาใช้ใหม่ได้

พร้อมกันนี้ เตรียมความพร้อมสำหรับการรองรับหลายภาษาในปลั๊กอินตั้งแต่เริ่มต้น ซึ่งหมายความว่าสตริงทั้งหมดที่แสดงต่อผู้ใช้ควรใช้ฟังก์ชันการแปลของ WordPress__()、_e()ทำการแพ็กเกจ ทบทวนความคิดเห็นส่วนหัวของปลั๊กอิน เราได้กำหนดไว้แล้วText Domainในโค้ดควรใช้ดังนี้:

$message = __( ‘感谢阅读！本文由“我的第一个插件”为您呈现。’， ‘my-first-plugin’ );

จากนั้น คุณสามารถใช้เครื่องมือเช่น Poedit เพื่อสร้าง.potไฟล์เทมเพลตสำหรับนักแปลในการสร้างภาษาต่างๆ.moไฟล์สำหรับภาษาต่างๆ ได้

สรุป

ผ่านแนวทางนี้ คุณได้เสร็จสิ้นการเดินทางหลักในการสร้างปลั๊กอิน WordPress ตั้งแต่เริ่มต้นแล้ว คุณได้เรียนรู้วิธีตั้งค่าแวดล้อมการพัฒนา สร้างไฟล์ปลั๊กอินที่มีความคิดเห็นส่วนหัวมาตรฐาน และใช้ระบบฮุคแอ็กชันและฟิลเตอร์อันทรงพลังของ WordPress เพื่อเพิ่มฟังก์ชันการทำงาน เรายังได้สำรวจวิธีเพิ่มเมนูผู้ดูแลระบบอย่างปลอดภัย จัดการข้อมูล และเน้นย้ำถึงความสำคัญของความปลอดภัยและการทำให้เป็นสากล การพัฒนาปลั๊กอินเป็นกระบวนการเรียนรู้และฝึกฝนอย่างต่อเนื่อง โดยหัวใจหลักอยู่ที่การเข้าใจระบบฮุคของ WordPress และหลักเกณฑ์ด้านความปลอดภัย ต่อไป คุณสามารถลองพัฒนาฟังก์ชันการทำงานที่ซับซ้อนมากขึ้น เช่น การสร้างตารางฐานข้อมูลที่กำหนดเอง เพิ่มชอร์ตโค้ด (Shortcode), วิเจ็ต (Widget) หรือจุดปลายทาง REST API ค่อยๆ สร้างปลั๊กอินระดับธุรกิจที่มีคุณสมบัติครบถ้วนและโค้ดที่แข็งแรง

คำถามที่พบบ่อย (FAQ)

ปลั๊กอินต้องอยู่ในโฟลเดอร์แยกต่างหากหรือไม่?

ไม่ใช่ ปลั๊กอินสามารถเป็นเพียงไฟล์เดียว.phpวางโดยตรงใน/wp-content/plugins/ไดเรกทอรี อย่างไรก็ตาม สำหรับปลั๊กอินใดๆ ที่มีหลายไฟล์ ทรัพยากร (เช่น JS, CSS) หรือไฟล์แปลที่จำเป็น ขอแนะนำให้ใช้โฟลเดอร์แยกต่างหากเพื่อเก็บไฟล์ที่เกี่ยวข้องทั้งหมด ซึ่งจะทำให้โครงสร้างโปรเจกต์ชัดเจนและจัดการได้ง่ายขึ้น

จะให้การตั้งค่าปลั๊กอินของฉันบันทึกไว้ในฐานข้อมูลได้อย่างไร

WordPress มี API ตัวเลือกที่สะดวกมาก คุณสามารถใช้add_option()、get_option()和update_option()ฟังก์ชันเพื่อเพิ่ม, รับ, และอัปเดตการตั้งค่าปลั๊กอิน ข้อมูลเหล่านี้จะถูกจัดเก็บอย่างปลอดภัยในwp_optionsตารางฐานข้อมูลของ WordPress สำหรับข้อมูลที่มีโครงสร้างจำนวนมาก สามารถพิจารณาแปลงเป็นอาร์เรย์หรือสตริง JSON ก่อนจัดเก็บ

ปลั๊กอินที่ฉันพัฒนาจะขัดแย้งกับปลั๊กอินอื่น ๆ หรือไม่?

อาจเป็นไปได้ โดยเฉพาะเมื่อปลั๊กอินใช้ฮุก ชื่อฟังก์ชัน หรือชื่อคลาสทั่วไป เพื่อหลีกเลี่ยงความขัดแย้ง วิธีปฏิบัติที่ดีที่สุดคือ: เพิ่มคำนำหน้าที่ไม่ซ้ำกันให้กับฟังก์ชัน คลาส และตัวแปรทั้งหมดของคุณ (เช่น ใช้ตัวย่อหรือชื่อปลั๊กอิน) ใช้ slug ของปลั๊กอินเป็นเนมสเปซ (ใน PHP 5.3+ สามารถใช้เนมสเปซจริงได้) และเลือกลำดับความสำคัญที่เหมาะสมเมื่อใช้ฮุก เพื่อให้แน่ใจว่าลำดับการดำเนินการเป็นไปตามที่คาดหวัง

ปลั๊กอินต้องเข้ากันได้กับ WordPress เวอร์ชันใดบ้าง

ขึ้นอยู่กับกลุ่มเป้าหมายของคุณ โดยทั่วไป แนะนำให้เข้ากันได้กับเวอร์ชันหลักปัจจุบันและเวอร์ชันก่อนหน้าหนึ่งหรือสองเวอร์ชัน คุณสามารถประกาศเวอร์ชัน WordPress ขั้นต่ำที่ต้องการในฟิลด์readme.txtในไฟล์ผ่านRequires at least:ของปลั๊กอิน ระหว่างการพัฒนา ควรหลีกเลี่ยงการใช้ฟังก์ชันที่มีเฉพาะในเวอร์ชันใหม่มาก หรือใช้function_exists()ทำการตัดสินความเข้ากันได้ เพื่อขยายขอบเขตการใช้งานของปลั๊กอิน