Jak stworzyć pierwszą wtyczkę WordPress? Wycieczka z przewodnikiem krok po kroku z przykładowym kodem

Opublikowany: 2017-04-27

Jak stworzyć wtyczkę do WordPressa i zacząć korzystać z tworzenia wtyczek WordPress?

Jesteś nowym programistą WordPress? Czy zacząłeś ostatnio pracować nad WordPressem? Czy chcesz stworzyć nową wtyczkę WordPress?

Jak stworzyć wtyczkę wordpress od podstaw? Cóż, jesteś we właściwym miejscu.

W tym samouczku omówimy tworzenie od podstaw Hello World WordPress Plugin . To jest przewodnik krok po kroku w samouczku tworzenia wtyczek WordPress.

Zanim zaczniemy, oto projekt wtyczki WordPress i to, co zamierzamy zrobić:

  1. Stworzymy prostą wtyczkę Hello World WordPress
  2. Utwórz plik crunchify-hello-world.php , który zawiera cały kod wtyczki
  3. Utwórz plik readme.txt z podstawowymi informacjami
    • Metadane wtyczki
    • Opis
    • Kroki instalacji
    • Sekcja FAQ
    • Zrzuty ekranu
    • Dziennik zmian
  4. Wtyczka będzie miała poniższe funkcjonalności
    • Nowe menu Crunchify Plugin w menu Settings
    • Nowa admin page wtyczki
    • Użytkownik będzie miał możliwość add value do jednego Textfield
    • Save button aby zapisać ustawienia
    • Wtyczka append saved text na dole every post

Zacznijmy:

Krok-1 Utwórz metadane wtyczki.

Utwórz plik crunchify-hello-world.php i najpierw umieść poniższy kod.

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

Poniższe pola są absolutnie wymagane i powinny być unikalne dla Twojej wtyczki:

  • Nazwa wtyczki
  • URI wtyczki
  • Opis
  • Wersja
  • Autor
  • URI autora
  • Domena tekstowa
  • Współtwórcy

Krok 2 Dodaj sekcję podmenu

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" ) ;

Używamy haka add_action WordPress, aby dodać podmenu dla naszej wtyczki.

Krok 3 Utwórz stronę ustawień wtyczki

W naszym przypadku 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
}
Strona ustawień wtyczki Crunchify Hello World

Krok 4 Dołącz zapisaną wartość pola tekstowego do każdego postu

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' ) ) ) ;
}
Wtyczka Hello World dołącza tekst do każdego posta

Pełny kod:

Oto kompletny kod Hello World WordPress Plugin . Po prostu skopiuj go poniżej i zapisz do pliku 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' ) ) ) ;
}

Krok 5 Utwórz plik readme.txt

Oto przykładowy plik readme.txt wtyczki WordPress.

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

Co teraz?

  • Po prostu utwórz folder crunchify-hello-world w /plugins folder i dodaj tam skopiuj oba pliki.
  • Przejdź do Konsoli administracyjnej -> Wtyczki
  • Aktywuj wtyczkę

Otóż ​​to.

Zacznij pisać swoją pierwszą wtyczkę WordPress

Weź ten kod as a sample swojej pierwszej bazy wtyczek WordPress i zmodyfikuj go zgodnie z potrzebami. W następnym samouczku omówimy bardziej złożone pola tablicowe, aby uzyskać więcej funkcjonalności.

Bądź na bieżąco i życzę miłego blogowania.