WordPress Eklenti Geliştirme: Başlangıçtan Uzmanlığa – İlk İşlevsel Eklentinizi Oluşturun

Neden WordPress eklenti geliştirmeyi öğrenmeliyiz?

WordPress, dünyanın en popüler içerik yönetim sistemi olarak, güçlü genişletilebilirliğini büyük ölçüde sayısız eklentiden almaktadır. Eklenti geliştirmeyi öğrenmek, sadece kendi ihtiyaçlarınıza göre özel özellikler oluşturmanıza olanak tanımakla kalmaz, aynı zamanda WordPress’in temel yapısını derinlemesine anlamanıza, teknik becerilerinizi geliştirmenize ve hatta yaratıcılığınızı yayınlanabilir ürünlere dönüştürmenize de yardımcı olur. Kendi eklentilerinizi geliştirerek, kod kalitesini tam olarak kontrol edebilir, web sitenizin güvenliğini sağlayabilir ve üçüncü parti eklentiler kullanımından kaynaklanan uyumluluk sorunlarından kaçınabilirsiniz.

Temel bir WordPress eklentisi, esasen belirli bir katalogda bulunan bir veya daha fazla PHP dosyasından oluşur ve WordPress tarafından sağlanan zengin API’ler (eylem kancaları, filtre kancaları, kısa kodlar, araçlar vb.) aracılığıyla çekirdek sistemle etkileşim kurar. Bu mekanizmayı anlamak, herhangi bir eklentinin başarılı bir şekilde geliştirilmesi için ön koşuldur.

Geliştirme ortamını ve altyapısını hazırlamak

İlk satır kodu yazmadan önce, iyi bir geliştirme ortamı oluşturmak çok önemlidir. Bir yerel sunucu ortamına (örneğin XAMPP, Local by Flywheel veya DevKinsta), bir kod editörüne (örneğin VS Code veya PhpStorm) ve test amacıyla kullanılacak bir WordPress kurulumuna ihtiyacınız vardır.

Tavsiye edilen okuma WordPress Eklenti Geliştirme Kılavuzu: Temel Prensipleri ve Gerçek Proje Uygulamalarını Öğrenin。

Eklentinin giriş noktası, bir ana PHP dosyasıdır. Bu dosyanın baş kısmındaki yorumlar, WordPress’in eklentiyi tanımasında kilit rol oynar. Öncelikle, bir eklentinin temel yapısını oluşturalım.

UltaHost WordPress Sunucusu

30 gün iade garantisi, sınırsız bant genişliği ve veritabanı kullanımı, ücretsiz DDoS koruması; 3 yıllık abonelikte indirim (50%).

Sayfaya erişin.

Eklentinin ana dosyasını oluşturun.

Eklentilerin ana dosyaları genellikle eklentinin adıyla adlandırılır. Örneğin, “İlk Eklentim” adında bir eklentisi oluşturduğumuzda, ana dosyasının adı “my_first_plugin.js” olabilir.my-first-plugin.phpBu dosya mutlaka belirtilen yere yerleştirilmelidir./wp-content/plugins/my-first-plugin/Katalogun içinde.

Dosya başlığı, standart eklenti bilgilerini içeren açıklamaları barındırmalıdır. İşte en temel örnek:

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

Bu dosyayı kaydettikten sonra, WordPress arayüzünün “Eklentiler” sayfasına gidin. Yeni eklenen eklentiyi eklenti listesinde görmelisiniz ve onu etkinleştirebilirsiniz. Şu an için herhangi bir özelliği yok, ancak temel altyapısı zaten oluşturulmuş durumda.

Eklentinin temel dizin yapısını oluşturmak

Yapısı net bir eklenti, uzun vadeli bakım için faydalıdır. Aşağıdaki dizinlerin oluşturulması önerilir:
* /assets/CSS, JavaScript ve resimler gibi statik kaynakları saklamak için kullanılır.
* /includes/Çekirdek PHP sınıf dosyalarını ve fonksiyon dosyalarını saklamak için kullanılır.
* /languages/Uluslararası çeviri dosyalarını (.po/.mo) saklamak için kullanılır.

Tavsiye edilen okuma Tailwind CSS’nin Temel Prensipleri: Pratikliğe Öncelik Veren, Atomize Edilmiş CSS Çerçevesinin İşleyiş Mekanizması Açıklanıyor。

Ana Dosyamy-first-plugin.phpSadece eklentinin başlatılmasıyla ilgili işlemlerden sorumlu olmalıdır; örneğin sabitlerin tanımlanması, diğer dosyaların içe aktarılması, düğümlerin (hook’ların) kaydedilmesi gibi.

Çekirdek işlevin gerçekleştirilmesi: Yönetim menüsü ve sayfalarının oluşturulması

Yaygın bir eklenti özelliği, WordPress arayüzünde bir yönetim menüsü sayfası eklemektir. Bunu, WordPress’in “Menü Sayfaları API’si” aracılığıyla gerçekleştireceğiz.

Arka planda bir üst düzey menü ekleyin.

Kullanmamız gerekiyor.add_menu_page()Fonksiyon. Bu fonksiyon genellikle…admin_menuBu eylem kancası tetiklendiğinde çağrılır. Ana dosyaya aşağıdaki kodu ekliyoruz:

hosting.com Paylaşımlı Barındırma

AMD EPYC CPU'lar, NVMe SSD depolama ve LiteSpeed ile yüksek performans, 7/24, 7x7 uzman şirket içi destek, SSL, kaba kuvvet, kötü amaçlı yazılım ve DDoS koruması dahil gelişmiş güvenlik önlemleri, 73%'ye kadar tasarruf

Sayfaya erişin.

// 定义在管理员菜单初始化时执行的功能
function mfp_add_admin_menu() {
    add_menu_page(
        '我的插件设置',         // 页面标题
        '我的插件',            // 菜单标题
        'manage_options',      // 所需权限
        'my-first-plugin',     // 菜单slug
        'mfp_display_settings_page', // 用于显示页面内容的回调函数
        'dashicons-admin-generic', // 菜单图标（Dashicon）
        6                      // 菜单位置
    );
}
// 将函数挂载到 `admin_menu` 钩子上
add_action('admin_menu', 'mfp_add_admin_menu');

Ayar sayfasının gösterilecek içeriğini oluşturun.

Yukarıdaki kodda,mfp_display_settings_pageBu, ayar sayfasının HTML içeriğini döndüren bir geri çağırma (callback) fonksiyonudur. Bu fonksiyonu tanımlamamız gerekiyor:

// 设置页面的显示内容
function mfp_display_settings_page() {
    // 检查用户权限
    if (!current_user_can('manage_options')) {
        wp_die(__('你没有权限访问此页面。'));
    }
    ?>
    <div class="wrap">
        <h1><?php echo esc_html(get_admin_page_title()); ?></h1>
        <form action="/tr/options.php/" method="post" data-trp-original-action="options.php">
            <?php
            // 输出设置字段和安全nonce字段
            settings_fields('mfp_options_group'); // 设置组的名称
            do_settings_sections('my-first-plugin'); // 页面slug
            submit_button('保存设置');
            ?>
        <input type="hidden" name="trp-form-language" value="tr"/></form>
    </div>
    &lt;?php
}

Bu kod, standart bir WordPress ayar sayfası çerçevesi oluşturur ve içinde bazı özel bileşenler kullanılmıştır.settings_fields()和do_settings_sections()Bu, fonksiyonların kullanılacağı anlamına gelir; yani seçeneklerimizi yönetmek için WordPress Settings API’sini kullanacağız. Bu, en güvenli ve en standart yöntemdir.

Eklenti seçeneklerini Settings API’si kullanarak yönetin.

Doğrudan işleme$_POSTVerilerde güvenlik riskleri bulunmaktadır. WordPress Settings API, veri doğrulama, güvenlik ve depolama işlemlerini bizim adımıza yapmaktadır ve eklenti ayarlarını yönetmek için tercih edilen yöntemdir.

Tavsiye edilen okuma WooCommerce Eklentileri Kılavuzu: Sıfırdan Başlayarak Profesyonel Bir Çok Uluslu E-Ticaret Sitesi Kurmak。

Kayıt Ayarları, Alanlar ve Bölümler

We need toadmin_initAyarlarımızı kurulum sırasında başlatıyoruz. Öncelikle,register_setting()Bir kayıt seçeneği ayarlayın.

function mfp_register_settings() {
    // 注册一个设置：`mfp_options` 是存储在`wp_options`表中的键名
    register_setting(
        'mfp_options_group', // 设置组名，需与`settings_fields()`参数一致
        'mfp_options',       // 选项名
        'mfp_sanitize_options' // 可选：数据清洗回调函数
    );

// 添加一个设置章节
    add_settings_section(
        'mfp_main_section',                // 章节ID
        '主要设置',                         // 章节标题
        'mfp_main_section_callback',       // 章节介绍的回调函数
        'my-first-plugin'                  // 所属页面slug
    );

// 在章节中添加一个文本字段
    add_settings_field(
        'mfp_text_field',                  // 字段ID
        '示例文本',                         // 字段标签
        'mfp_text_field_callback',         // 用于渲染字段HTML的回调函数
        'my-first-plugin',                 // 所属页面slug
        'mfp_main_section'                 // 所属章节ID
    );
}
add_action('admin_init', 'mfp_register_settings');

Alanların renderlanması ve temizlenmesi için fonksiyonlar tanımlama

Şimdi, yukarıda kullanılan her bir geri çağırma fonksiyonunu tanımlamamız gerekiyor; bunlar, alanların HTML formatına dönüştürülmesi ve verilerin temizlenmesi için kullanılacak.

InterServer Paylaşımlı Barındırma

Paylaşımlı hosting aylık $2.50 USD, ilk ay $0.1 USD promosyon kodu tryinterserver, 461 bulut uygulaması komut dosyası, tek tıklamayla yükleme.

Sayfaya erişin.

// 主章节的描述文本
function mfp_main_section_callback() {
    echo '<p>Burada eklentinin ana ayarlar bölümü bulunmaktadır.</p>';
}

// 文本字段的HTML输出
function mfp_text_field_callback() {
    // 从数据库获取现有值
    $options = get_option('mfp_options');
    $value = $options['mfp_text_field'] ?? ''; // PHP 7.0+ 空合并运算符
    echo '<input type="text" name="mfp_options[mfp_text_field]" value="' . esc_attr($value) . '" class="regular-text">';
}

// 数据清洗函数（可选但推荐）
function mfp_sanitize_options($input) {
    $sanitized_input = [];
    if (isset($input['mfp_text_field'])) {
        // 对文本字段进行基本的清洗，如去除标签
        $sanitized_input['mfp_text_field'] = sanitize_text_field($input['mfp_text_field']);
    }
    return $sanitized_input;
}

Böylece, güvenlik ayarları sayfası içeren tamamlanmış bir eklenti oluşturulmuş oldu. Eklentiyi etkinleştirdikten sonra, WordPress arayüzünde “Eklentilerim” menüsünü görebilirsiniz; bu menüye tıklayarak bir metin seçeneğini ayarlayıp kaydedebilirsiniz. Tüm veriler, WordPress API aracılığıyla güvenli bir şekilde saklanır.wp_optionsTabloda.

Eklentiye ön uç (frontend) özellikleri ekleyin: Kısa kodlar oluşturun.

Arka uç (backend) özellikleri temeldir; ancak eklentiler genellikle web sitesinin ön yüzünü (frontend) de etkilemelidir. Kısa kodlar (shortcodes) oluşturmak, eklentinin işlevlerini makalelere, sayfalara veya araçlara (widgets) dahil etmenin mükemmel bir yoludur.

Basit bir kısa kod kaydedin.

Biz “” adında bir hesap kaydettik.[my_greeting]Bu, ön tarafta bir selam mesajı göstermek için kullanılan kısa bir koddur.add_shortcode()İşlev.

Ana dosyaya veya özel bir işlev dosyasına şunları ekleyin:

// 注册短代码
function mfp_greeting_shortcode($atts, $content = null) {
    // 使用shortcode_atts设置默认属性并合并用户输入
    $atts = shortcode_atts(
        array(
            'name' => '访客', // 默认值
        ),
        $atts,
        'my_greeting' // 短代码名称
    );

// 获取插件选项中存储的文本
    $options = get_option('mfp_options');
    $custom_text = $options['mfp_text_field'] ?? '';

// 构造输出
    $output = '<div class="mfp-greeting">'$output = '<p>Merhaba, '. esc_html($atts['name']) . '! Bu sitede hoş geldiniz.</p>';
    if (!empty($custom_text)) {
        $output .= '<p><strong>Özelleştirilmiş Mesaj:</strong>'`. esc_html($custom_text)`.'</p>'$output = '</div>';

// 返回输出内容，而不是直接echo
    return $output;
}
add_shortcode('my_greeting', 'mfp_greeting_shortcode');

Şimdi, kullanıcılar makale düzenleyicisine içerik girebiliyorlar.[my_greeting name="张三"]Ön uç, kişiselleştirilmiş selam mesajlarını renderler ve eğer arka planda “örnek metin” ayarlanmışsa, bu da birlikte görüntülenir. Bu yöntem, arka plandaki ayarları ön uç çıktısıyla etkili bir şekilde bağlar.

Özetle.

Yukarıdaki adımları takip ederek, tam özelliklere sahip bir WordPress eklentisi oluşturduk. Sıfırdan başlayarak, eklentinin temel dosyalarını ve yapısını oluşturduk ve…add_menu_page()Güvenli bir arka plan ayarları sayfası, Settings API kullanılarak oluşturulmuştur ve bu sayfa şu yolla erişilebilir:add_shortcode()Ön uç işlevlerinin çıktısını gerçekleştirdik. Bu süreç, eklenti geliştirmenin temel adımlarını kapsıyor: planlama, başlatma, arka uç API’lerinin entegrasyonu, veri işleme ve ön uç arayüzlerinin sağlanması.

Bu temel bilgileri derinlemesine öğrendikten sonra, özel makale türleri oluşturma, meta veriler (Meta Box), özel veritabanı tabloları, REST API uç noktaları, AJAX işlemleri ve eklentilerin uluslararasılaştırılması gibi daha ileri konuları keşfetmeye devam edebilirsiniz. Unutmayın ki, WordPress kodlama standartlarına ve en iyi uygulamalarına uymak, yüksek kaliteli ve sürdürülebilir eklentiler geliştirmenin anahtarıdır.

Sıkça Sorulan Sorular.

Eklenti geliştirme için hangi PHP bilgilerine sahip olunması gerekmektedir?

En azından PHP’nin temel dilbilgisini öğrenmeniz gerekmektedir; bu temel dilbilgisi değişkenler, diziler, fonksiyonlar, koşullu ifadeler ve döngüler içermektedir. Nesne yönelimli programlama (OOP) bilgisi, orta ve büyük ölçekli eklentiler oluşturmak için çok faydalıdır. Ayrıca, WordPress’in eklentileri nasıl yüklediğini ve genel değişkenleri ile fonksiyonları güvenli bir şekilde nasıl kullanacağınızı anlamanız şarttır.

Kendi geliştirdiğiniz WordPress eklentisini nasıl hata ayıklarsınız?

Öncelikle, 'den emin olun.wp-config.phpDosyada etkinleştirildi.WP_DEBUG和WP_DEBUG_LOGBu şekilde hata mesajları günlük dosyasına kaydedilir. İkincisi, kullanılabilir.error_log()Fonksiyonlar, hata ayıklama bilgileri üretir. Karmaşık mantık için Xdebug gibi profesyonel hata ayıklama araçları kullanılarak kod adım adım çalıştırılabilir.

Eklentiler geliştirirken güvenliğini nasıl sağlayabilirsiniz?

Kullanıcı girdilerini her zaman doğrulayın ve temizleyin. WordPress’in yerleşik fonksiyonlarını kullanın, örneğin:esc_html(), esc_attr(), sanitize_text_field()和wp_kses()Çıktıyı işlemek için “ce” dışı bir yöntem kullanın.wp_nonce_field()Bu, çapraz sitelik istek sahteciliğini (CSRF – Cross-Site Request Forgery) önlemek için kullanılır. Veritabanı işlemleri için ise…$wpdbSınıf tarafından sağlanan metotlar veya bunların kullanımı.prepare()SQL enjeksiyonunu önlemek için kullanılan ifadeler.

Eklentiler yerel olarak mı yoksa çevrimiçi bir sunucuda mı geliştirilmelidir?

Ana geliştirme işlemlerinin yerel bir geliştirme ortamında (örneğin Local, XAMPP) yapılması şiddetle tavsiye edilir. Yerel ortam hızlı bir yanıt verir, ağ sorunlarından etkilenmez ve çevrimiçi siteleri etkilemeyecek şekilde istediğiniz gibi testler yapabilirsiniz. Özellikler temel olarak tamamlandıktan sonra, nihai uyumluluk testleri için çevrimiçi test ortamına dağıtın.

Kendi eklentinizi WordPress resmi kataloğuna nasıl yayınlayabilirsiniz?

WordPress.org’ye erişmeniz, bir geliştirici hesabı oluşturmanız ve eklenti kodunuzu Subversion (SVN) aracılığıyla göndermeniz gerekiyor. Eklentiniz, resmi kod standartlarına ve klasör yapısı gereksinimlerine uygun olmalı ve doğru içerikleri içermelidir.readme.txtDosya. İnceleme onaylandıktan sonra, dünya genelindeki kullanıcılar arka planda doğrudan eklentinizi arayıp yükleyebilecekler.