Generic selectors
Exact matches only
Search in title
Search in content
Search in posts
Search in pages

آموزش طراحی پنل مدیریت وردپرس ( قسمت 1 )

آموزش طراحی پنل مدیریت وردپرس ( قسمت 1 )

نیازی که اکثر طراحان تازه کار اکثر اوقات با آن مواجه هستیم طراحی یک پنل مدیریت وردپرس دلخواه برای کارمان است. افزونه هایی زیادی مانند: Advanced Custom Fields, Codestar Framework وجود دارد که شما میتوانید از آن برای ایجاد پنل خودتان استفاده کنید اما اگر بخواهید که پنل مدیریت خود با شکل و شمایل خاص خودتان را بر روی قالب های خود بگذارید چطور ؟

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

بریم سراغ آموزش:

مرحله یک: شروع ساخت افزونه

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

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

برای شروع ابتدا به آدرس wp-content/plugins میرویم تا لیست تمامی افزونه های موجود درون سایت را ببینیم، در داخل این فولدر شما باید پلاگین خودتان را بسازید.

من اسم پلاگین را میزارم skinche admin panel بر اینکار نیاز است که فایلی و فولدری با همین نام ایجاد کنیم. بدین صورت:

skinche-admin-panel/skinche-admin-panel.php

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

<?php
/**
 * Plugin Name:       Skinche Admin Panel
 * Plugin URI:        https://download.skinche.ir/plugins/skinche-admin-panel
 * Description:       پنل مدیریت من.
 * Version:           1.0.0
 * Requires at least: 5.2
 * Requires PHP:      7.2
 * Author:            Ahmadreza Ebrahimi
 * Author URI:        https://www.skinche.ir/AHMAD_R3ZA
 */

برای اطلاعات بیشتر اینجا را بخوانید.

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

افزونه پنل مدیریت اسکینچه در افزونه ها
افزونه پنل مدیریت اسکینچه در افزونه ها

پس از فعال سازی میریم سراغ شروع بخش شیرین کدنویسی 😁

مرحله دو: ایجاد صفحه پنل مدیریت وردپرس و افزودن به سایدبار وردپرس

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

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

add_action( 'admin_menu', function () {
	add_menu_page(
		'پنل مدیریت اسکینچه', // page_title
		'پنل تنظیمات', // menu_title
		'manage_options', // capability
		'skinche-admin-panel', // menu_slug
		'skinche_admin_panel_cb', // function
		'dashicons-admin-generic', // icon_url
		3 // position
	);
} );
  1. page_title: عنوان صفحه که در تگ <title> نشان داده خواهد شد.
  2. menu_title: عنوان منو در سایدبار پیشخوان وردپرس.
  3. capability: تعیین سطح دسترسی ( تنها کاربرانی که سطح دسترسی manage_options را داشته باشند میتوانند پنل مدیریت را ببینند ).
  4. menu_slug: آدرس صفحه تنظیمات که به صورت admin.php?page=skinche-admin-panel میباشد.
  5. function: نام تابعی که محتویات صفحه درون آن نشان داده میشود.
  6. icon_url: آیکون مورد نظر برای نمایش در منو ( شما میتوانید آدرس یک تصویر را بصورت مستقیم وارد کنید یا از آیکون های Dashicons استفاده کنید ).
  7. position: موقعیت منو درون سایدبار.
    2 – پیشخوان
    4 – جداکننده
    5 – نوشته‌ها
    10 – رسانه
    15 – پیوند‌ها
    20 – برگه‌ها
    25 – دیدگاه‌ها
    59 – جداکننده
    60 – نمایش
    65 – افزونه‌ها
    70 – کاربران
    75 – ابزارها
    80 – تنظیمات
    99 – جداکننده

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

Warning: call_user_func_array() expects parameter 1 to be a valid callback, function 'skinche_admin_panel_cb' not found or invalid function name in C:\xampp\htdocs\skinche\wp-includes\class-wp-hook.php on line 28

دلیل آن هم آن است که هنوز تابعی با نام skinche_admin_panel_cb بوجود نیاوردیم در خط بعد شما تنها با نوشتن این خط میتوانید خطا را از بین ببرید و نوشته Hello World را چاپ کنید.

function skinche_admin_panel_cb() {
	echo 'Hello World!';
}

به نظرم برای قسمت اول تا همینجا کافیه بزودی قسمت دوم آموزش رو برای ایجاد قسمت های اصلی صفحه مدیریت شروع میکنیم.

شما میتوانید فایل ها را تا به اینجای کار دانلود کنید. 👇


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

تا درودی دیگر بدرود. ❤️

تصویر پروفایل احمدرضا ابراهیمی
احمدرضا ابراهیمی

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

دیدگاه ها
مشترک شدن
اطلاع از
guest
0 دیدگاه‌ها
بازخورد درون خطی
مشاهده تمامی دیدگاه ها