Pełny przewodnik po tworzeniu pluginów dla WordPress: jak stworzyć swój pierwszy funkcjonalny plugin z niczego

Przed rozpoczęciem upewnij się, że masz dostęp do lokalnego lub online środowiska WordPress przeznaczonego do rozwoju i testowania. Dobrym wyborem będzie środowisko typu Local, XAMPP lub MAMP. Ponadto potrzebny będzie komputer z zainstalowanym edytorem kodu (np. Visual Studio Code, PhpStorm) oraz podstawowe znajomości języków PHP, HTML, CSS i JavaScript.

Posiadanie jasnego środowiska rozwoju stanowi podstawę dla dalszych prac – umożliwia skupienie się na logice kodu, a nie na konfiguracji środowiska.

Stworz swoj pierwszy plik z rozszerzeniem (plugin).

Aplikacja rozszerzająca WordPress musi mieć co najmniej jedno główne plików PHP, które musi zawierać specjalny komentarz z nagłówkiem, służący do podania metadanych do systemu WordPress.

Polecamy lekturę. Pełny przewodnik po rozwoju pluginów dla WordPress: budowanie profesjonalnych rozszerzeń od zera。

Komentarze w nagłówkach plików rozszerzeń (plug-inów) oraz w głównym pliku programu

Najpierw, w katalogu instalacji WordPress… wp-content/plugins/ W folderze utwórz nowy folder, na przykład… my-first-pluginW tej folderze utwórz plik główny. my-first-plugin.phpNa początku pliku musi być dodana standardowa komenda z informacjami o wtyczce (plugin header).

UltaHost – hostingu dla stron WordPress

Gwarancja zwrotu pieniędzy w ciągu 30 dni, nieograniczony przepustowość sieci i dostęp do bazy danych, bezpłatna ochrona przed atakami typu DDoS. Promocja: 50% przy zakupie na 3 lata.

strona dostępu

<?php
/**
 * Plugin Name:       我的第一个功能插件
 * Plugin URI:        https://yourwebsite.com/my-first-plugin
 * Description:       这是一个学习 WordPress 插件开发的示例插件，用于在前端页面底部添加自定义文本。
 * Version:           1.0.0
 * Author:            你的名字
 * Author URI:        https://yourwebsite.com
 * License:           GPL v2 or later
 * Text Domain:       my-first-plugin
 */

Ten komentarz stanowi “dowód tożsamości” pluginu. WordPress odczytuje go, by uzyskać informacje o funkcjach i działaniu pluginu. Plugin Name Nazwa wtyczki będzie wyświetlona na ekranie zarządzania w tle, a inne informacje, takie jak numer wersji i opis, pojawią się w odpowiednich miejscach. Po zapisaniu pliku będzie można zobaczyć tę nieaktywną wtyczkę na stronie “Wtyczki” w panelu administracyjnym WordPress.

Implementacja funkcji: Dodanie „hooków” do działań (action hooks).

Logika wtyczek jest głównie implementowana za pomocą systemu hooków w WordPress. Będziemy go używać. wp_footer Ten „hook” akcji wyświetla tekst w nagłówku strony internetowej.

Poniżej komentarza w nagłówku pliku rozszerzenia dodaj następujący kod:

// 在网站页脚添加自定义文本
function mfp_add_footer_text() {
    echo '<p style="text-align: center; color: #666;">Dziękujemy za czytanie! Ten nagłówek strony został wygenerowany przez “Moje pierwsze funkcjonalne dodatki” („My First Functional Plugins”).</p>';
}
add_action( 'wp_footer', 'mfp_add_footer_text' );

Tu stworzyliśmy coś, co nazywa się… mfp_add_footer_text Użyj własnej funkcji, a potem z niej korzystaj. add_action() Funkcja “przypisuje” tę inną funkcję do odpowiedniego miejsca w programie. wp_footer Na tym haczu. Gdy WordPress dotrze do sekcji nagłówka strony (footer), automatycznie wywoła naszą funkcję, która wyświetli ten fragment HTML.

Polecamy lekturę. Krok po kroku twórz swój pierwszy wtyczkę WordPress: od podstaw do zaawansowanego rozwoju.。

Dodać stronę z ustawieniami do zarządzania pluginem

W pełni funkcjonalny plugin wymaga interfejsu konfiguracji w tle, aby użytkownicy mogli zmieniać zachowanie pluginu bez konieczności edycji kodu. Stworzymy prostą stronę z opcjami.

Utwórz element menu administracyjnego.

Najpierw musimy użyć… add_action( ‘admin_menu’, … ) Dodaj nowy element menu w panelu administracyjnym. W swoim głównym pliku pluginu kontynuuj dodawanie następującego kodu:

// 添加管理菜单
function mfp_add_admin_menu() {
    add_menu_page(
        '我的插件设置',          // 页面标题
        '我的插件',             // 菜单标题
        'manage_options',       // 权限要求
        'mfp-settings',         // 菜单slug
        'mfp_settings_page',    // 显示页面内容的回调函数
        'dashicons-admin-generic', // 图标（使用Dashicons）
        30                      // 菜单位置
    );
}
add_action( 'admin_menu', 'mfp_add_admin_menu' );

add_menu_page() Funkcje dostępne w ramach API serca WordPress umożliwiają dodawanie najwyższego poziomu menu do lewej nawigacji. Określiliśmy uprawnienia potrzebne do wykonywania tego działania. manage_optionsZwykle dostęp do tego mają tylko administratorzy.

hosting.com Hosting współdzielony

Wysoka wydajność dzięki procesorom AMD EPYC, pamięci masowej NVMe SSD i LiteSpeed, wewnętrzne wsparcie ekspertów 24/7, zaawansowane środki bezpieczeństwa, w tym SSL, brute force, ochrona przed złośliwym oprogramowaniem i DDoS, oszczędność do 73%

strona dostępu

Tworzenie strony konfiguracji i formularza

Następnie musimy definiować powyżej wspomnianą funkcję obsługiwania wywołań (callback function). mfp_settings_page Zadanie polega na renderowaniu zawartości HTML strony z ustawieniami oraz na obsłudze procesu zapisywania danych z formularza.

// 设置页面的HTML内容
function mfp_settings_page() {
    // 检查用户权限
    if ( !current_user_can( ‘manage_options’ ) ) {
        return;
    }

// 处理表单提交
    if ( isset( $_POST[‘mfp_footer_text’] ) ) {
        // 验证和清理输入数据
        $new_text = sanitize_text_field( $_POST[‘mfp_footer_text’] );
        // 使用 update_option 将数据保存到数据库
        update_option( ‘mfp_footer_text’, $new_text );
        echo ‘<div class="“notice" notice-success is-dismissible”><p>Ustawienia zostały zapisane!</p></div>’;
    }

// 从数据库获取现有值，用于填充表单
    $current_text = get_option( ‘mfp_footer_text’, ‘这是默认的页脚文本。’ );
    ?&gt;
    <div class="“wrap”">
        <h1>Ustawienia mojej wtyczki.</h1>
        <form method="“post”" action="/pl/“”/" data-trp-original-action="“”">
            <?php wp_nonce_field( ‘mfp_save_settings’, ‘mfp_settings_nonce’ ); ?>
            <table class="“form-table”">
                <tr>
                    <th scope="“row”"><label for="“mfp_footer_text”">Udostępniony tekst do personalizacji nagłówka strony (footer).</label></th>
                    <td>
                        <input name="“mfp_footer_text”" type="“text”" id="“mfp_footer_text”" value="“NO NUMERIC NOISE KEY" 1001” class="“regular-text”">
                        <p class="“description”">Ten tekst będzie wyświetlany na dole wszystkich stron na stronie internetowej.</p>
                    </td>
                </tr>
            </table>
            <?php submit_button(); ?>
        <input type="hidden" name="trp-form-language" value="pl"/></form>
    </div>
    &lt;?php
}

Ta funkcja wykonała kilka kluczowych zadań: sprawdzenie upoważnień oraz obsługię wysyłania formularzy (z użyciem…). update_option Można zauważyć, że tekst dotyczy procesów magazynowania danych, a także renderowania interfejsów formularzy. W tekście zostało użyte słowo „użyto” („Note used”). sanitize_text_field() 和 esc_attr() Można używać różnych funkcji bezpieczeństwowych, aby zapobiec atakom typu XSS (Cross-Site Scripting).

Umożliwienie konfiguracji funkcji

Teraz musimy zmienić funkcję, która wcześniej wyświetlała tekst w nagłówku strony, aby ta funkcja czytała ustawienia użytkownika z bazy danych zamiast wyświetlać tekst ustawiony w kodzie.

Polecamy lekturę. Opanowanie rozwoju pluginów dla WordPress od zera: pełny przewodnik i praktyczne ćwiczenia。

// 更新页脚文本函数，使其可配置
function mfp_add_footer_text() {
    // 从数据库获取保存的文本，如果没有则使用默认值
    $footer_text = get_option( ‘mfp_footer_text’, ‘感谢阅读！本页脚由“我的第一个功能插件”生成。’ );
    if ( !empty( $footer_text ) ) {
        echo ‘<p style="“text-align:" center; color: #666;”>’ . esc_html( $footer_text ) . ‘</p>’;
    }
}
add_action( ‘wp_footer’, ‘mfp_add_footer_text’ );

Tak oto powstaje dodatek, który posiada podstawowe funkcje zarządzania witryną w tle. Użytkownicy mogą edytować tekst w obszarze administracyjnym, a zmiany są natychmiast widoczne na stronie internetowej.

Najlepsze praktyki rozwoju pluginów oraz aspekty bezpieczeństwa

Dodróżowanie najlepszych praktyk nie tylko poprawia jakość kodu, ale także gwarantuje bezpieczeństwo i kompatybilność pluginów.

Hosting współdzielony InterServer

Hosting współdzielony $2.50 USD miesięcznie, pierwszy miesiąc $0.1 USD kod promocyjny tryinterserver, 461 skryptów aplikacji w chmurze, instalacja jednym kliknięciem.

strona dostępu

Używanie prefiksów i przestrzeni nazw

Wszystkie przez ciebie definiowane funkcje, klasy, zmienne oraz nazwy opcji muszą mieć unikalne prefiksy, aby uniknąć konfliktów z core’em WordPress, tematami lub innymi pluginami. W tym przykładzie użyliśmy… mfp_ „(Moje pierwsze plugin)” jako prefiks. Dla bardziej złożonych pluginów można zastanowić się nad użyciem przestrzeni nazw w PHP.

Weryfikacja danych, ich przygotowanie do dalszego wykorzystania oraz użycie specjalnych znaków („escape”)

To jest istotą bezpieczeństwa wtyczek. Każdy wpis pochodzący od użytkowników (włącznie z administratorami) musi być traktowany jako niepoważny (niewiarygodny).
* 验证 (Validation): 检查数据是否符合预期格式（如是否为邮箱、数字）。
* 清理 (Sanitization): 在将数据存入数据库或用于其他操作前，移除其中的非法或危险字符。我们使用了 sanitize_text_field()。
* 转义 (Escaping): 在将数据从数据库输出到 HTML、JavaScript 或 URL 时，进行转义以防止 XSS 攻击。我们使用了 esc_html() 和 esc_attr()。

Przygotowanie do internacionalizacji

Aby plugin mógł zostać przetłumaczony przez użytkowników z całego świata, wszystkie teksty skierowane do użytkowników muszą zostać umieszczone w zagnieżdżeniu funkcji internacionalizacji WordPress. Zmienijmy sposób wyświetlania tekstów w naszym pluginie.

echo ‘<p style="“text-align:" center; color: #666;”>’ . esc_html__( ‘感谢阅读！本页脚由“我的第一个功能插件”生成。’, ‘my-first-plugin’ ) . ‘</p>’;

I upewnij się, że w komentarzach na początku pliku rozszerzenia (plugin header) ustawione są poprawne wartości. Text DomainNastępnie użyj takiego narzędzia jak Poedit, aby stworzyć plik szablonu w formacie .pot.

Debugowanie, testowanie oraz przygotowanie do publikacji

Przed wdrożeniem wtyczki do środowiska produkcyjnego lub przed jej udostępnieniem w oficjalnym katalogu niezbędne jest dokładne testowanie.

Włączyć tryb debugowania

W pliku konfiguracji WordPress wp-config.php Włączenie trybu debugowania umożliwia widzenie błędów, ostrzeżzeń i informacji o problemach w PHP, co jest niezwykle przydatne podczas rozwoju aplikacji.

define( ‘WP_DEBUG’, true );
define( ‘WP_DEBUG_LOG’, true ); // 将错误记录到 wp-content/debug.log 文件
define( ‘WP_DEBUG_DISPLAY’, false ); // 不在页面上直接显示错误

Przeprowadzenie testów funkcjonalnych i kompatybilnościści

• Test funkcjonalności: sprawdź każdą z funkcji pluginu pojedynczo: aktywacja/deaktywacja, zapis ustawień, sprawdź, czy wyświetlenie na stronie klienta jest poprawne.
• Testy zgodności: sprawdź, jak twój plugin funkcjonuje na różnych wersjach WordPress (zwłaszcza starszych), wersjach PHP (7.4+ i 8.x), a także w połączeniu z popularnymi tematami i innymi często używanymi pluginami.
• Sprawdzenie bezpieczeństwa: Można użyć automatyzowanych narzędzi lub ręcznego sprawdzania kodu, aby upewnić się, że nie występują żadne wady, takie jak SQL injection, XSS czy CSRF. Pole „Nonce”, które dodaliśmy wcześniej, ma właśnie za cel zapobieganie atakom typu CSRF.

Gotowe do publikacji pliki.

Jeśli planujesz publikację, konieczna jest standardowa struktura pliku. Standardowa struktura pliku zwykle zawiera następujące elementy:
* 主插件文件 (如 my-first-plugin.php)
* readme.txtMusi zostać napisany zgodnie z formatem wymaganym przez WordPress.org, aby został wyświetlony na stronie katalogu pluginów.
* assets folder: Zawiera ikony, zdjęcia ekranu itp.
* languages folder: Miejsce na pliki tłumaczeniowe (.po/.mo).
* includes folder: Zbiór innych plików z klasyfikacją PHP.
* uninstall.phpDefinowanie procedur czyszczenia po usunięciu wtyczki (np. usunięcie danych z bazy danych).

Podsumowanie.

Przez ten przewodnik przeszliście przez cały proces tworzenia podstawowego wtyczka funkcjonalnego dla WordPressa: od stworzenia głównego pliku zawierającego standardowe informacje nagłówkowe, poprzez dodawanie funkcji za pomocą haków akcji (action hooks), aż po budowę kompletnego strony konfiguracji w panelu administracyjnym oraz zapewnienie jej bezpieczeństwa. Zwróciliśmy uwagę na najlepsze praktyki, takie jak używanie prefiksów, bezpieczne obsługiwanie danych oraz internacionalizacja, a także krótko opisaliśmy przygotowania przed debugowaniem i publikacją wtyczka.

Pamiętaj, że esencją rozwoju pluginów jest zrozumienie i umiejętne wykorzystanie rozwiniętego systemu hooków (Hooks) i filtrów (Filters) w WordPress. Od tego prostego pluginu możesz dalej eksplorować możliwości dodawania skrótów kodu (Shortcodes), widgetów, własnych typów artykułów (Custom Post Types – CPT) lub punktów końcowych API typu REST, aby stworzyć silne, elastyczne i standardowe pluginy przeznaczone do biznesowego użytkowania.

FAQ – najczęściej zadawane pytania.

W jakim katalogu muszą być umieszczone pliki rozszerzeń (plug-inów)?

Wtyczki WordPress muszą być umieszczone w wp-content/plugins/ W katalogu każdy plugin może być osobnym plikiem PHP (jest to szczególnie popularne w przypadku minimalistycznych rozwiązań), ale częściej praktykuje się tworzenie foldera o nazwie pluginu, w którym umieszcza się plik główny oraz inne pliki związane z jego działaniem.

Jak usunąć dane utworzone przez dodatki (pluginy)?

Gdy użytkownik w tle naciska na przycisk “Usun”, standardowo są usuwane tylko pliki pluginu, natomiast informacje o pluginie zapisane w tabeli opcji w bazie danych pozostają nietknięte.wp_optionsDane zawarte w tym pliku zostaną zachowane. Aby dokonać całkowitego usunięcia wszystkich informacji, należy stworzyć nowy plik. uninstall.php Plik, i użyć go w tym celu. delete_option() Funkcja służy do usunięcia odpowiednich opcji. Ten plik zostanie wywołany tylko wtedy, gdy użytkownik usunie plugin za pomocą funkcji usuwania w WordPress.

W jaki sposób różnią się działania (actions) i filtry (filters) w ramach mechanizmu hooków?

Haki akcji (Action Hooks), używane do… add_action()Dzięki temu można w określonym momencie podczas działania WordPressa włączyć i uruchomić fragment kodu, który nie wymaga powrotu żadnego wyniku. Można to zrobić na przykład w nagłówku strony, w nagłówku lub u dołu strony lub w momencie publikacji artykułu, wykonując określoną funkcję.

Haki filtrów (Filter Hooks), używane do... add_filter()Dzięki temu można modyfikować dane przekazywane w ramach procesu. Funkcja przyjmuje jeden argument, po jego obróbce musi zwrócić inny argument. Na przykład można zmienić nagłówek artykułu, treść komentarza lub wyniki wyszukiwania.

Dlaczego mój plugin nie jest wyświetlany w tle (w obszarze działania aplikacji)?

Najpierw sprawdź, czy główny plik PHP twojego pluginu znajduje się w właściwym katalogu, a także czy zawiera stosowne komentarze opisujące strukturę pluginu (zwłaszcza…). Plugin Name:Pierwszą rzeczą jest sprawdzenie, czy format pliku jest poprawny. Następnie trzeba sprawdzić, czy w pliku nie znajdują się żadne błędy gramatyczne. Możesz to zrobić za pomocą różnych narzędzi do analizy kodu. wp-config.php Włączyć w… WP_DEBUG Sprawdź, czy nie ma żadnych informacji o błędach.