نحوه ایجاد صفحه داشبورد سفارشی وردپرس

نحوه ایجاد صفحه داشبورد سفارشی وردپرس

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

سپس، به یاد می‌آورم که از زمان وردپرس 3.x، وقتی برای اولین بار پس از به‌روزرسانی وارد می‌شویم، صفحه جدیدی وجود دارد. این چیزی است که من می خواستم انجام دهم.

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

مرحله 1: ایجاد افزونه

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

پوشه پلاگین ها را در زیر wp-content باز کنید و یک مخزن جدید به نام «sweet-custom-dashboard» ایجاد کنید و در داخل این پوشه یک فایل جدید به نام «sweet-custom-dashboard.php» ایجاد کنید. سپس فایل را باز کنید.

برای اعلام افزونه، کافی است این کد را به فایل اضافه کنید:

فقط با افزودن این کد، قبلاً یک افزونه ایجاد کرده‌اید، یک افزونه خالی، اما یک افزونه فعال!

اکنون، باید یک ثابت برای URL افزونه تعریف کنیم، بعداً نیاز خواهیم داشت. این کد را اضافه کنید:

/*
|----------------------------------------------- ------------------------
| ثابت ها
|----------------------------------------------- ------------------------
*/
// آدرس پوشه پلاگین
if(!defined('RC_SCD_PLUGIN_URL')) {
define('RC_SCD_PLUGIN_URL', plugin_dir_url( __FILE__ ));
}

اکنون زمان ایجاد کلاس اصلی افزونه ما است:

/*
|----------------------------------------------- ------------------------
| کلاس اصلی
|----------------------------------------------- ------------------------
*/

کلاس rc_sweet_custom_dashboard {

	/*-------------------------------------------*
	 * سازنده
	 *-------------------------------------------*/

	/**
	 * پلاگین را راه اندازی می کند
	 */
	تابع __construct() {

	} // سازنده پایان

}

// کلاس پلاگین instantiate
$GLOBALS['sweet_custom_dashboard'] = new rc_sweet_custom_dashboard();

مرحله 2: سازنده

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

function __construct() {

	add_action('admin_menu', array( &$this,'rc_scd_register_menu') );
	add_action('load-index.php', array( &$this,'rc_scd_redirect_dashboard') );

} // سازنده پایان

با افزودن این کد، به وردپرس می‌گوییم که می‌خواهیم تابع rc_get_screen() را زمانی که index.php بارگذاری می‌شود بارگیری کنیم (index.php صفحه داشبورد است). همچنین به وردپرس می‌گوییم که یک صفحه داشبورد جدید ثبت کند. موردی که در تغییر مسیر استفاده خواهیم کرد. مرحله بعدی ساخت تابع rc_redirect_dashboard() است.

مرحله 3: تغییر مسیر داشبورد

تابع rc_redirect_dashboard() بسیار ساده است. هدف آن هدایت مجدد کاربر به صفحه سفارشی زمانی است که وی می خواهد به داشبورد پیش فرض دسترسی داشته باشد. برای انجام این کار، باید بررسی کنیم که آیا در صفحه سمت راست (خواندن «صفحه») با استفاده از تابع get_current_screen () هستیم. وقتی این تابع از قلاب «admin_init» فراخوانی می‌شود، NULL را برمی‌گرداند، تا حدی به همین دلیل است که rc_dashboard_redirection() را به «load-index.php» متصل کردم. در اینجا محتوای تابع است:

function rc_scd_redirect_dashboard() {

	if( is_admin() ) {
		$screen = get_current_screen();
		
		if( $screen->base == 'dashboard' ) {

			wp_redirect( admin_url( 'index.php?page=custom-dashboard' ) );
			
		}
	}

}

این کد کاملاً قابل درک است، اگر ما در ادمین باشیم، و اگر صفحه فعلی «داشبورد» است، به یک فایل به نام «custom_dashboard.php» تغییر مسیر می دهیم.

ثبت صفحه داشبورد

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

function rc_scd_register_menu() {
	add_dashboard_page('Custom Dashboard', 'Custom Dashboard', 'Read', 'custom-dashboard', array( &$this,'rc_scd_create_dashboard') );
}

تابع rc_scd_create_dashboard() {
	include_once( 'custom_dashboard.php' );
}

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

مرحله 4: ایجاد داشبورد سفارشی

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

برای شروع، یک فایل جدید به نام «custom_dashboard.php» در پوشه sweet-custom-dashboard خود ایجاد کنید. آن را باز کنید و این کد را اضافه کنید:

اولین تابع ()require_once، وردپرس را بارگیری می‌کند، با افزودن این خط ساده، اکنون می‌توانید از هر متغیر وردپرس یا هر تابعی استفاده کنید.

دو بار دیگر ()require_once برای نمایش صحیح مدیریت مورد نیاز است.

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

" class="image-50" alt="نحوه ایجاد صفحه داشبورد سفارشی وردپرس">

در این کد هیچ چیز جالبی وجود ندارد، فقط کد HTML است.

و در نهایت، باید پاورقی مدیریت وردپرس را بارگذاری کنیم. برای انجام این کار، فقط این خط در پایین فایل:

 

و… همین است! این افزونه اکنون عالی کار می کند، البته راه های زیادی برای بهبود آن وجود دارد، به عنوان مثال می توانید شیوه نامه های سفارشی و فایل های جاوا اسکریپت سفارشی را اضافه کنید، یا می توانید برای نمایش داشبورد سفارشی فقط به برخی از نقش های کاربر، مقداری تأیید اضافی اضافه کنید…

خب، امیدوارم از این آموزش لذت برده باشید و مشتاقانه منتظر خواندن نظرات شما در بخش نظرات هستم!

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

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