WordPress Eklentisi Nasıl Oluşturulur (Yeni Başlayanlar İçin Adım Adım)

Yıllar boyunca birçok WordPress eklentisi oluşturduk, hem kendimize hem de binlerce kullanıcıya yardımcı olduk. Okuyucularımızın çoğu bize kendi eklentilerini nasıl yapabileceklerini de sordu.

WordPress eklentisi yapmak ilk başta zor görünebilir, ancak aslında oldukça eğlenceli ve ödüllendiricidir. Sitenize yeni bir özellik eklemek veya başkalarıyla faydalı bir şey paylaşmak isteyip istemediğiniz, bir eklenti oluşturmak bunu yapmanın harika bir yoludur.

Bu kılavuzda, ilk WordPress eklentinizi adım adım nasıl yapacağınızı göstereceğiz.

İlk WordPress Eklentinizi Oluşturmak İçin Neye İhtiyacınız Var?

WordPress eklentileri, WordPress web siteniz için uygulamalar gibidir. Tıpkı telefonunuzdaki uygulamalar gibi, WordPress'e yeni özellikler eklemek için eklentiler yükleyebilirsiniz.

WordPress eklentileri hakkında daha fazla bilgi edinmek için, WordPress eklentileri ve nasıl çalıştıkları hakkındaki rehberimize bakın.

İlk WordPress eklentinizi oluşturmak için PHP, CSS, HTML ve JavaScript gibi kodlama dillerinde temel bilgiye ihtiyacınız olacaktır.

Bu çok fazla gelebilir, ancak endişelenmeyin; yine de eğitimimizi takip edebilirsiniz. Süreci adım adım size anlatacağız ve sonunda, basit bir WordPress eklentisi oluşturmak için yeterli WordPress programlama anlayışına sahip olacaksınız.

Bu nedenle, temel bilgilere bağlı kalacağız ve gelişmiş WordPress kodlama becerilerine girmeyeceğiz.

İkinci olarak, WordPress eklentinizi bilgisayarınızda test etmek için yerel bir geliştirme ortamına ihtiyacınız olacak. Bunu kurmak için, Windows bilgisayarınıza WordPress kurma veya Mac rehberimize bakın).

Eklentinizi ayrıca bir hazırlık (staging) web sitesinde test edebilirsiniz. Ancak, bir hata oluşursa, web sitenizi bozabilir ve erişilemez hale getirebilirsiniz.

Bu sorunları çözmek için en yaygın WordPress hatalarını nasıl düzelteceğinize dair rehberimize bakın.

Kodunuzu yazmak için düz metin düzenleyiciye de ihtiyacınız olacak. Not Defteri veya TextEdit işinizi görecektir. Ancak, daha gelişmiş bir şey denemek isterseniz, şu geliştiriciler için kod düzenleyicilere göz atın.

Bunlar hazır olduğunda, eğitime başlayalım. Belirli bir konuya atlamak için aşağıdaki hızlı bağlantıları kullanabilirsiniz:

• Adım 1: Temel Bir WordPress Eklentisi Oluşturun
• Adım 2: İlk WordPress Eklentinizi Kurun ve Etkinleştirin
• Adım 3: Eklentinizi WordPress.org Eklenti Depolarına Gönderin
• Adım 4: Eklentinizi Yüklemek İçin Subversion (SVN) Kullanın
• Step 5: Add Artwork to Your Plugin on WordPress.org

Adım 1: Temel Bir WordPress Eklentisi Oluşturun

İlk adım, masaüstünüzde veya belgeler klasörünüzde yeni bir klasör oluşturmak ve adını wpb-plugin-tutorial veya my-first-plugin gibi bir şey koymaktır.

Ardından, metin düzenleyicinizde yeni bir dosya oluşturmanız ve bunu eklenti klasörünüze wpb-plugin-tutorial.php veya my-first-plugin.php olarak kaydetmeniz gerekir. Önemli olan .php uzantısıdır, ancak dosyayı istediğiniz gibi adlandırabilirsiniz.

You’ll need to open that PHP file with your text editor.

Eklenti dosyanıza eklemeniz gereken ilk şey eklenti başlığıdır. Bu yorum bloğu, WordPress'e eklentinizin adını, sürümünü, web sitesini, eklenti yazar adını ve daha fazlasını söyler:

/* Plugin Name: WPBeginner Plugin Tutorial Plugin URI: https://www.wpbeginner.com Description: A short little description of the plugin. It will be displayed on the Plugins page in WordPress admin area. Version: 1.0 Author: WPBeginner Author URI: https://www.wpbeginner.com License: GPL2 License URI: https://www.gnu.org/licenses/gpl-2.0.html Text Domain: wpb-tutorial Domain Path: /languages */ 

Eklenti başlığını ekledikten sonra, altına eklenti kodunu eklemeye başlayabilirsiniz.

Bu eğitim için, her makalenin sonuna kullanıcılardan bizi Twitter'da takip etmelerini isteyen bir mesaj ekleyen basit bir eklenti oluşturacağız.

Eklenti başlık bloğunuzun altına aşağıdaki kodu kopyalayıp yapıştırmanız yeterlidir:

<?php function wpb_follow_us($content) { // Only do this when a single post is displayed if ( is_single() ) { // Message you want to display after the post // Add URLs to your own Twitter and Facebook profiles $content .= '<p class="follow-us">If you liked this article, then please follow us on <a href="http://twitter.com/wpbeginner" title="WPBeginner on Twitter" target="_blank" rel="nofollow">Twitter</a> and <a href="https://www.facebook.com/wpbeginner" title="WPBeginner on Facebook" target="_blank" rel="nofollow">Facebook</a>.</p>'; } // Return the content return $content; } // Hook our function to WordPress the_content filter add_filter('the_content', 'wpb_follow_us'); 

Değişikliklerinizi kaydetmeden önce Twitter ve Facebook profil URL'lerinizi kendi URL'lerinizle değiştirmeyi unutmayın.

Şimdi bilgisayarınızdaki masaüstüne gidin ve eklenti klasörü için bir zip dosyası oluşturun.

Mac kullanıcıları klasöre sağ tıklayıp ‘Compress wpb-plugin-tutorial’ seçeneğini seçebilir. Windows kullanıcıları klasöre sağ tıklayıp ‘Compress to zip file’ seçeneğini seçebilir.

Adım 2: İlk WordPress Eklentinizi Kurun ve Etkinleştirin

Now that we have created the plugin, it is time to install it so that you can test it out. For step-by-step instructions, you can check out our article on how to install a WordPress plugin.

Web sitenizdeki WordPress yönetici alanına gidin ve Eklentiler » Yeni Ekle sayfasını ziyaret edin.

Eklentinizi yüklemek için üstteki 'Eklenti Yükle' düğmesine tıklamanız gerekir. Bu size eklenti yükleme kutusunu gösterecektir.

Oluşturduğunuz zip dosyasını seçmek için 'Dosya Seç' düğmesine tıklayın. Ardından, eklentiyi yüklemek ve kurmak için 'Şimdi Yükle' düğmesine tıklayın.

Kurulduktan sonra, eklentiyi etkinleştirin.

Eklentiyi çalışırken görmek için artık web sitenizi ziyaret edebilirsiniz.

Yeni paragrafı, tek gönderilerinizin tümünün sonunda görebileceksiniz.

Adım 3: Eklentinizi WordPress.org Eklenti Depolarına Gönderin

Eklentinizin diğer WordPress kullanıcıları tarafından keşfedilmesini ve kullanılmasını istiyorsanız, WordPress.org'un eklenti deposuna gönderebilirsiniz.

Bunu yapmak için öncelikle eklentiniz için bir 'Beni Oku' dosyası oluşturmanız gerekecektir. Boş bir metin dosyası açın ve eklenti klasörünüze readme.txt olarak kaydedin.

Bu readme.txt dosyası WordPress.org'un readme dosyası sözleşmesine uymalıdır. readme.txt dosyasına eklediğiniz bilgiler, WordPress.org'daki eklentinizin sayfasında görüntülenecektir.

Başlangıç noktası olarak kullanabileceğiniz örnek bir readme.txt dosyası aşağıdadır:

=== Your Plugin Name === Contributors: WPBeginner Tags: wpbeginner, plugin tutorial Requires at least: 6.0 Tested up to: 6.2 Stable tag: 1.0 License: GPLv2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html A WordPress plugin to teach beginners how to write a WordPress plugin. == Description == This simple plugin is part of our beginner's guide to writing a WordPress plugin. == Installation == 1. Upload the plugin folder to your /wp-content/plugins/ folder. 1. Go to the **Plugins** page and activate the plugin. == Frequently Asked Questions == = How do I use this plugin? = Answer to the question = How to uninstall the plugin? = Simply deactivate and delete the plugin. == Screenshots == 1. Description of the first screenshot. 1. Description of the second screenshot. == Changelog == = 1.0 = * Plugin released. 

Şimdi, eklentiniz için özelleştirebilmeniz amacıyla WordPress eklenti readme dosyasının söz diziminin nasıl çalıştığı hakkında biraz bilgi verelim.

Eklentinizin okunabilir dosyasının ilk satırı eklenti adınızdır. Bu ad, WordPress.org eklenti dizininde eklentinizin başlığı olarak görünecektir.

Bir sonraki satır Katkıda Bulunanlar'dır. Bunlar, WordPress.org'da eklentinizi yönetmekten sorumlu kullanıcı kimlikleridir. Henüz bir WordPress.org kullanıcı hesabınız yoksa, kullanıcı kimliğinizi almak için ücretsiz bir WordPress.org kullanıcı hesabı oluşturabilirsiniz.

‘En az gerekli’ ve ‘Şu sürüme kadar test edildi’ ifadeleri, eklentinizin çalıştığı WordPress sürümlerini ifade eder. ‘Kararlı etiket’ kendi eklentinizin sürümüdür.

'Lisans' alanlarını GPL ve URL'yi aynı bırakabilirsiniz.

Ardından, eklentinizin ne yaptığını açıklamak için Açıklama alanını düzenleyebilirsiniz.

Eklentinizin okunma (readme) dosyasını düzenledikten sonra, değişikliklerinizi kaydetmeyi unutmayın.

Artık eklentiniz WordPress.org'un eklentiler ekibi tarafından incelenmeye hazır. Eklentinizi göndermek için ücretsiz bir WordPress.org hesabına ihtiyacınız olacak.

Eklentinizi WordPress.org'a eklemek için Eklentinizi Ekleyin sayfasını ziyaret edin ve henüz giriş yapmadıysanız, 'lütfen giriş yapın' düğmesine tıklayın.

Once logged in, you’ll be able to upload and submit your plugin for review.

Eklentinizin zip dosyasını seçmek için 'Dosya Seç' düğmesine tıklamanız yeterlidir. Ardından, geçerli olan tüm kutuları işaretleyin ve 'Yükle'ye tıklayın.

WordPress.org eklenti inceleme ekibi daha sonra eklenti kodunuzu yaygın hatalar ve güvenlik kontrolleri için inceleyecektir. Onaylandıktan sonra, eklenti ekibinden bir e-posta alacaksınız.

This email will contain a link to the Subversion (SVN) repository of your plugin hosted on WordPress.org.

Adım 4: Eklentinizi Yüklemek İçin Subversion (SVN) Kullanın

Subversion bir sürüm kontrol yazılımıdır. Kullanıcıların dosyalarda ve dizinlerde değişiklik yapmalarına, değişikliklerin kaydını tutmalarına, farklı sürümleri yönetmelerine ve işbirliğine olanak tanır.

Eklentinizi WordPress.org'a yüklemek için bilgisayarınızda bir SVN istemcisinin kurulu olması gerekecektir.

Windows kullanıcıları SilkSVN veya TortoiseSVN (ücretsiz) kullanabilir. Mac kullanıcıları bilgisayarlarına SmartSVN veya Versions App yükleyebilir.

Bu makalede, Mac için Versions Uygulaması'nın ekran görüntülerini göstereceğiz. Ancak, GUI'ye sahip tüm SVN uygulamalarında işlem çok benzerdir.

Kurulduktan sonra, Sürümler uygulamasını açmanız ve WordPress eklentinizin deposunun bir kopyasını indirmeniz gerekir. Sadece 'Yeni Depo Yer İşareti' düğmesine tıklayın.

Bu, ilk olarak bu yer imine bir ad sağlamanız gereken bir açılır pencere getirecektir. Eklentinizin adını verebilirsiniz.

After that, you need to add your WordPress plugin’s SVN repository URL.

Deponuzla bağlantı kurmak için ‘Create’ düğmesine tıklayın.

Sürümler Uygulaması artık eklentinizin deposunun bir kopyasını bilgisayarınıza indirecektir. Ardından, tarayıcı görünümünde deponuzun adına sağ tıklayın ve ardından 'Checkout' seçeneğini belirleyin.

Klasör için bir ad sağlamanız ve bilgisayarınızda saklamak istediğiniz bir konum seçmeniz istenecektir. Eklenti dizininizle aynı klasör adını kullanabilir ve devam etmek için ‘Checkout’ düğmesine tıklayabilirsiniz.

Versions uygulaması şimdi bilgisayarınızda eklentinizin yerel bir kopyasını oluşturacaktır. Bunu eklentinizin deposu altında görüntüleyebilir veya Finder uygulamasını kullanarak göz atabilirsiniz.

Şimdi eklenti dosyalarınızı kopyalamanız ve yerel deponuzun trunk klasörüne yapıştırmanız gerekiyor.

Bunu yaparken, Sürümler uygulamasındaki yeni dosyaların yanında bir soru işareti simgesi olduğunu fark edeceksiniz.

Bu dosyalar daha önce mevcut olmadığından, onları ‘Ekle’meniz gerekir. Yeni dosyaları seçin ve bu dosyaları yerel klasörünüze eklemek için ‘Ekle’ düğmesine tıklayın.

Now that your plugin files are added to the subversion, you are now ready to upload them. Basically, you will be syncing changes in your local folder and the subversion directory.

Seçmek için yerel deponuza tıklayın ve ardından 'Commit' düğmesine tıklayın.

Yeni bir açılır pencere görünecektir.

Değişikliklerin listesini ve bir commit mesajı eklemek için bir kutu göreceksiniz. Devam etmek için 'Commit'e tıklamanız yeterlidir.

SVN uygulamanız şimdi değişikliklerinizi senkronize edecek ve eklentinizin deposuna işleyecektir.

Eklenti dosyalarınızı ana dala yüklediğinize göre, bunları bir sürüme etiketlemenin zamanı geldi.

Eklentinizin yerel kopyasına gidin ve trunk klasöründeki dosyaları kopyalayın. Bundan sonra, tags klasörünü açmanız ve içinde yeni bir klasör oluşturmanız gerekir.

Bu klasörü bir sürüm adıyla adlandırın. Eklentinizin başlığında girdiğiniz sürümle eşleştiğinden emin olun. Yukarıdaki örnek kodda, eklentimiz için 1.0 sürümünü kullandık.

/tags/ klasörüne 1.0 klasörünü ekledikten sonra. Sürümler uygulamasında klasör adının yanındaki soru işareti simgesini fark edeceksiniz.

Bu yeni bir klasör olduğundan, klasörü ve tüm dosyalarını depoya dahil etmek için ‘Ekle’ düğmesine tıklamanız gerekecektir.

Ardından, değişikliklerinizi senkronize etmek için 'Commit' düğmesine tıklayabilirsiniz. Eklenti dosyalarınızı yerel kopyada düzenlemeye devam edebilirsiniz.

Değişikliklerinizi tamamladığınızda, bunları WordPress.org deposuyla senkronize etmek için kaydet (commit) düğmesine tıklamanız yeterlidir.

Eklentinizde bazı büyük değişiklikler yaptıysanız, sürüm numarasıyla adlandırılmış yeni bir klasör ekleyerek yeni bir sürüm eklemek isteyeceksiniz. Sürüm numarasının eklentinizin başlığıyla eşleştiğinden emin olun.

Eklentinizi artık WordPress.org eklenti dizininde önizleyebilirsiniz.

Adım 5: WordPress.org'da Eklentinize Görsel Ekleyin

WordPress.org, eklentilerinize resim ve ekran görüntüleri eklemenize olanak tanır. Bu öğelerin standart adlandırma uygulamalarına uyması gerekir ve Subversion kullanılarak yüklenmelidir.

Eklenti Başlık Banner'ı

Bu, eklenti sayfasının en üstünde görünen büyük resimdir. jpeg veya png dosya formatlarında 772 x 250 veya 1544 x 500 piksel olabilir. Her zaman şu şekilde adlandırılmalıdır:

• banner-772×250.jpg veya banner-772×250.png
• banner-1544×500.jpg veya banner-1544×500.png

Plugin Icon

Bu daha küçük kare şeklinde resim dosyası, arama sonuçlarında ve eklenti listelerinde eklenti simgesi olarak görüntülenir. 125 x 125 veya 250 x 250 piksel boyutlarında jpeg veya png dosya formatlarında olabilir.

Bu simge dosyası şu şekilde adlandırılmalıdır:

• icon-128×128.jpg veya icon-128×128..png
• icon-256×256.jpg veya icon-256×256.png

Ekran Görüntüleri

Ekran görüntüsü dosyaları aşağıdaki biçimde adlandırılmalıdır:

• screenshot-1.png
• screenshot-2.png

İstediğiniz kadar ekleyebilirsiniz. Bu ekran görüntüleri, readme.txt dosyanızdaki ekran görüntüsü açıklamalarıyla aynı sırada görünmelidir.

Tüm görselleri hazırladıktan sonra, eklentinizin yerel kopyasının varlıklar klasörüne yerleştirebilirsiniz.

Bundan sonra, varlıklar klasörünün yanında bir soru işareti simgesi göreceksiniz. Yeni varlıklar dosyasını deponuza eklemek için ‘Ekle’ düğmesine tıklayın.

Son olarak, dosyalarınızı WordPress.org deposuna yüklemek için kaydetme düğmesine tıklayın. Bir süre sonra, eklenti sayfanızda sanat eserinin göründüğünü görebileceksiniz.

WordPress Eklenti Geliştirme Öğrenmek İçin Nihai Rehberler

WordPress eklentileri, yukarıda gösterdiğimiz kadar basit olabilir. Ayrıca quizler, geri sayım sayaçları, RSVP'ler, oylama, Google yorumları ve çok daha fazlası gibi çok daha güçlü olabilirler.

Bazı güçlü WordPress eklentileri ek eklentilere de sahip olabilir. Bu ek eklentiler, diğer eklentileri genişleten eklentiler gibi çalışır.

WordPress eklentilerinize işlevsellik eklemenin daha fazla yolunu öğrenmenize yardımcı olacak bazı kaynaklar şunlardır:

• Yeni başlayanlar için kullanışlı WordPress kod parçacıkları
• WordPress'e kısa kod ekleme
• functions.php dosyası ipuçları artık siteye özel bir eklentide kullanabileceğiniz
• Özel gönderi türleri ve taksonomiler oluşturma
• WordPress'te stil sayfalarını ve JavaScript'i doğru şekilde ekleme

Bu makalenin, bir WordPress eklentisi oluşturmayı öğrenmenize yardımcı olduğunu umuyoruz. Ayrıca, WordPress için yeni özellik önerilerinin nasıl yapılacağına dair rehberimize ve en başarılı WordPress işletmeleri ve şirketlerinin listemize de göz atmak isteyebilirsiniz.

Bu makaleyi beğendiyseniz, lütfen WordPress video eğitimleri için YouTube Kanalımıza abone olun. Bizi ayrıca Twitter ve Facebook'ta da bulabilirsiniz.