• โฮมเพจ
  • บทความ
  • ทั่วไป
  • จะสร้างปลั๊กอิน WordPress ตัวแรกได้อย่างไร? ไกด์ทัวร์ทีละขั้นตอนพร้อมโค้ดตัวอย่าง

จะสร้างปลั๊กอิน WordPress ตัวแรกได้อย่างไร? ไกด์ทัวร์ทีละขั้นตอนพร้อมโค้ดตัวอย่าง

เผยแพร่แล้ว: 2017-04-27

วิธีสร้างปลั๊กอิน WordPress และเริ่มต้นการพัฒนาปลั๊กอิน WordPress?

คุณเป็นนักพัฒนา WordPress ใหม่หรือไม่? คุณเริ่มทำงานกับ WordPress เมื่อเร็ว ๆ นี้หรือไม่? คุณต้องการสร้างปลั๊กอิน WordPress ใหม่หรือไม่?

วิธีสร้างปลั๊กอิน wordpress ตั้งแต่เริ่มต้น? คุณมาถูกที่แล้ว

ในบทช่วยสอนนี้ เราจะพูดถึงวิธีสร้าง Hello World WordPress Plugin ตั้งแต่เริ่มต้น นี่คือคำแนะนำทีละขั้นตอนเกี่ยวกับบทช่วยสอนการพัฒนาปลั๊กอิน WordPress

ก่อนที่เราจะเริ่มต้น นี่คือการออกแบบปลั๊กอิน WordPress และสิ่งที่เราจะทำ:

  1. เราจะสร้างปลั๊กอิน Hello World WordPress อย่างง่าย
  2. สร้างไฟล์ crunchify-hello-world.php ซึ่งมีรหัสปลั๊กอินทั้งหมด
  3. สร้างไฟล์ readme.txt ด้วยข้อมูลพื้นฐาน
    • ข้อมูลเมตาของปลั๊กอิน
    • คำอธิบาย
    • ขั้นตอนการติดตั้ง
    • ส่วนคำถามที่พบบ่อย
    • ภาพหน้าจอ
    • เปลี่ยนบันทึก
  4. ปลั๊กอินจะมีฟังก์ชันการทำงานด้านล่าง
    • เมนูใหม่ Crunchify Plugin ภายใต้เมนู Settings
    • admin page ปลั๊กอินใหม่
    • ผู้ใช้จะมีตัวเลือกในการ add value ให้กับ Textfield
    • Save button เพื่อบันทึกการตั้งค่า
    • ปลั๊กอินจะ append saved text ที่ด้านล่างของ every post

มาเริ่มกันเลย:

ขั้นตอนที่ 1 สร้างข้อมูลเมตาของปลั๊กอิน

สร้างไฟล์ crunchify-hello-world.php และใส่โค้ดด้านล่างก่อน

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
< ? php
/**
* Crunchify Hello World Plugin is the simplest WordPress plugin for beginner.
* Take this as a base plugin and modify as per your need.
*
* @package Crunchify Hello World Plugin
* @author Crunchify
* @license GPL-2.0+
* @link https://crunchify.com/tag/wordpress-beginner/
* @copyright 2017 Crunchify, LLC. All rights reserved.
*
*            @wordpress-plugin
*            Plugin Name: Crunchify Hello World Plugin
*            Plugin URI: https://crunchify.com/tag/wordpress-beginner/
*            Description: Crunchify Hello World Plugin is the simplest WordPress plugin for beginner. Take this as a base plugin and modify as per your need.
*            Version: 3.0
*            Author: Crunchify
*            Author URI: https://crunchify.com/
*            Text Domain: crunchify-hello-world
*            Contributors: Crunchify
*            License: GPL-2.0+
*            License URI: http://www.gnu.org/licenses/gpl-2.0.txt
*/

ฟิลด์ด้านล่างนี้จำเป็นอย่างยิ่งและควรเฉพาะกับปลั๊กอินของคุณ:

  • ชื่อปลั๊กอิน
  • ปลั๊กอิน URI
  • คำอธิบาย
  • เวอร์ชั่น
  • ผู้เขียน
  • ผู้เขียน URI
  • โดเมนข้อความ
  • ผู้ร่วมสมทบ

ขั้นตอนที่ 2 เพิ่มส่วนเมนูย่อย

1
2
3
4
function crunchify_add_menu ( ) {
add_submenu_page ( "options-general.php" , "Crunchify Plugin" , "Crunchify Plugin" , "manage_options" , "crunchify-hello-world" , "crunchify_hello_world_page" ) ;
}
add_action ( "admin_menu" , "crunchify_add_menu" ) ;

เรากำลังใช้ add_action WordPress hook เพื่อเพิ่มเมนูย่อยสำหรับปลั๊กอินของเรา

ขั้นตอนที่ 3 สร้างหน้าการตั้งค่าปลั๊กอิน

ในกรณีของเรา Settings -> Crunchify Plugin

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
function crunchify_hello_world_page ( )
{
? >
< div class = "wrap" >
< h1 >
Hello World Plugin Template By < a
href = "https://crunchify.com/optimized-sharing-premium/" target = "_blank" > Crunchify < / a >
< / h1 >
 
< form method = "post" action = "options.php" >
             <?php
settings_fields ( "crunchify_hello_world_config" ) ;
do_settings_sections ( "crunchify-hello-world" ) ;
submit_button ( ) ;
?>
         < / form >
< / div >
 
<?php
}
 
function crunchify_hello_world_settings ( ) {
add_settings_section ( "crunchify_hello_world_config" , "" , null , "crunchify-hello-world" ) ;
add_settings_field ( "crunchify-hello-world-text" , "This is sample Textbox" , "crunchify_hello_world_options" , "crunchify-hello-world" , "crunchify_hello_world_config" ) ;
register_setting ( "crunchify_hello_world_config" , "crunchify-hello-world-text" ) ;
}
add_action ( "admin_init" , "crunchify_hello_world_settings" ) ;
 
function crunchify_hello_world_options ( ) {
?>
< div class = "postbox" style = "width: 65%; padding: 30px;" >
< input type = "text" name = "crunchify-hello-world-text"
value = " <?php
echo stripslashes_deep ( esc_attr ( get_option ( 'crunchify-hello-world-text' ) ) ) ; ?> " / >
Provide any text value here for testing < br / >
< / div >
< ? php
}
ย่อหน้าการตั้งค่าปลั๊กอิน Hello World

ขั้นตอนที่ 4 ต่อท้ายค่า Textfield ที่บันทึกไว้ในแต่ละโพสต์

1
2
3
4
add_filter ( 'the_content' , 'crunchify_com_content' ) ;
function crunchify_com_content ( $ content ) {
return $ content . stripslashes_deep ( esc_attr ( get_option ( 'crunchify-hello-world-text' ) ) ) ;
}
Hello World Plugin ต่อท้ายข้อความในแต่ละโพสต์

รหัสที่สมบูรณ์:

นี่คือรหัส Hello World WordPress Plugin ที่สมบูรณ์ เพียงคัดลอกด้านล่างและบันทึกเป็นไฟล์ crunchify-hello-world.php

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<?php
/**
* Crunchify Hello World Plugin is the simplest WordPress plugin for beginner.
* Take this as a base plugin and modify as per your need.
*
* @package Crunchify Hello World Plugin
* @author Crunchify
* @license GPL-2.0+
* @link https://crunchify.com/tag/wordpress-beginner/
* @copyright 2017 Crunchify, LLC. All rights reserved.
*
*            @wordpress-plugin
*            Plugin Name: Crunchify Hello World Plugin
*            Plugin URI: https://crunchify.com/tag/wordpress-beginner/
*            Description: Crunchify Hello World Plugin is the simplest WordPress plugin for beginner. Take this as a base plugin and modify as per your need.
*            Version: 3.0
*            Author: Crunchify
*            Author URI: https://crunchify.com/
*            Text Domain: crunchify-hello-world
*            Contributors: Crunchify
*            License: GPL-2.0+
*            License URI: http://www.gnu.org/licenses/gpl-2.0.txt
*/
 
/**
* Adding Submenu under Settings Tab
*
* @since 1.0
*/
function crunchify_add_menu ( ) {
add_submenu_page ( "options-general.php" , "Crunchify Plugin" , "Crunchify Plugin" , "manage_options" , "crunchify-hello-world" , "crunchify_hello_world_page" ) ;
}
add_action ( "admin_menu" , "crunchify_add_menu" ) ;
 
/**
* Setting Page Options
* - add setting page
* - save setting page
*
* @since 1.0
*/
function crunchify_hello_world_page ( ) {
?>
< div class = "wrap" >
< h1 >
Hello World Plugin Template By < a
href = "https://crunchify.com/optimized-sharing-premium/" target = "_blank" > Crunchify < / a >
< / h1 >
 
< form method = "post" action = "options.php" >
             <?php
settings_fields ( "crunchify_hello_world_config" ) ;
do_settings_sections ( "crunchify-hello-world" ) ;
submit_button ( ) ;
?>
         < / form >
< / div >
 
<?php
}
 
/**
* Init setting section, Init setting field and register settings page
*
* @since 1.0
*/
function crunchify_hello_world_settings ( ) {
add_settings_section ( "crunchify_hello_world_config" , "" , null , "crunchify-hello-world" ) ;
add_settings_field ( "crunchify-hello-world-text" , "This is sample Textbox" , "crunchify_hello_world_options" , "crunchify-hello-world" , "crunchify_hello_world_config" ) ;
register_setting ( "crunchify_hello_world_config" , "crunchify-hello-world-text" ) ;
}
add_action ( "admin_init" , "crunchify_hello_world_settings" ) ;
 
/**
* Add simple textfield value to setting page
*
* @since 1.0
*/
function crunchify_hello_world_options ( ) {
?>
< div class = "postbox" style = "width: 65%; padding: 30px;" >
< input type = "text" name = "crunchify-hello-world-text"
value = " <?php
echo stripslashes_deep ( esc_attr ( get_option ( 'crunchify-hello-world-text' ) ) ) ;
?> " / > Provide any text value here for testing < br / >
< / div >
<?php
}
 
/**
* Append saved textfield value to each post
*
* @since 1.0
*/
add_filter ( 'the_content' , 'crunchify_com_content' ) ;
function crunchify_com_content ( $content ) {
return $content . stripslashes_deep ( esc_attr ( get_option ( 'crunchify-hello-world-text' ) ) ) ;
}

ขั้นตอนที่ 5 สร้างไฟล์ readme.txt

นี่คือตัวอย่างไฟล์ปลั๊กอิน WordPress readme.txt

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
=== Crunchify Hello World Plugin ===
Contributors : Crunchify
Donate link : https : //www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=8ZF6WATLYFELQ
Tags : Hello World Plugin , Crunchify Plugins , Beginner WordPress , WordPress Plugin
Requires at least : 4.5
Tested up to : 4.7.4
Stable tag : 3.0
License : GPLv2 or later
License URI : http : //www.gnu.org/licenses/gpl-2.0.html
 
Create your fist plugin . Crunchify Hello World Plugin is the simplest WordPress plugin for beginner . Take this as a base plugin and modify as per your need .
 
== Description ==
 
Crunchify Hello World Plugin is the simplest WordPress plugin for beginner if you want to start creating fresh new plugin . Take this as a base plugin and modify as per your need .
 
== Installation ==
1. Unpack the ` download - package ` .
2. Upload the file to the ` / wp - content / plugins / ` directory .
3. Activate the plugin through the ` Plugins ` menu in WordPress .
4. Done and Ready .
 
== Frequently Asked Questions ==
 
= How to add FAQ question =
* just add your FAQ questions here
 
== Screenshots ==
1. This is a text label for your first screenshot
2. Add more screenshot labels as new line
 
== Changelog ==
 
= 3.0 =
* Initial release

ตอนนี้อะไร?

  • เพียงสร้างโฟลเดอร์ crunchify-hello-world ภายใต้ /plugins folder และเพิ่มการคัดลอกไฟล์ทั้งสองที่นั่น
  • ไปที่คอนโซลผู้ดูแลระบบ -> ปลั๊กอิน
  • เปิดใช้งานปลั๊กอิน

แค่นั้นแหละ.

เริ่มเขียนปลั๊กอิน WordPress ตัวแรกของคุณ

ใช้รหัสนี้ as a sample ของฐานปลั๊กอิน WordPress แรกของคุณ และแก้ไขตามความต้องการของคุณ ในบทช่วยสอนถัดไป เราจะพูดถึงฟิลด์อาร์เรย์ที่ซับซ้อนมากขึ้นสำหรับฟังก์ชันการทำงานเพิ่มเติม

โปรดคอยติดตามและบล็อก Happy.