حسنًا، كيف نستطيع إضافة تلك الخاصية إلى القوائم الموجودة فى الهيدر مثلاً؟ .. فقط إتبع الخطوات الآتية:
1- قم بفتح ملف functions.php.
2- قم بكتابة دالة جديدة، سأسميها مثلاً register_my_menus، وبداخل تلك الدالة (التي ستقوم أنت بإنشاؤها) سنضع دالة جاهزة فى الووردبريس وهي دالة register_nav_menu، وهي تأخذ بارامترين، البارامتر الأول وهو الاسم الكودي للقائمة (أىّ الذي ستستخدمه أثناء التكويد للوصول إلى تلك القائمة)، والبارامتر الثاني وهو اسم القائمة الذي يظهر للمستخدم فى لوحة تحكم الووردبريس.
/*
Registering Menus
*/
function register_my_menus(){
register_nav_menu( 'pages-menu', 'Pages Menu');
register_nav_menu( 'top-menu', 'Top Menu');
}
فى المثال السابق قمت بتسجيل قائمتين لديّ فى القالب.Registering Menus
*/
function register_my_menus(){
register_nav_menu( 'pages-menu', 'Pages Menu');
register_nav_menu( 'top-menu', 'Top Menu');
}
بعد ذلك سأقوم بإضافة الدالة التي قمت بكتابتها بداخل دالة تُدعى add_action كالتالي:
add_action('init','register_my_menus');
لاحظ أن البارامتر الثاني هو عبارة عن اسم الدالة التى قمت بإنشاءها، فبذلك يصبح الشكل الكامل لملف functions.php كالتالي:
/*
Defeining Constants
*/
define("THEMEROOT", get_stylesheet_directory_uri());
define("IMAGES", THEMEROOT."/images");
/*
Registering Menus
*/
function register_my_menus(){
register_nav_menu( 'pages-menu', 'Pages Menu');
register_nav_menu( 'top-menu', 'Top Menu');
}
add_action('init','register_my_menus');
الآن إنتهينا من ملف functions.php، وبذلك أيضًا انتهينا من تسجيل القوائم التي لدينا لدى الووردبريس، لكن تبّقى تحديد أماكن عرضها، ولذلك سنقوم بفتح ملف header.php، أو ملف footer.php وهما الملفات اللذان غالبًا ما ستكون القوائم بهما، ثم نقوم بتحديد أماكن تلك القوائم، فمثلاً انا لدي تلك القائمة فى ملف header.php:Defeining Constants
*/
define("THEMEROOT", get_stylesheet_directory_uri());
define("IMAGES", THEMEROOT."/images");
/*
Registering Menus
*/
function register_my_menus(){
register_nav_menu( 'pages-menu', 'Pages Menu');
register_nav_menu( 'top-menu', 'Top Menu');
}
add_action('init','register_my_menus');
<div id="pages-menu">
<ul>
<li><a href="#">index</a></li>
<li><a href="#">index</a></li>
<li><a href="#">index</a></li>
<li><a href="#">index</a></li>
</ul>
</div>
كل ما عليك الآن هو حذف قائمة الـUL وجميع ما بداخلها، ثم ستستبدلها بدالة تُدعى wp_nav_menu، تأخذ بارامتر واحد وهو عبارة عن مصفوفة بها Key واحد لقيمة واحدة، هذا الـKey هو كلمة theme_location، وتلك القيمة هي الاسم الكودي للقائمة التى تريد عرضها هنا ! ... فيصبح الكود كالتالي:<ul>
<li><a href="#">index</a></li>
<li><a href="#">index</a></li>
<li><a href="#">index</a></li>
<li><a href="#">index</a></li>
</ul>
</div>
<div id="pages-menu">
<?php
wp_nav_menu(array("theme_location"=>"pages-menu"));
?>
</div>
ولعرض القائمة الثانية التي كانت تُدعى top-menu ببساطة سأقوم بفعل ما فعلته مع pages-menu بالظبط، حيث سيكون الكود كالتالي:<?php
wp_nav_menu(array("theme_location"=>"pages-menu"));
?>
</div>
<div id="topmenu">
<?php
wp_nav_menu(array("theme_location"=>"top-menu"));
?>
</div>
الآن إذا قمت بتفعيل القالب من لوحة تحكم الووردبريس، ستجد أنه تم إضافة خاصية Menus فى لوحة التحكم، عندها يمكنك تحديد الصفحات والتصنيفات والروابط التي يتم عرضها فى كل قائمة، وسيتم عرض كل قائمة فى مكانها بدون أى مشاكل :)<?php
wp_nav_menu(array("theme_location"=>"top-menu"));
?>
</div>
فى الدرس القادم بإذن الله سنتحدث عن صفحة index.php وكيفية عرض التدوينات والقائمة الجانبية إلخ إلخ.
ملاحظة: هذا الشرح هو لتصميم قالب ووردبريس بلغة واحدة، لكن توجد طريقة ليجعل القالب يدعم الترجمة لأكثر من لغة، ولكننى سأترك تلك الطريقة إلى آخر درس فى سلسلة دروس تصميم قوالب الووردبريس -إن شاء الله-.
0 التعليقات:
إرسال تعليق