در این آموزش می‌خواهیم نحوه ساخت یک پلاگین ساده در وردپرس را فرابگیریم. کاری که این پلاگین برای ما انجام می‌دهد، این است که فونت سایت را تغییر دهد. برای شروع باید ابتدا یک پوشه برای آن در مسیر زیر بسازیم:
wp-content/plugins
مناسب است که نام پوشه متناسب با نام پلاگین باشد و همچنین این اطمینان را حاصل کنیم که این نام منحصر به فرد باشد. زیرا در صورتی که نام این پوشه با پلاگین دیگری یکسان باشد، به مشکل خواهیم خورد.
در داخل این پوشه فایل dima.woff و dima.css را قرار می‌دهیم. محتویات فایل dima.css می‌تواند مانند کد زیر باشد:
@font-face {
font-family: dimaFont;
src: url('dima.woff');
body,h1,h2,h3,h4,h5,h6,p,a,li,span,label,input,button,select,option{
font-family: dimaFont;
}
در ادامه باید اولین فایل پلاگین خود را بسازیم. نام این فایل باید از نام پلاگین گرفته شده باشد. مثلا اگر اسم پلاگین “Dima Font” است، نام فایل می‌شود dima-font.php می‌شود. در مورد نام این فایل PHP هم باید دقت شود که منحصر به فرد باشد. یک راه حل خوب این است که نام خود یا شرکت خود را به عنوان پیشوند نام فایل قرار دهید. مثلا myempire-dima-font.php
حال فایل ایجاد شده را باز کرده و کد زیر را در آن قرار دهید:
<?php /* Plugin Name: Myempire dima font Plugin URI: http://myempire.ir Description: این پلاگین به شما این قابلیت را می‌دهد که فونت دیما را بر روی سایت خود فعال کنید. Version: 1.0.0 Author: یوسف شیری Author URI: http://yusef.id.ir */
پس از اعمال تغییرات بالا، اگر به لیست افزونه‌ها در داشبورد سایت وردپرسی خود بروید، افزونه شما به لیست اضافه شده است و می‌توانید آن را فعال کنید. اما طبیعی است که با فعال کردن این افزونه اتفاق جدیدی در سایتتان رخ نمی‌دهد. ما هنوز کدی برای عملکرد پلاگین خود ننوشته‌ایم. پس آموزش را دنبال کنید!
برای اینکه پلاگین ما بتواند تغییری در وردپرس ایجاد کند، باید از قلاب‌های(Hooks) وردپرس استفاده کنیم. قلاب‌های وردپرس به دو دسته Action و Filter تقسیم می‌شوند. Action ها با قابلیت‌ها و امکانات وردپرس در ارتباط هستند در حالی که Filter ها با پردازش محتوا و نمایش آنها سر و کار دارند. مثلا اگر بخواهیم بجای متن پست‌ها، خلاصه‌ی آنها را نمایش دهیم، در واقع بر روی محتوا فیلتر گذاری کرده‌ایم.
سه قلاب اولیه‌ای که معمولا در تمام پلاگین‌های خود نیاز خواهید داشت عبارتند از:
دو مورد اول در زمانی که پلاگین فعال/غیرفعال شود، مورد استفاده قرار می‌گیرند و مورد سوم زمانی که می‌خواهیم پلاگین را حذف کنیم. اما برای نوشتن پلاگین فعلی‌مان به هیچکدام‌شان نیاز نداریم. تنها چیزی که نیاز است، اضافه کردن فایل css مورد نظرمان به لیست فایل‌هایی هست که وردپرس برای بارگذاری صفحات استفاده می‌کند. برای اینکار باید از Action مربوطه استفاده کنیم که نام آن wp_enqueue_scripts است. این action وظیفه‌ی بارگذاری فایل‌های css ها و js های صفحه را بر عهده دارد. برای قلاب کردن پلاگین خودمان به این Action به کد زیر نیاز داریم:
add_action( 'wp_enqueue_scripts', 'myempire_enqueue_style', 9999 );
همانطور که مشاهده می‌کنید، تابع فوق ۳ ورودی دارد. اولی نام Action، دومی نام تابعی که در زمان رخ دادن اکشن باید اجرا شود و سومی اولویت اجرای این تابع است. از آنجاییکه می‌خواهیم css ما به عنوان آخرین فایل css بارگذاری شود، مقدار آن را ۹۹۹۹ قرار دادیم.
حال تنها چیزی که باید پیاده‌سازی کنیم، بدنه‌ی تابع myempire_enqueue_style است. به کد زیر دقت کنید:
function myempire_enqueue_style() {
wp_enqueue_style( 'core', plugins_url( 'dima.css', __FILE__ ), false );
}
در کد بالا از تابع wp_enqueue_style استفاده کردیم. این تابع در ورودی آدرس فایلی را می‌گیرد و آن را به صف Action هم نام خود اضافه می‌کند. پارامتر اول این تابع id دلخواه ماست و پارامتر دوم آدرس فایل css است. از آنجا که فایل css در پوشه پلاگین است، در نتیجه برای آدرس‌دهی آن از تابع plugins_url استفاده کردیم.
در نهایت فایل اصلی ما بصورت زیر خواهد بود:
<?php
/*
Plugin Name: Myempire dima font
Plugin URI: http://myempire.ir
Description: این افزونه به شما این قابلیت را می‌دهد که فونت دیما را بر روی سایت خود فعال کنید.
Version: 1.0.0
Author: یوسف شیری
Author URI: http://yusef.id.ir
*/
function myempire_enqueue_style() {
wp_enqueue_style( 'core', plugins_url( 'dima.css', __FILE__ ), false );
}
add_action( 'wp_enqueue_scripts', 'myempire_enqueue_style', 9999 );
حال اگر پلاگین خود را فعال کنیم، فونت سایت به dima تغییر خواهد کرد و اگر آن را غیرفعال کنیم فونت سایت به حالت پیشفرض تغییر می‌کند.
موفق و پیروز باشید.
