Sıfırdan başlayanlar için uygulamalı ders: WordPress eklenti geliştirmeyi adım adım öğreteceğiz.

WordPress Eklenti Geliştirme Ortamı ve Temel Hazırlıklar

Kod yazmaya başlamadan önce, uygun bir yerel geliştirme ortamına ihtiyacınız var. Bu genellikle bir yerel sunucu (örneğin XAMPP, MAMP veya Local by Flywheel), bir kod editörü (örneğin VS Code veya PHPStorm) ve test amacıyla kullanılacak bir WordPress kurulumunu içerir. PHP sürümünüzün WordPress’in resmi olarak önerdiği sürümle uyumlu olduğundan emin olun.

Bir WordPress eklentisinin çekirdeği, şu adreste bulunan bir dosyadır:/wp-content/plugins/Katalogdaki bu klasör, eklentinizin tanımlayıcısıdır ve isminin küçük harfler, rakamlar ve tireler kullanılarak oluşturulması en iyisidir. Bu klasörde, klasörün adıyla aynı adı taşıyan bir PHP ana dosyası bulunmalıdır. Örneğin:my-first-plugin.phpBu dosya, eklentinin giriş noktasıdır ve eklentinin meta bilgilerini içermektedir.

İlk eklenti dosyanızı oluşturun.

En basit eklentiyi oluşturarak başlayalım; bu eklenti, web sitesinin yönetim arayüzünde bir hoş geldin mesajı gösterecek.

Tavsiye edilen okuma WooCommerce eklentisini detaylı olarak analiz edin: Giriş seviyesi yapılandırmadan ileri düzey özelleştirmeye kadar kapsamlı bir rehber.。

Eklenti başlık bölümüne not yazma işlemi

Her WordPress eklentisi, belirli bir başlık yorumu ile başlamalıdır. WordPress, bu bilgileri okuyarak eklentileri tanır ve görüntüler. Eklenti dizininizde (örneğin…)my-first-pluginBelirtilen kapsamda, ana dosyayı oluşturun.my-first-plugin.phpVe aşağıdaki kodu yazın:

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.

<?php
/**
 * Plugin Name: 我的第一个WordPress插件
 * 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
 */

Dosyayı kaydettikten sonra, WordPress arayüzüne giriş yapın ve “Eklentiler” sayfasına gidin. “İlk WordPress Eklentim” adlı eklentinin eklenti listesinde yer aldığını görmelisiniz. Bu noktada onu etkinleştirebilirsiniz; ancak henüz herhangi bir özelliği yoktur.

Eklentiye ilk özelliği ekleyin.

Şimdi, bu eklentiye basit bir özellik ekleyelim: Yönetim panelinin üst kısmında özelleştirilmiş bir yönetim bildirimi gösterilsin. Bunun için WordPress’in özelliklerinden yararlanacağız.admin_noticesKanca.

Ana dosyadamy-first-plugin.phpBaşlık yorumunun hemen altına aşağıdaki kodu ekleyin:

// 在管理后台添加一个欢迎提示
function my_first_plugin_admin_notice() {
    ?>
    <div class="notice notice-success is-dismissible">
        <p>“İlk WordPress Eklentim”i kullanmaya hoş geldiniz! Bu eklentiyi başarıyla etkinleştirdiniz.</p>
    </div>
    &lt;?php
}
add_action( &#039;admin_notices&#039;, &#039;my_first_plugin_admin_notice&#039; );

Bu kod, “” adında bir şey tanımlamaktadır.my_first_plugin_admin_noticeBir fonksiyon var; bu fonksiyon, kapatılabilen ve başarılı bir işlemi bildiren bir uyarı kutusu oluşturan bir HTML parçası döndürür.add_action()Bu fonksiyon, özel olarak oluşturulan bu fonksiyonu WordPress’e “monte eder”.admin_noticesBu işlem, dosyayı kaydetmenizi ve WordPress arayüzünü yenilemenizi gerektirir. Bunu yaptıktan sonra, sayfanın en üst kısmında yeşil bir hoş geldiniz mesajı göreceksiniz.

Tavsiye edilen okuma Web sitesi oluşturma pratik rehberi: Sıfırdan canlı hale getirmeye kadar tüm geliştirme süreci ve teknoloji seçimi rehberi。

WordPress eklentilerinin temel mekanizmalarını anlamak: Hook’lar ve filtreler

WordPress eklenti geliştirmenin temeli, WordPress çekirdeğiyle olan etkileşimden geçer ve bu etkileşim esas olarak “kancalar” (hooks) mekanizması aracılığıyla sağlanır. Kancalar iki türe ayrılır: Eylemler (Actions) ve Filtreler (Filters).

Action Hook’ların Kullanımı

Eylem kancaları, WordPress’in belirli zaman noktalarında özel kodlar eklemenize olanak tanır; tıpkı az önce kullandığımız gibi.admin_noticesBaşka bir yaygın örnek ise…initBu “kancalar” (hooks), WordPress’in başlatılması sırasında tetiklenir ve genellikle özel makale türlerinin veya kategorilerinin kaydedilmesi için kullanılır.

Örneğin, eklenti başlatılırken bir seçenek değeri ayarlayabiliriz:

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 my_first_plugin_set_default_option() {
    // 如果选项不存在，则添加它
    if ( false === get_option( 'my_first_plugin_greeting' ) ) {
        add_option( 'my_first_plugin_greeting', 'Hello from my plugin!' );
    }
}
add_action( 'init', 'my_first_plugin_set_default_option' );

Filtre kancalarının kullanımı

Filtre hook’ları, süreç içinde aktarılan verileri değiştirmenize olanak tanır. Örneğin,the_contentFiltreler, makale metninin nasıl görüntüleneceğini değiştirmenize olanak tanır. Bunu kullanarak, her makalenin sonuna otomatik olarak telif hakkı bilgileri ekleyebiliriz.

function my_first_plugin_add_copyright( $content ) {
    // 仅对主循环中的单篇文章生效
    if ( is_single() && in_the_loop() && is_main_query() ) {
        $copyright = '<p><em>Bu metin telif hakkı ile korunmaktadır; yeniden yayımlanması durumunda kaynağın belirtilmesi gerekmektedir.</em></p>';
        $content .= $copyright;
    }
    return $content;
}
add_filter( 'the_content', 'my_first_plugin_add_copyright' );

Bu örnekte, fonksiyon…my_first_plugin_add_copyrightOrijinalini alın.$contentBelirli koşulların kontrolünden sonra (yalnızca tek bir makale sayfasında etkili olmasını sağlamak için), makalenin sonuna bir HTML bölümü eklenmiştir. Son olarak, değiştirilmiş içeriğin doğru şekilde gösterilmesi için gerekli düzenlemeler yapılmalıdır.$contentGeri dön.

Daha karmaşık eklentiler oluşturma: Kısa kodlar ve ayar sayfaları

İşlevsel olarak tam bir eklenti genellikle ön uç etkileşimleri (örneğin kısa kodlar) ve arka uç yapılandırmaları (örneğin ayar sayfaları) sağlamalıdır.

Tavsiye edilen okuma Arama motoru optimizasyonunun güçlü bir aracı: WordPress web sitesi için SEO stratejisini sıfırdan oluşturma.。

Özel kısa kodlar oluşturun.

Kısa kodlar, kullanıcıların basit etiketler (örneğin…) aracılığıyla…[my_greeting]Makale veya sayfalara eklenti özellikleri ekleyin. Kısa kod kullanımı için kaydolun.add_shortcode()İşlev.

// 注册一个简单的问候短代码
function my_first_plugin_greeting_shortcode( $atts ) {
    // 使用 shortcode_atts 定义默认属性并合并用户输入
    $attributes = shortcode_atts( array(
        'name' => '访客',
    ), $atts );

// 获取我们之前设置的选项
    $greeting_text = get_option( 'my_first_plugin_greeting', 'Hello' );

// 生成输出
    $output = '<div class="my-plugin-greeting">';
    $output .= esc_html( $greeting_text ) . ', ' . esc_html( $attributes['name'] ) . '!';
    $output .= '</div>';

return $output;
}
add_shortcode( 'my_greeting', 'my_first_plugin_greeting_shortcode' );

Şimdi, kullanıcılar editörde metin girebiliyorlar.[my_greeting name="张三"]Bu durumda, ön uçta “Merhaba, benim eklentimden! Zhang San!” mesajı görüntülenecektir.

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.

Eklenti ayarları sayfasını ekleyin.

Kullanıcıların selamlama mesajlarını özelleştirebilmeleri için, yönetim arayüzüne bir ayar sayfası eklememiz gerekiyor. Bu, üst düzey veya alt menü sayfalarının eklenmesini ve form seçeneklerinin kaydedilmesini içerir.

// 在后台“设置”菜单下添加子菜单页
function my_first_plugin_add_settings_page() {
    add_options_page(
        '我的插件设置',          // 页面标题
        '我的第一个插件',        // 菜单标题
        'manage_options',       // 所需权限
        'my-first-plugin',      // 菜单slug
        'my_first_plugin_render_settings_page' // 回调函数，用于输出页面内容
    );
}
add_action( 'admin_menu', 'my_first_plugin_add_settings_page' );

// 渲染设置页面的HTML
function my_first_plugin_render_settings_page() {
    ?>
    <div class="wrap">
        <h1>İlk eklentim için yapılan ayarlar</h1>
        <form method="post" action="/tr/options.php/" data-trp-original-action="options.php">
            <?php
            settings_fields( 'my_first_plugin_settings_group' );
            do_settings_sections( 'my-first-plugin' );
            submit_button();
            ?>
        <input type="hidden" name="trp-form-language" value="tr"/></form>
    </div>
    &lt;?php
}

// 注册设置、区域和字段
function my_first_plugin_register_settings() {
    register_setting(
        &#039;my_first_plugin_settings_group&#039;, // 设置组名
        &#039;my_first_plugin_greeting&#039;        // 选项名
    );

add_settings_section(
        &#039;my_first_plugin_main_section&#039;,    // 区域ID
        &#039;问候语设置&#039;,                     // 区域标题
        null,                            // 区域回调函数（可为空）
        &#039;my-first-plugin&#039;                // 页面slug
    );

add_settings_field(
        &#039;greeting_text_field&#039;,            // 字段ID
        &#039;问候语文本&#039;,                     // 字段标题
        &#039;my_first_plugin_greeting_field_callback&#039;, // 字段HTML的回调函数
        &#039;my-first-plugin&#039;,                // 页面slug
        &#039;my_first_plugin_main_section&#039;    // 所属区域ID
    );
}
add_action( &#039;admin_init&#039;, &#039;my_first_plugin_register_settings&#039; );

// 渲染问候语输入字段
function my_first_plugin_greeting_field_callback() {
    $greeting = get_option( &#039;my_first_plugin_greeting&#039; );
    echo &#039;<input type="text" name="my_first_plugin_greeting" value="' . esc_attr( $greeting ) . '" class="regular-text" />';
}

Bu kod, standart bir WordPress ayar sayfası oluşturur. Kullanıcılar ayar sayfasında selamlaşma mesajını değiştirip kaydettiklerinde, daha önce oluşturulan kısa kodlar (shortcodes) yeni selamlaşma metniyle güncellenir.

Özetle.

Bu eğitim sayesinde, sıfırdan başlayarak temel özelliklere sahip bir WordPress eklentisi geliştirdik. Eklenti dosya yapısını oluşturmayı, eklentinin başlık bilgilerini yazmayı, arka planda bildirimler göndermek için eylem kancalarını (action hooks) kullanmayı, içeriği filtrelerle değiştirmeyi, kullanıcıların ön tarafta çağırabileceği kısa kodlar (shortcodes) oluşturmayı ve eklenti ayarlarını yönetmek için eksiksiz bir ayar sayfası hazırlamayı öğrendiniz. Bunlar, WordPress eklenti geliştirmenin en temel ve önemli becerileridir. Bu becerileri öğrendikten sonra, WordPress’in resmi eklenti kılavuzuna başvurarak özel veritabanı tabloları, REST API uç noktaları, AJAX işlemleri gibi daha ileri API’leri inceleyebilir ve daha güçlü, daha profesyonel eklentiler geliştirebilirsiniz.

Sıkça Sorulan Sorular.

WordPress eklentisi geliştirmek için hangi programlama dili bilgilerine ihtiyaç vardır?

WordPress eklentileri geliştirmek için temel olarak PHP dili bilgisine ihtiyaç vardır, çünkü WordPress’ün çekirdeği PHP ile yazılmıştır. Aynı zamanda, eklentinin ön uç arayüzünü ve etkileşim mantığını oluşturmak için HTML, CSS ve temel JavaScript bilgisine de sahip olmanız gerekir. SQL hakkında temel bir bilgiye sahip olmak da daha karmaşık veri işlemlerini gerçekleştirmede yardımcı olur.

WordPress eklentimizi nasıl hata ayıklarız?

Öncelikle, emin olun ki sizin…wp-config.phpDosyada etkinleştirildi.WP_DEBUGBu mod, PHP hatalarını ve uyarılarını ekranda gösterecektir. Ayrıca, bunu kullanmak mümkündür.error_log()Fonksiyon, hata ayıklama bilgilerini sunucunun hata günlüğüne yazar. Daha karmaşık hata ayıklamaları için Xdebug gibi özel PHP hata ayıklama araçlarını kullanmayı veya sorunları gidermeye yardımcı olacak WordPress hata ayıklama eklentilerini yüklemeyi düşünebilirsiniz.

Geliştirdiğim eklentiyi WordPress resmi eklenti dizinine nasıl yayınlayabilirim?

WordPress.org adresine girmeniz ve bir geliştirici hesabı oluşturmanız gerekiyor. Daha sonra, Subversion (SVN) aracılığıyla eklenti kodunuzu size atan resmi kod deposuna göndermelisiniz. Eklentiniz GPL lisansına uymalı ve kod kalitesi, güvenliği ile dokümantasyon belirli inceleme standartlarını karşılamalıdır. İnceleme sonucunda onaylanırsa, eklentiniz kullanıcıların indirebileceği resmi katalogda yer alacaktır.

Eklentilerin ön uç (frontend) CSS ve JavaScript dosyaları nasıl doğru bir şekilde yüklenmelidir?

Çatışmaları önlemek ve performansı garanti altına almak için, kaynakların doğrudan şablon dosyalarına eklenmemesi gerekir. Doğru yöntem, bunları başka yerlerden çağırmaktır.wp_enqueue_style()和wp_enqueue_script()Fonksiyonlar. Yönetim arayüzü kaynakları için, bunların belirli bir yere monte edilmesi gerekmektedir.admin_enqueue_scriptsKancalar; web sitesinin ön uç kaynakları için, bunların belirli bir yere monte edilmesi gerekmektedir.wp_enqueue_scriptsKancalar (hooks). Bu sayede bağımlılıklar doğru bir şekilde yönetilir ve aynı dosya tekrar tekrar yüklenmez.