Van nul beginnen: Een volledig handboek en praktische tutorial voor het ontwikkelen van WordPress plugins

Forbereidende werkzaamheden en opzet van de omgeving

Voor het ontwikkelen van een WordPress-plugin is het van belang om een stabiele lokale ontwikkelomgeving op te zetten. Dit maakt het mogelijk om tests en foutopsporingen uit te voeren zonder dat de online website wordt beïnvloed.

Keuze en instelling van een lokale ontwikkelingsomgeving

Het belangrijkste stap is om een lokale server op te zetten die PHP, MySQL en Apache/Nginx integreert. Je kunt hierbij kiezen voor...MAMP、XAMPPDankzij dergelijke integratiepakketten is het eenvoudig om de software te installeren op Windows en macOS. Voor meer ervaren gebruikers zijn er ook uitgebreidere mogelijkheden beschikbaar.DockerHet containeriseren van je ontwikkelomgeving is de huidige beste praktijk, omdat dit een consistente omgeving garandeert en het gemakkelijk maakt om deze omgeving te repliceren. Ongeacht welke methode je kiest, moet je ervoor zorgen dat je PHP-versie compatibel is met de versie waarop de plugins zijn ontworpen (bijvoorbeeld PHP 7.4 of later), en dat de nodige PHP-uitbreidingen zijn geactiveerd, zoals MySQLi of PDO.

Installatie en configuratie van WordPress

Nadat je de lokale serveromgeving hebt voorbereid, moet je de kern van WordPress installeren. Download de meest recente stabiele versie van WordPress van de officiële website van WordPress.org en extracteer deze in de webwurkmap van je server (bijvoorbeeld: `/www/`).htdocs或wwwDe plugin vind je in een map onder de genoemde map. Vervolgens kun je de map bereiken via je browser en volg je de bekende “vijf-minuten-installatie-stappen” om de plugin te installeren. Het is aan te raden om een speciale database aan te maken voor het ontwikkelen van plugins, en de naam van de database, je gebruikersnaam en wachtwoord te noteren. Na de installatie kun je inloggen in het WordPress-beheerpaneel en de standaardstructuur van de permanente links (permanent links) wijzigen naar een alternatieve indeling, bijvoorbeeld “artikelnaam”. Dit helpt bij het testen van de compatibiliteit van de plugin met deze permanente links.

Aanbevolen leesmateriaal Een beginnetje met het ontwikkelen van WordPress-thema's: hoe je je eerste aangepaste thema vanaf nul maakt.。

Recomendaties voor essentiële ontwikkelingshulpmiddelen

Efficiënte ontwikkeling is niet mogelijk zonder geschikte tools. Allereerst heb je een code-editor nodig, bijvoorbeeld een gratis en krachtige editor.Visual Studio CodeInstalleer plugins die geschikt zijn voor PHP, WordPress en intelligent codeherkenning. Ook een tool voor versiebeheer is nodig.GitHet is een essentieel hulpmiddel voor het beheersen van codeveranderingen en het bijhouden van een historie van deze veranderingen. De ontwikkelaarsinstrumenten van browsers (Chrome DevTools of Firefox Developer Edition) zijn zeer belangrijk voor het opsporen en oplossen van problemen in het front-end. Ten slotte is het verstandig om een tool voor het controleren van de kwaliteit van de code te installeren.PHP_CodeSnifferCombiningWordPress-Coding-StandardsEen set met regels helpt je om de officiële coderingstandaarden van WordPress te volgen.

UltaHost WordPress-hosting

30-daagse garantie voor het terugbetalen van het geld, onbeperkt bandbreedte- en databestand, gratis DDoS-beveiliging, en een prijsvoordeel van 50% bij een aankoop van 3 jaar.

toegangspagina

De basisstructuur van plugins en de belangrijkste bestanden

Een standaard WordPress-plugin heeft een bepaalde directory- en bestandsstructuur. Het naleven van deze regels is essentieel voor het feit dat het plugin door het systeem wordt herkend en goed kan worden beheerd.

De basisstructuur van een hoofdbestand en de rol ervan

Elk plugin moet een hoofdPHP-bestand hebben, dat fungeert als ingangspunt voor het plugin. De commentaren aan het begin van dit bestand bevatten de metadata van het plugin, en dit is essentieel voor WordPress om het plugin te herkennen. Hier vindt u een voorbeeld van het meest basistische hoofdbestand voor een plugin:my-first-plugin.phpVoorbeeld:

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

// 防止直接文件访问
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}

Plugin NameDit is het enige vereiste veld; het wordt gebruikt om de plugins in de achtergrondlijst te weergeven. Het wordt aanbevolen om dit veld te definiëren.ABSPATHControleer om te voorkomen dat kwaadwillige gebruikers rechtstreeks toegang krijgen tot de kernbestanden van de plugin.

Voor het toevoegen van functionele kerncode aan een plugin:

Naast de commentaren in het hoofddeel van het bestand, kun je met de schrijfwerkzaamheden voor de functionaliteit van het plugin beginnen. Het simpelste voorbeeld is om een “Hello World”-bericht te toevoegen aan de beheeromgeving. Hier kun je gebruikmaken van…add_actionDe hook maakt het mogelijk om een aangepaste functie te koppelen aan een specifiek uitvoerpunt in WordPress.

Aanbevolen leesmateriaal Van nul tot held: een volledige gids en praktische tutorial voor het ontwikkelen van WordPress-plug-ins.。

/**
 * 在管理后台顶部显示欢迎信息
 */
function myfp_display_admin_notice() {
    echo '<div class="notice notice-success is-dismissible"><p>Welkom bij “Mijn eerste plugin”!</p></div>';
}
add_action( 'admin_notices', 'myfp_display_admin_notice' );

Om de organisatie van de code te behouden en namenconflicten te voorkomen, moeten alle functie- en klassennamen een unieke prefix hebben, zoals hier gebruikt wordt.myfp_(My First Plugin is the abbreviation for 'Mijn eerste plugin'.)

Organisatievoorschriften voor de pluginmap en resourcebestanden

Een plugin met enkele meer complexe functies bevat meestal meerdere bestanden. Een goed georganiseerde directorystructuur kan de onderhoudbaarheid aanzienlijk verbeteren. Enkele veel voorkomende manieren van organisatie zijn als volgt:
- /assets/Hier worden statische bronnen opgeslagen, zoals CSS, JavaScript, afbeeldingen en fonts.
- /includes/Deze map bevat de belangrijkste PHP-klassen en functionele bestanden.
- /admin/Hier worden PHP-, CSS- en JS-bestanden opgeslagen die alleen te maken hebben met de administratieve backend.
- /public/Hier worden de relevante bestanden voor de front-end van de website opgeslagen.
- /languages/Plaats hier de internationale vertaalmappen (.po, .mo).

Houd altijd in gedachten dat de hoofdpluginbestand zich bevindt in de wortelmap van de plugin. Wanneer je in je code naar resourcebestanden verwijst, moet je deze bestanden op deze manier opnoemen.plugin_dir_url( FILE )或plugin_dir_path( FILE )De juiste URL of serverpad moet dynamisch worden opgehaald.

hosting.com gedeelde hosting

Hoge prestaties met AMD EPYC CPU's, NVMe SSD opslag en LiteSpeed, 24/7 deskundige interne ondersteuning, geavanceerde beveiligingsmaatregelen waaronder SSL, bescherming tegen brute kracht, malware en DDoS, besparingen tot 73%

toegangspagina

Het hookmechanisme interageert met de kern-API (Core API).

De essentie van het ontwikkelen van WordPress-plug-ins ligt in het “hook”-systeem. Dit systeem biedt de mogelijkheid om je eigen code op specifieke momenten in te voegen en uit te voeren, bijvoorbeeld in het kernprogramma van WordPress, in thema’s of in andere plug-ins.

Het begrijpen van action-hooks en filter-hooks

Er zijn twee grote categorieën voor hooks: Action-hooks en Filter-hooks. Action-hooks worden gebruikt om je code uit te voeren wanneer een bepaald evenement plaatsvindt, bijvoorbeeld nadat een artikel is gepubliceerd of voordat een pagina wordt geladen. Ze returneren geen waarde; ze doen simpelweg iets. De belangrijkste functie die hierbij wordt gebruikt is…add_action()和do_action()De filter-haken worden gebruikt om gegevens te bewerken. Voorafgaand aan het gebruik, opslaan of weergeven van de gegevens, kun je deze gegevens opvangen en veranderen. De filter-haken moeten een waarde teruggeven. De kernfunctie die hierbij wordt gebruikt is…add_filter()和apply_filters()。

Een zelfgemaakte functie mounten op een standaard-hook

WordPress biedt honderden standaard-hooks aan. Je kunt bijvoorbeeld automatisch een auteursverklaring toevoegen aan het eind van een artikel, waardoor je zowel acties (actions) als filters kunt gebruiken.

Aanbevolen leesmateriaal WordPress-pluginontwikkeling: van het begin tot de volmaakte beheersing: stap voor stap leert u hoe u eigen functies maakt。

// 使用过滤器修改文章内容
function myfp_add_copyright_to_content( $content ) {
    if ( is_single() ) {
        $copyright_text = '<p><em>Voor het reproduceren van dit materiaal moet de bron worden vermeld.</em></p>';
        $content .= $copyright_text;
    }
    return $content;
}
add_filter( 'the_content', 'myfp_add_copyright_to_content' );

// 使用动作在文章保存时执行操作
function myfp_log_post_publish( $post_id ) {
    // 记录日志或执行其他后处理
    error_log( "文章 ID {$post_id} 已发布。" );
}
add_action( 'publish_post', 'myfp_log_post_publish' );

Maak en biede custom-hooks aan voor uitbreidingen.

Een goed ontworpen plugin moet ook toestaan dat andere ontwikkelaars het verder uitbreiden. Dit kan je doen door je eigen, aangepaste ‘hooks’ (verbindingspunten) te creeren. Dit zie je terug in de openheid van de plugin-architectuur en past ook bij de filosofie van WordPress zelf.

// 定义一个自定义动作钩子
function myfp_process_data() {
    $data = '一些初始数据';
    // 其他开发者可以通过 ‘myfp_before_action’ 在此处插入代码
    do_action( 'myfp_before_action', $data );

// 插件的主要处理逻辑...

// 其他开发者可以通过 ‘myfp_after_action’ 在此处插入代码
    do_action( 'myfp_after_action', $data );
}

// 定义一个自定义过滤器钩子
function myfp_get_output() {
    $output = '默认输出';
    // 允许其他开发者过滤最终的输出
    return apply_filters( 'myfp_filter_output', $output );
}

Een interface voor het beheersen van plugins en instellingen maken

De meeste plugins vereisen een achtergrondscherm waarop de gebruiker instellingen kan maken. WordPress biedt verschillende API's aan om het snel en veilig mogelijk te maken om standaard instellingsschermen en opties te bouwen.

InterServer gedeelde hosting

Shared hosting $2.50 USD per maand, eerste maand $0.1 USD promo code tryinterserver, 461 cloud apps scripts, een klik te installeren.

toegangspagina

Beheer de beveiligingsopties met de setting API.

De WordPress Settings API is een veilig framework voor het verwerken van formulieren, het controleren van gegevens, het opslaan van instellingen en het weergeven van deze gegevens. Het verzorgt automatisch de beveiliging van nonce-velden en controleert de toegangsrechten. De basisstappen voor het maken van een instellingenpagina zijn: 1) registreren van de instellingen, 2) toevoegen van instellingenblokken en 3) toevoegen van instellingenonderdelen. De volgende code demonstreert hoe je een eenvoudige instelling kunt registreren:

function myfp_register_settings() {
    register_setting(
        'myfp_settings_group', // 选项组名
        'myfp_option_name',    // 选项名（存储在wp_options表中）
        array( 'sanitize_callback' => 'myfp_sanitize_callback' ) // 消毒回调函数
    );

add_settings_section(
        'myfp_settings_section', // 区块ID
        '基本设置',               // 区块标题
        'myfp_section_callback', // 区块回调函数（可输出描述）
        'myfp-settings-page'     // 设置页面Slug
    );

add_settings_field(
        'myfp_text_field',      // 字段ID
        '示例文本输入',         // 字段标签
        'myfp_text_field_callback', // 字段回调函数（输出HTML表单域）
        'myfp-settings-page',   // 页面Slug
        'myfp_settings_section' // 所属区块ID
    );
}
add_action( 'admin_init', 'myfp_register_settings' );

Maak menu- en submenupagina's voor verschillende locaties.

Je moet de link naar de instellingenpagina toevoegen aan het beheermenu van WordPress. Gebruik hiervooradd_menu_page()Je kunt een topmenu maken en hiermee gebruikmaken van…add_submenu_page()Je kunt ondermenues maken.

function myfp_add_admin_menu() {
    // 添加顶级菜单
    add_menu_page(
        '我的插件设置',        // 页面标题
        '我的插件',            // 菜单标题
        'manage_options',     // 权限能力
        'myfp-settings-page', // 菜单Slug
        'myfp_render_settings_page', // 渲染页面的回调函数
        'dashicons-admin-generic', // 图标（可选）
        80                    // 菜单位置
    );

// 添加子菜单（指向同一个页面，但菜单标题不同）
    add_submenu_page(
        'myfp-settings-page', // 父菜单Slug
        '关于此插件',         // 页面标题
        '关于',              // 菜单标题
        'manage_options',    // 权限能力
        'myfp-about-page',   // 菜单Slug
        'myfp_render_about_page' // 渲染回调
    );
}
add_action( 'admin_menu', 'myfp_add_admin_menu' );

De callback-functie voor het weergeven van de pagina met aangepaste instellingen

myfp_render_settings_pageDe callback-functie is verantwoordelijk voor het genereren van de HTML-structuur van de instellingenpagina. In deze functie moet je een aantal methoden oproepen.settings_fields()和do_settings_sections()Wees gerust, ik zal de door de Settings API geregistreerde velden voor je opgeven.

function myfp_render_settings_page() {
    // 检查用户权限
    if ( ! current_user_can( 'manage_options' ) ) {
        return;
    }
    ?>
    <div class="wrap">
        <h1><?php echo esc_html( get_admin_page_title() ); ?></h1>
        <form action="/nl/options.php/" method="post" data-trp-original-action="options.php">
            <?php
            settings_fields( 'myfp_settings_group' );
            do_settings_sections( 'myfp-settings-page' );
            submit_button( '保存设置' );
            ?>
        <input type="hidden" name="trp-form-language" value="nl"/></form>
    </div>
    &lt;?php
}

Samenvatting

Het ontwikkelen van WordPress-plug-ins is een proces waarbij ideeën worden omgezet in functionele onderdelen van een website. Het succes hiervan is afhankelijk van een duidelijke begrijping van de basisstructuur van WordPress, het behendig gebruik van de hook-mechanismen, en een constante aandacht voor veiligheid en gebruikerservaring. Van het opzetten van een ontwikkelingsomgeving tot het schrijven van de belangrijkste bestanden, van het diep integreren van functies met WordPress via actions en filters tot het bouwen van een professionele beheerinterface met behulp van APIs – ieder stap volgt vastgestelde regels en beste praktijken. Het is belangrijk om de code modulair, leesbaar en uitbreidbaar te houden, unieke prefixen te gebruiken om conflicten te voorkomen, en altijd de veiligheid voorop te stellen. Door het bestuderen en praktiseren van deze handleiding beschikt u nu over de kennis om vanaf nul een volledig functionerende, standaardconforme WordPress-plugin te bouwen.

Veelgestelde vragen (FAQ)

Welke programmeerkennis is vereist om een WordPress-plugin te ontwikkelen voor ###?
Om een WordPress-plugin te ontwikkelen, zijn basiskennis van de PHP-programmeringstaal vereist, waaronder de syntaxis, functies, arrays en concepten van objectgerichte programmering. Een basiskennis van front-endtechnologieën als HTML, CSS en JavaScript is ook heel nuttig, aangezien dit belangrijk is voor het maken van plugins met een gebruikersinterface. Het is ook handig om de basisoperaties van de MySQL-database te beheersen, omdat WordPress sterk afhankelijk is van deze database.

Hoe debug je een WordPress-plugin die je aan het ontwikkelen bent?

Er zijn verschillende manieren om plugins te debuggen. Allereerst…wp-config.phpHet bestand is geopend inWP_DEBUG和WP_DEBUG_LOGDit zal PHP-fouten en waarschuwingen opslaan in een logbestand./wp-content/debug.logDe inhoud van de bestand wordt niet weergegeven aan de gebruiker op de front-end. Daarnaast kan je de browserdevelopertools (bijvoorbeeld Chrome DevTools) gebruiken om JavaScript en netwerkverzoeken te debuggen. Voor complexe logische processen zijn deze tools zeer handig.var_dump()或error_log()De functie stuurt de waarden van de variabelen naar de log of naar de pagina. Daarnaast kan je professionele PHP-debuggers zoals Xdebug installeren en integreren met je code-editor, waardoor je kunt gebruikmaken van breakpoint-debbugging. Dit is de efficiëntste manier om fouten in je code op te sporen.

Hoe kan mijn plugin worden geïnternationaliseerd voor meerdere talen?

Om internationaal te worden (i18n) worden voornamelijk de mogelijkheden van WordPress gebruikt.__()、_e()、_x()In het code van het plugin moet iedere tekststring die moet worden vertaald worden omhuld met deze vertaalfuncties, en moet ook het betreffende tekstgebied (Text Domain) worden opgegeven. Dit tekstgebied wordt gedefinieerd in de commentaren bovenin het plugin.Text DomainDe waarde. Vervolgens wordt met een tool als Poedit de broncode van het plugin gescanerd om de gewenste informatie te genereren..potTemplatebestanden: vertalers gebruiken deze om verschillende talenversies van een tekst te creeren..poEn de gecompileerde versie.moBestanden. Ten slotte worden deze vertaalmappen geplaatst in het plugin./languages/In de map, en gebruiken bij het initialiseren van het plugin.load_plugin_textdomain()De functies laden ze op.

Hoe kan ik mijn plugin gratis publiceren in de officiële WordPress-plugincatalogus?

Om je plugin te publiceren in het officiële WordPress-directorium, moet je een aantal vereisten vervullen. Allereerst moet je ervoor zorgen dat je plugin volledig voldoet aan de licentie van GPL versie 2 of een latere versie. Daarnaast moet je de kwaliteit en veiligheid van je code controleren en de WordPress-编码standaarden (coding standards) naleven. Vervolgens moet je een account aanmaken op WordPress.org en je plugin indienen in de “Developers”-sectie. Voor het indienen is het belangrijk dat je plugin beschikt over gedetailleerde en goed opgemaakte documentatie.readme.txtHet bestand is opgesteld in een specifiek Markdown-format en de internationale ondersteuning (internationalization) is correct ingesteld. Na het indienen wordt het door een team van plugin-beoordelaars onderzocht; dit kan enkele dagen tot weken duren. Als het wordt goedgekeurd, kan je plugin worden gevonden en geïnstalleerd in de officiële directory.