تیک۴

آموزش ساخت افزونه وردپرس

محمد سویزی

آیا به فکر ساخت افزونه وردپرس هستید اما نمی دانید از کجا شروع کنید؟

فهرست محتوا

افزونه های وردپرس به شما این امکان را می دهند که ویژگی های سفارشی را به وب سایت خود اضافه کنید. هزاران افزونه به صورت رایگان در مخزن وردپرس در دسترس هستند و حتی می توانید افزونه های وردپرس خود را ایجاد کنید.

در این مقاله از تیک4 به شما نشان خواهیم داد که چگونه یک افزونه وردپرس ایجاد کنید و چگونه این افزونه را به مخزن وردپرس اضافه کنید.

ساخت افزونه وردپرس

 

افزونه های وردپرس مانند برنامه هایی برای وب سایت وردپرس شما هستند. درست مانند برنامه های موجود در تلفن خود، می توانید افزونه هایی را در وردپرس نصب کنید تا ویژگی های جدید اضافه کنید.

برای ساخت پلاگین وردپرس به دانش اولیه زبان های کدنویسی مانند PHP، CSS، HTML و JavaScript نیاز دارید. شاید الان با خودتون بگین چقدر سخت شد، درسته؟
نگران نباشید، با ما همراه باشد تا شما را گام به گام در این فرآیند راهنمایی کنیم. در پایان این مقاله، درک کافی از برنامه نویسی وردپرس برای ساخت افزونه وردپرس را خواهید داشت.

توجه: ما در این آموزش قصد داریم ساخت افزونه به ساده ترین روش را آموزش دهیم. ببنابراین، به مهارت های پیشرفته کدنویسی وردپرس نیازی نخواهیم داشت.

برای ساخت افزونه وردپرس خود به چه چیزی نیاز دارید؟

در مرحله اول، برای آزمایش افزونه وردپرس خود به یک محیط توسعه محلی نیاز دارید. برای این کار، میتوانید از نرم افزار Local استفاده کنید که آموزش آن در سایت تیک4 موجود است. همچنین برای نوشتن کد خود به یک ویرایشگر متن ساده نیاز دارید. میتوانید از Notepad یا TextEdit و یا حتی از VsCode استفاده کنید.

همه پیش نیاز ها آماده است. حاضرین شروع کنیم؟

اولین قدم ساخت افزونه وردپرس

اولین قدم این است که یک فولدر جدید در دسکتاپ یا هر جایی که دوست دارید ایجاد کنید و نام آن را چیزی مانند test-plugin-tutorial یا my-first-plugin بگذارید.

در مرحله بعد، باید یک فایل جدید در ویرایشگر متن خود ایجاد کنید و آن را در پوشه پلاگین خود به عنوان test-plugin-tutorial.php یا my-first-plugin.php ذخیره کنید. نکته مهم پسوند .php است، اما شما می توانید نام فایل را هر چه می خواهید انتخاب کنید.
سپس باید آن فایل PHP را با ویرایشگر متن خود باز کنید.

هدر فایل پلاگین

اولین چیزی که باید به فایل افزونه خود اضافه کنید هدر افزونه است. این متن که به صورت کامنت است به سادگی نام افزونه، نسخه، وب سایت، نام نویسنده افزونه و موارد دیگر را به وردپرس معرفی می کند.

<?php
/*
Plugin Name:  tik4-plugin
Plugin URI:   https://www.tik4.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:       tik4 
Author URI:   https://www.tik4.com
License:      GPL2
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  tik4
Domain Path:  /languages
*/

پس از افزودن هدر افزونه، می توانید کد افزونه را در زیر آن اضافه کنید.

کد های افزونه

برای این آموزش، ما قصد داریم یک افزونه ساده ایجاد کنیم که در پایان هر مقاله یک پیام اضافه می کند و از کاربران می خواهد که ما را در اینستاگرام دنبال کنند.

شما میتوانید به سادگی کد زیر را در زیر بلوک هدر افزونه خود کپی و جایگذاری کنید.

function tik4_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 Instagram profiles

        $content .= '<p class="follow-us">If you liked this article, then please follow us on <a href="https://www.instagram.com/tik4_com/" title="Tik4 on Instagram" target="_blank" rel="nofollow">Instagram</a>.</p>';

    }
    // Return the content
    return $content;

}
// Hook our function to WordPress the_content filter
add_filter('the_content', 'tik4_follow_us');

فراموش نکنید که قبل از ذخیره تغییرات، آدرس های پروفایل اینستا را با آدرس های خود جایگزین کنید. بعد از ایجاد تغییرات به فولدر پلاگین خود را در یک فایل با پسوند .zip فشرده کنید. تمام شد شما اولین افزونه خود را ساختید.😊

نصب و فعال سازی افزونه وردپرس

اکنون که افزونه را ایجاد کردیم، زمان آن رسیده است که آن را آزمایش کنیم.

به قسمت مدیریت وردپرس در وب سایت خود بروید و از افزونه ها » افزودن را کلیک کنید.

برای آپلود افزونه خود باید روی دکمه «بارگذاری افزونه» در بالا کلیک کنید. با این کار کادر آپلود افزونه به شما نمایش داده می شود.

حال روی دکمه Choose File کلیک کنید و فایل فشرده ای را که ایجاد کرده اید انتخاب کنید. سپس بر روی دکمه Install Now کلیک کنید تا افزونه آپلود و نصب شود.

پس از نصب، با کلیک بر روی دکمه «فعال کردن افزونه» افزونه را فعال کنید.

اکنون می توانید از وب سایت خود دیدن کنید تا عملکرد افزونه را در عمل مشاهده کنید. همانطور که می بینید پاراگراف جدید در انتهای همه نوشته های سایت اضافه شده است.

ساخت افزونه وردپرس در مخزن WordPress.org

حالا نوبت آن رسیده که افزونه خودمان را در مخزن وردپرس قرار دهیم. با این کار افزونه شما در دسترس همه کاربران وردپرس قرار خواهد گرفت و می توانند از آن استفاده کنند.

در ابتدا باید یک فایل «Read Me» برای افزونه خود ایجاد کنید. یک فایل متنی خالی باز کنید و آن را به عنوان readme.txt در پوشه افزونه خود ذخیره کنید.

فایل readme.txt

این فایل readme.txt باید با سینتکس (syntax) فایل readme سایت WordPress.org مطابقت داشته باشد. اطلاعاتی که در فایل readme.txt اضافه می کنید در صفحه افزونه شما در WordPress.org نمایش داده می شود.

در زیر یک نمونه فایل readme.txt وجود دارد که می توانید از آن به عنوان نمونه استفاده کنید.

=== Your Plugin Name ===
Contributors: tik4-plugin
Tags: tik4, plugin tutorial
Requires at least: 5.5
Tested up to: 5.8
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.

اکنون اجازه دهید کمی در مورد نحوه عملکرد سینتکس فایل readme افزونه وردپرس توضیح دهیم تا بتوانید آن را برای افزونه خود سفارشی کنید.

پس از ویرایش فایل readme افزونه خود، فراموش نکنید که تغییرات خود را ذخیره کنید.

اضافه کردن افزونه ساخته شده به مخزن وردپرس

اکنون افزونه شما آماده است تا توسط تیم افزونه های WordPress.org بررسی شود. برای ارسال افزونه خود به یک حساب رایگان WordPress.org نیاز دارید.

از صفحه Add Your Plugin دیدن کنید و اگر قبلا وارد نشده اید، روی دکمه ورود در گوشه سمت راست بالای صفحه کلیک کنید.

پس از ورود به سیستم، می‌توانید افزونه خود را آپلود کرده و برای بررسی ارسال کنید. به سادگی روی دکمه Select File کلیک کنید تا فایل فشرده افزونه خود را انتخاب کنید و سپس روی دکمه آپلود کلیک کنید.

 

تیم بررسی افزونه WordPress.org سپس به کد پلاگین شما برای خطاهای رایج و بررسی های امنیتی نگاه می کند. پس از تایید، یک ایمیل از تیم افزونه ها دریافت خواهید کرد.
این ایمیل حاوی پیوندی به مخزن Subversion (SVN) افزونه شما است که در WordPress.org میزبانی شده است.

استفاده از Subversion (SVN) برای آپلود افزونه

ساب ورژن (Subversion) چیست؟

Subversion یک نرم افزار کنترل نسخه مانند git است. این نرم افزار به کاربران اجازه می‌دهد تا در فایل‌ها و دایرکتوری‌ها تغییراتی ایجاد کنند و در عین حال تغییرات را ثبت کنند، نسخه‌های مختلف را مدیریت کنند و امکان همکاری بین برنامه نویسان آن را برای  را فراهم کنند.
برای آپلود افزونه خود در WordPress.org به یک کلاینت SVN نیاز دارید که روی رایانه خود نصب شده باشد.

از کدام کلاینت SVN استفاده کنیم ؟

کاربران ویندوز می توانند از SilkSVN یا TortoiseSVN (رایگان) استفاده کنند. کاربران مک می توانند SmartSVN یا Versions App را بر روی رایانه خود نصب کنند.

در این مقاله، اسکرین شات هایی از برنامه TortoiseSVN بر روی ویندوز برای شما آماده کرده ایم. البته که این روند برای دیگر برنامه ها مشابه است و فقط ظاهر گرافیکی آن ها تفاوت دارد.

آموزش TortoiseSVN

نصب TortoiseSVN هیچ پیچیدگی خاصی نداشته و مانند دیگر نرم افزار ها نصب می شود. پس از نصب باید Repository که لینک آن برای شما ارسال شده است را در سیستم خود کپی کنید.

ساخت دایرکتوری لوکال در سیستم

برای این کار یک فولدر در سیستم خود ایجاد کنید و با کلیک راست کردن روی آن گزینه «SVN Checkout» را بزنید.

 

با این کار یک پنجره بازشو ظاهر می شود که در قسمت «URL of repository» باید لینک ایمیل شده را قرار دهید. در قسمت «Checkout directory» هم باید آدرس فولدری که میخواهید از ریپازیتوری (Repository) بر روی آن کپی بگیرید وارد کنید. سپس یا کلیک بر روی دکمه OK این کار انجام می شود.

حال TortoiseSVN یک کپی از مخزن افزونه شما را در رایانه شما دانلود می کند. پس از دانلود شما می توانید فایل های زیر مشاهده کنید. علامت تایید بر روی فولدر ها به این معنی است که تمام فایل های ساخت پلاگین وردپرس شما بر روی مخزن هم با این مشخصات وجود دارد.

اضافه کردن فایل های پلاگین به مخزن

اکنون باید فایل های پلاگین خود را کپی کرده و در پوشه ترانک (trunk) مخزن محلی خود قرار دهید. همانطور که این کار را انجام می دهید، یک نماد علامت سوال در کنار فایل های جدید در برنامه نسخه ها مشاهده خواهید کرد.

از آنجایی که این فایل‌ها قبلا وجود نداشتند، باید آنها را اضافه کنید. بر روی فایل های جدید کلیک راست کرده و از منوی TortoiseSVN گزینه «Add» را بزنید تا این تغییرات بر روی مخزن شما نیز اعمال شود.

اکنون که فایل های افزونه شما به subversion اضافه شده اند، اکنون آماده آپلود آنها هستید. اساسا، شما تغییرات را در پوشه محلی خود و دایرکتوری subversion همگام سازی خواهید کرد.

آپلود فایل های پلاگین به مخزن WordPress.org

بر روی مخزن محلی خود راست کلیک کنید تا آن را انتخاب کنید و سپس بر روی دکمه “SVN Commit” کلیک کنید. همانطور که در عکس زیر مشاهده می کنید، آیکون خطر بر روی فولدر قرار گرفته که به این معنی است که تغییراتی بر روی فولدر محلی ساخت پلاگین وردپرس شما انجام شده که با repo مخزن متفاوت است.

یک پنجره جدید ظاهر می شود و لیست تغییرات و کادری برای اضافه کردن یک پیام commit را مشاهده خواهید کرد. در این مرحله می توانید پیام «add plugin file» را برای این commit در نظر بگیرید. پس از وارد کردن پیام و انتخاب فایل ها روی دکمه OK کلیک کنید تا مخزن شما آپدیت شود.

ایجاد یک نسخه جدید برای پلاگین

اکنون که فایل های افزونه خود را در ترانک آپلود کرده اید، وقت آن است که آنها را به یک نسخه برچسب گذاری کنید.

به نسخه محلی افزونه خود بروید و فایل های داخل پوشه ترانک (trunk) را کپی کنید. پس از آن باید پوشه برچسب ها (tags) را باز کنید و داخل آن یک پوشه جدید ایجاد کنید.

نام این پوشه را به نام یک نسخه (version) بگذارید. مطمئن شوید که با نسخه ای که در هدر قسمت ساخت پلاگین وردپرس خود وارد کرده اید مطابقت داشته باشد. در کد نمونه بالا، ما از نسخه 1.0 برای افزونه خود استفاده کرده ایم.

پس از افزودن پوشه 1.0 در پوشه /tags/. نماد علامت سوال را در کنار نام پوشه در برنامه نسخه مشاهده خواهید کرد.

از آنجایی که این یک پوشه جدید است، باید روند افزودن را یکبار دیگر انجام دهید. پس از آن هم باید این تغییرات را با commit کردن ثبت کنید تا تغییرات خود را با مخزن WordPress.org همگام سازی کنید.

اگر تغییرات عمده‌ای در افزونه خود ایجاد کرده‌اید، می‌خواهید با افزودن یک پوشه جدید به نام شماره نسخه، نسخه جدیدی را اضافه کنید. مطمئن شوید که شماره نسخه با هدر افزونه شما مطابقت دارد.

اکنون می توانید پیش نمایش افزونه خود را در فهرست افزونه های WordPress.org مشاهده کنید.

افزودن آثار هنری (Artwork) به پلاگین خود در WordPress.org

WordPress.org به شما امکان می دهد که تصاویری و اسکرین شات ها را به افزونه های خود اضافه کنید. این موارد باید از شیوه های نامگذاری استاندارد پیروی کنند و باید با استفاده از Subversion آپلود شوند.

بنر هدر ساخت پلاگین وردپرس

این تصویر بزرگی است که در بالای صفحه افزونه ظاهر می شود. این می تواند در 727×250 یا 1544×500 پیکسل در فرمت های فایل jpeg یا png باشد. همیشه باید به این صورت نامگذاری شود:

نماد پلاگین

این یک فایل تصویری مربعی شکل کوچکتر است که به عنوان نماد افزونه در نتایج جستجو و لیست افزونه ها نمایش داده می شود. این می تواند در 125×125 یا 250×250 پیکسل در فرمت های فایل jpeg یا png باشد.

این فایل آیکون باید به این صورت نامگذاری شود:

اسکرین شات ها در ساخت پلاگین وردپرس

فایل های اسکرین شات باید با فرمت زیر نام گذاری شوند:

می توانید هر تعداد که دوست دارید اضافه کنید. این اسکرین شات ها باید به همان ترتیبی باشد که در قسمت توضیحات (Description) اسکرین شات در فایل readme.txt شما نمایش داده می شود.

هنگامی که تمام آثار هنری را آماده کردید، می توانید آنها را در پوشه (assets) نسخه محلی افزونه خود قرار دهید.

پس از آن یک نماد علامت سوال در کنار پوشه دارایی ها مشاهده خواهید کرد. روند افزودن و commit کردن یکبار دیگر تکرار کنید تا همگام سازی با WordPress.org انجام شود.

کلام آخر

ساخت افزونه وردپرس می تواند به همین سادگی باشد که در بالا به شما نشان دادیم. البته که این یک آموزش اولیه بوده و شما می توانید امکانات زیادی را روی افزونه خود اضافه کنید. همین طور می توانید برای راهنمایی بیشتر ساختار افزونه های محبوبی مانند ووکامرس (woocommerce) ، گفتگو (wpdiscuz.com) و بسیاری از افزونه های دیگر را بررسی کنید.

امیدواریم این مقاله از تیک4 به شما در یادگیری نحوه ایجاد افزونه وردپرس کمک کرده باشد. همچنین می توانید سوالات خود را در این زمینه در قسمت پرسش و پاسخ سایت تیک4 مطرح کنید تا بهترین برنامه نویسان این زمینه پاسخگوی شما باشند.

خروج از نسخه موبایل