پنج شنبه , شهریور ۳۰ ۱۳۹۶
Home / آموزش وردپرس / ساخت منو برای قالب وردپرس

ساخت منو برای قالب وردپرس

ساخت منو قالب وردپرسیکی از امکانات سیستم وردپرس “فهرست” یا همان منو می باشد که می توانید در پیشخوان وردپرس با بخش نمایش -> فهرست ها رفته و منوهای قالب تان را مدیریت کنید،اگر از قالبی استفاده می کنید که برای آن منو تعریف نشده یا اینکه می خواهید منوهای دیگری به آن اضافه کنید با ما همراه باشید.

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

در پیشخوان وردپرس به بخش نمایش -> ویرایشگر  رفته و از فهرست فایل های سمت چپ فایل functions.php را برای ویرایش انتخاب کرده و کد زیر را به آن اضافه کنید :

function register_my_menus() {
register_nav_menus(
array(
'first-menu' => __( 'منوی اول' )
)
);
}
add_action( 'init', 'register_my_menus' );

ساخت منو وردپرس

 

در صورتی که در بخش ویرایشگر این فایل را نمی بینید به File Manager هاست خود رفته سپس به پوشه قالب سایت تان را پیدا کنید،یک فایل به نام functions.php ساخته و کد زیر را در آن قرار دهید :

<?php
function register_my_menus() {
register_nav_menus(
array(
'first-menu' => __( 'منوی اول' )
)
);
}
add_action( 'init', 'register_my_menus' );
?>

حالا اگر به بخش نمایش -> فهرست ها مراجعه نمایید و یک فهرست ایجاد کنید می بینید که اسم فهرست ما اضافه شده است.(با مراجعه به بخش فهرست ها گزینه ایجاد یک منوی جدید یا create a new menu را انتخاب،یک نام برای فهرست گذاشته سپس می توانید از بخش سمت راست گزینه های دلخواه مانند پیوند ها،صفحات و … را به منوی خود اضافه کنید)

ساخت منو وردپرس

قدم دوم : قرار دادن کد نمایش منو در قالب

برای اینکه منوی ایجاد شده شما در قالب نمایش داده شود باید کد زیر را در کد های قالب تان قرار دهید،به بخش نمایش ->ویرایشگر مراجعه کرده و به عنوان مثال اگر می خواهید در بالای سایت تان نمایش داده شود کد را در فایل header.php قرار دهید.

<?php 
	wp_nav_menu( 
	array( 'theme_location' => 'first-menu',
	 'container' =>'',
	 'menu_class' =>'topnav' ) 
	); 
?>

 

ساخت منو وردپرس

اگر مراحل را به درستی طی کرده باشید منوی شما نمایش داده می شود.در صورتی که بخواهید به منوی استایل بدهید می توانید از نام کلاسی که مشخص کرده اید (مثلا نام کلاسی که ما گذاشته ایم top-menu) استفاده نمایید.به عنوان مثال چنین استایلی

.top-menu 
{
	width:100%;
	background-color:#e8554b;
	text-align:center;
}
.top-menu li
{
	display:inline-block;
	padding:10px;
}
.top-menu li a
{
	display:inline-block;
	padding:5px;
	color:#fff;
}
.top-menu li a:hover
{
	display:inline-block;
	padding:5px;
	color:#e8554b;
	background-color:#fff
}

درباره ی حسن سعادتی

Check Also

محدود کردن طول دیدگاه ها در وردپرس

سلام گاهی وقت ها نیاز است که طول دیدگاه ها(نظرات) در وردپرس را محدود کنیم ...

2 comments

  1. سلام . مرسی واقعا مفید بود 🙂

پاسخ دهید

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