آموزش ساخت پلاگین وردپرس

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

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

معمولا پلاگین‌ها ساختاری مانند تصویر زیر دارند.

آموزش ساخت پلاگین

به یاد داشته باشد نام پلاگین شما باید منحصر به فرد باشد، نام پوشه‌ی پلاگین هم نام پلاگینتان باشد. به طور مثال myplugin.php. حال چگونه پلاگین را بنویسیم، ابتدا به فایل myplugin.php مراجعه کرده و هدر را می نویسیم.

اجزای Header

اولین قسمت یک پلاگین هدر آن است، در ساده‌ترین حالت هدر فقط دارای نام پلاگین شماست.

اما به طور کلی و استاندارد هدر دارای اجزای زیر است:

  1. نام پلاگین Plugin Name: نام پلاگین شما، که این نام در لیست پلاگین‌های وردپرس نیز نمایش داده می‌شود.
  2. آدرس منبع پلاگین Plugin URI: آدرس صفحه اصلی پلاگین شما، جایی که می‌توان پلاگین شما را برای دانلود در اختیار داشت که می‌تواند سایت wordpress.org و یا آدرس وب‌سایت شما باشد.
  3. توضیحات Description: توضیحات کوتاهی در مورد پلاگین که در صفحه‌ی ادمین وردپرس نمایش داده می‌شود، به یاد داشته باشید این توضیحات کمتر از 140 کاراکتر باشد.
  4. ورژن Version: ورژن فعلی پلاگین شما
  5. نویسنده Author: نام نویسنده‌ی پلاگین، اگر بیش از یک برنامه نویس در نوشتن پلاگین همکاری کرده اند می‌توانید مانند یک لیست نام آنها را بنویسید.
  6. آدرس نویسنده Author URI: منظور وب‌سایت یا وبلاگ برنامه نویسان می‌باشد، حتی می‌تواند آدرس پروفایل آنها در وردپرس باشد.
  7. مجوز License: مجوز استفاده از پلاگین شما، مانند مجوز آزاد GPL2
  8. آدرس منبع مجوز License URI: آدرس سایت یا وبلاگی که توضیحات بیشتری در مورد مجوز شما ارائه می‌دهد.
  9. Text Domain
  10. Domain Path: قسمتی است که وردپرس استفاده می‌کند تا بتواند اطلاعات بیشتری در مورد پلاگین شما بیابد مانند ترجمه پلاگین شما و …

بهتر است موارد یک تا 7 حتما نوشته شود.

حال چگونه هدر را در فایل پی اچ پی خود بنویسم؟

فایل myplugin.php را باز کرده و این کد را می نویسیم:

به این شکل هم می‌توانید به صورت ساده و مختصر بنویسید:

اکنون پلاگین شما قابل نصب می‌باشد. حال بیایید با هم یک پلاگین ساده بنویسم. فرض کنید می‌خواهیم پلاگینی بنویسیم که از طریق یک فرم مشخصات کاربر را بگیرد و در دیتابیس ذخیره کند. دقت داشته باشید که شما برای نوشتن پلاکین وردپرس باید با زبان پی اچ پی آشنایی داشته باشید.

در این پلاگین ساختار پوشه‌ها اینگونه است. دقت کنید که این ساختار سلیقه ای ست اما بهتر است اینگونه باشد.

آموزش ساخت پلاگین

فایل my_reservation را باز می‌کنیم و هدر را می‌نویسیم:

حالا باید جلوی دسترسی مستقیم به پلاگین را بگیریم، مانند زیر:

برای اینکه بتوانیم به پوشه‌ها و دیگر فایل‌ها دسترسی داشته باشیم از plugin_dir_url و plugin_dir_path استفاده می‌کنیم ، در فایل اصلی پلاگینمان می‌توانیم آنها را با define معرفی کنیم بدین شکل:

سپس آدرس دو فایل php که می‌خواهیم در این صفحه با آنها کار کنیم را می‌دهیم:

قسمت اول نامی که در define در نظر گرفتیم و قسمت دوم آدرس فایل مورد نظر. ما می‌خواهیم در هنگام فعال شدن شدن پلاگین جدولی در دیتابیس ایجاد شود برای این کار از هوک register_activation_hook به شکل زیر استفاده می‌کنیم.

اولین رشته نام کلاس و دومین رشته نام فانکشن مورد نظر است. این کلاس و فانکشن را در مرحله بعد در پوشه include خواهیم ساخت. در مراحل بعد در پوشه public فایل php خواهیم ساخت که در آن فرم مورد نظر خود را که می‌خواهیم به کار بر نشان دهیم می‌سازیم.

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

برای اضافه کردن جاوااسکریپت‌ها و سی اس اس ‌ها به این شکل عمل می‌کنیم:

یک فانکشن با نام دل خواه ایجاد می‌کنیم و از دستورات wp_register_script ، wp_enqueue_style و wp_enqueue_script استفاده کرده سپس از هوک add_action استفاده می‌کنیم.

رشته اول wp_enqueue_scripts متعلق به وردپرس و رشته دوم نام فانکشن ما می‌باشد.

فایل my_reservation.php به صورت کلی به شکل زیر می‌شود:

در قسمت بعد فایل class-my-plugin-table.php و my_plugin_form.php را خواهیم ساخت.

چگونه و کجا فرم رزرو را بسازیم؟

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

اما کجا این فایل را بسازیم ؟

در پوشه پابلیک فایلی به نام my_plugin_form.php می سازم و کد های زیر را درون آن قرار می دهم .

من یک فرم بسیاد ساده ایجاد کردم ، نام ، نام خانوادگی ، شماره موبایل ، آدرس، و یک درکمه ثبت .

حالا چطور این فرم را در هر قسمتی که خواستیم نمایش بدیم ؟؟؟

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

چطور شرت کد ایجاد کنیم ؟؟ بسیار ساده ، به صفحه اصلی پلاگین بر گردید ، حتما به خاطر دارید که من قبلا my_plugin_form.php را در صفحه اصلی پلاگینم معرفی کرده بودم

به خاطر آوردید ؟؟

راستی من چند خط از کدهامو غیر فعال کردم چون هنوز اون صفحه هات و نساختم

حالا بیاید شرت کدمون ایجاد کنیم :

خوب شرت کد ایجاد شد ، به همین راحتی بزارید کل کد صفحه اصلی یک بار دیگه با هم ببینیم :

بریم از شرت کدمون استفاده کنیم ، من از خود صفحه simple Page استفاده می کنم :

pic1PlugE2

برای اضافه کردن short کدمون نام اونو در صفحه قرار دادم [showMyFrom]حالا صفحه simple page را نگاه کنید :

pic2PlugE2

فرم مون در صفحه simple Page نمایش داده شد .

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

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

من این فایل را در پوشه js قرار می دم و اسم اونو myPluginJsValidation.js می گذارم.

این یک ولیدیشن بسیار ساده است چک می کنیم که فیلد ها خالی نیاشه ، فیلدهای رشته ای عدد داخلش نباشه و شماره موبایل کمتر از 5 عدد وارد نشه ، حالا این فایل جاوا اسکریپ را یه صفحه my_plugin_form.php اضافه می کنم به صفحه اصلی پلاگین برید من کد اضافه کردن سی اس اس و جاوا اسکریپت را یک بار نوشته بودم :

به یاد آوردید ؟ این کد باعث می شود فایل جاوا اسکریپت من در footer صفحه اضافه شود : بیاد source کد صفحه را با هم ببینم ، آیا اضافه شده ؟؟؟

pic3PlugE2

بله اضافه شده . حالا نیاز داریم تغییراتی کوچک در صفحه my_plugin_form.php ایجاد کنیم به این شکل

همان طور که می بینید تگ فرم من تغییر کرد حالا اگر اطلاعات را درست وارد کنید علامت :)و اگر اطلاعات را اشباه وارد کنید علامت 🙁 نمایش داده خواهد شد ، مانند شکل زیر :

pic4PlugE2

اگر اطلاعات را صحیح واردکنم باید چنین تصویری را مشاهده کنید :

pic5PlugE2

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

در قسمت بعد خواهید آموخت چگونه تیبلی برای ذخیره داده ی خود ایجاد کنید.

چطور جدول یا دیتابیس ایجاد کنیم

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

در داخل این پوشه من کلاس php به نام class-my-plugin-table.php می سازم .

ساختار پوشه ها :
pic6PlugE2

اما محتویات این فایل :

id
INT(20) NOT NULL AUTO_INCREMENT,
myName
VARCHAR(25) NOT NULL,
myFamily
VARCHAR(45) NOT NULL,
myMobile
VARCHAR(12) NOT NULL,
myAddress
VARCHAR(12) NOT NULL, UNIQUE KEY id (id) )DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci;”; require_once(ABSPATH . ‘wp-admin/includes/upgrade.php’); dbDelta($sql); } } }

همان طور که می بینید کلاسی به نام my_plugin_table ایجاد کردم و در داخل آن فانکشن استاتیکی به نام my_plugin_create_db ساختم .

برای استفاده از دستوراتی که با mysql مرتبط هستند باید از $wpdb استفاده کنیم ، پس ابتدا من با دستور global $wpdb آن را ایجاد می کنم ، سپس نام جدولم را دادم بعد از آن چک کردن اگر چنین جدولی نیست آن را بساز اگر هست که هیچ و دستورات ساخت یک جدول ، اگر با دستورات ساخت جدول آشنایی ندارید کمی در این باره مطالعه کنید.

چگونه وقتی پلاگین active شد جدول ایجاد شود

به صفحه اصلی پلاگین میریم ، من قطعه کد را از قبل نوشته بودم :

به یاد آوردید ، با استفاده از register_activation_hook این کار به راحتی ممکن می شود ، بیاد امتحان کنیم ، اول پلاگین خود را Deactive میکنیم :

سپس آن را دوباره active کنید .

pic7PlugE2

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

pic8PlugE2

می بینید که wp_myplugindatabse ایجاد شده است .

در قسمت بعد خواهید دید که چگونه اطلاعات را وارد جدول کنید.

چگونه اطلاعات را وارد دیتابیس کنیم

بسادگی این کار را انجام میدهیم ، ابتدا در پوشه include فایلی به نام my_plugin_insert_to_db.php می سازم ، خوب اطلاعات من از طریق فرم و توسط متد post به این صفحه ارسال خواهد شد پس باید چک کنیم تا اطلاعات فرستاده شده اشتباه نباشد، اگر اطلاعات اشتباه بود به صفحه خطا برود اگر درست بود به صفحه موفقیت برود.

من در پوشه public دو فایل به نام های my_plugin_error.php و my_plugin_success.php ساختم آنها دو فایل ساده اند که چاپ می کنند خطا یا موفقیت همین .

چطور کاربر را به این صفحات هدایت کنم ؟؟

با دستود :

اما محتویات کلی فایل my_plugin_insert_to_db.php

ما این فایل ایجاد کردیم اما فرم ما هنوز کار نمی کنه ، چرا ؟ چون باید در action فرم آدرس این فایل را وارد کنیم به این شکل:

در پلاگین چگونه آدرس دهی می کنیم ؟

با استفاده از دستور plugin_url

در فایل جاوا اسکریپت هم من تغییر کوچکی اعمال کردم به این شکل :

فقط گفتم به جای alert محتوای مربوطه را در تگ p نمایش بده .

بیاد دستور insert را تست کنیم .

pic9PlugE2

می بینید که فیلد ها را به درستی پر کردم حالا اگر کلید ثبت را فشار دهید ، باید مانند من به صفحه success.php بروید .

pic10PlugE2

حالا به phpmyadmin بریم تا ببینیم آیا اطلاعات وارد شده یا نه

pic11PlugE2

می بینید که اطلاعات به درستی وارد شده.

در قسمت بعد خواهیم دید چگونه اطلاعات درون جدول را در صفحه ادمین نمایش دهید.

چگونه اطلاعات درون جدول را در صفحه ادمین نمایش دهیم

ابتدا در پوشه admin فایلی به نام my_plugin_admin_result.php می سازم و درون آن کدهای زیر را وارد می کنم :

من دو فانکشن دارم از فانکشن دوم شروع می کنم ، در این فانکشن تمام اطلاعات جدول را انتخاب می کنیم و سپس آن هارا چاپ می کنیم ، اما فانکشن اول ، در این فانکشن از add_menu_page استفاده کردیم که به ترتیب: نام تایتل صفحه ، نامی که می خواهیم در نوار ادمین منو نمایش داده شود فانکشنی که می خواهیم اجرا شود ، یک تصویر برای منوی ما ، و در آخر مکان قرار گیری منو وجود دارد ، لطفا در مورد این هوک بیشترتحقیق کنید .

در آخر باید با استفاده از

این منو را ایجاد کنم .

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

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

pic12PlugE2

و در آخر ساختار پوشه های من :

pic13PlugE2

صفحه اصلی پلاگین من :

در اینجا آموزش مقدماتی ما به پایان رسید ، امید وارم مطالب گفته شده مورد استفاده شما عزیزان قرار گیرد.

پیشنهاد می‌کنم این مقالات هم بخوانید

5 پاسخ

  1. سلام خسته نباشید خیلی خوب بود ، فقط نمی دونم چرا فایل جاوا فرا خونی نمی شود و یا به عبارتی کار نمی کند لطفا راهنمایی بفرمایید. تشکر فراوان از محبت شما

  2. با سلام
    در مورد حملات sql enjection و csrf و xss این پلاگینی که نوشتین چه راهکاری دارد؟؟؟
    ومورد دوم با پلاگین contact form چه تفواتهایی دارد؟؟؟

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

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

۱ ستاره۲ ستاره۳ ستاره۴ ستاره۵ ستاره
(ستاره دهید)
Loading...
Share on twitter
Share on linkedin
Share on telegram
Share on whatsapp
Share on facebook