如何創建第一個 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. 插件將具有以下功能
    • Settings菜單下的新菜單Crunchify Plugin
    • 新插件admin page
    • 用戶可以選擇向一個Textfield add value
    • 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
  • 文本域
  • 貢獻者

Step-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 掛鉤為我們的插件添加子菜單。

Step-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
}
Crunchify Hello World 插件設置頁面

步驟 4 將保存的文本字段值附加到每個帖子

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 插件將文本附加到每個帖子

完整代碼：

這是一個完整的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' ) ) ) ;
}

Step-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

怎麼辦？

  • 只需在/plugins folder下創建文件夾crunchify-hello-world並在其中添加兩個文件。
  • 轉到管理控制台 -> 插件
  • 激活插件

而已。

開始編寫您的第一個 WordPress 插件

將此代碼as a sample ，並根據您的需要進行修改。 在下一個教程中，我們將介紹一些更複雜的數組字段以獲得更多功能。

請繼續關注和快樂的博客。