كيفية إضافة قوائم تنقل مخصصة في ثيمات ووردبريس

قوائم التنقل هي القائمة الأفقية للروابط المعروضة أعلى معظم مواقع الويب.

بشكل افتراضي ، تأتي قوالب ووردبريس WordPress مع مواقع وتخطيطات قائمة محددة مسبقًا ، ولكن ماذا لو أردت إضافة قوائم التنقل المخصصة الخاصة بك؟

في هذه المقالة ، سنوضح لك كيفية إنشاء قوائم تنقل مخصصة وإضافتها بسهولة في ووردبريس WordPress ، بحيث يمكنك عرضها في أي مكان على المظهر الخاص بك.

متى تحتاج إلى هذا البرنامج التعليمي لقائمة التنقل في ووردبريس؟

تأتي معظم قوالب ووردبريس WordPress مع مكان واحد على الأقل حيث يمكنك عرض روابط التنقل الخاصة بموقعك في قائمة.

يمكنك إدارة عناصر القائمة من واجهة سهلة الاستخدام داخل منطقة إدارة ووردبريس WordPress الخاصة بك .

إذا كنت تبحث فقط عن إضافة قوائم التنقل على موقع الويب الخاص بك ، فما عليك سوى اتباع دليل المبتدئين الخاص بنا حول كيفية إضافة قائمة تنقل في WordPress .

الهدف من هذا البرنامج التعليمي هو مساعدة المستخدمين المتوسطين على إضافة قوائم تنقل مخصصة في قوالب ووردبريس WordPress الخاصة بهم.

دعنا نلقي نظرة على كيفية إضافة قوائم تنقل ووردبريس WordPress مخصصة في قالبك.

إنشاء قوائم تنقل مخصصة في قوالب ووردبريس

قوائم التنقل هي إحدى ميزات قوالب ووردبريس WordPress. يمكن لكل سمة تحديد مواقع القائمة الخاصة بها ودعم القائمة.

لإضافة قائمة التنقل ، فإن أول شيء عليك القيام به هو تسجيل قائمة التنقل الجديدة عن طريق إضافة هذا الرمز إلى القالب الخاص بك في ملف functions.php .

function wpb_custom_new_menu() {

  register_nav_menu('my-custom-menu',__( 'My Custom Menu' ));

}

add_action( 'init', 'wpb_custom_new_menu' );

يمكنك الآن الانتقال إلى المظهر » قوائم في مسؤول ووردبريس WordPress الخاص بك ومحاولة إنشاء قائمة جديدة أو تحريرها. 

سترى "قائمتي المخصصة" كخيار موقع الموضوع.

إذا كنت ترغب في إضافة أكثر من موقع واحد لقائمة التنقل الجديدة ، فستحتاج إلى استخدام رمز مثل هذا:

function wpb_custom_new_menu() {

  register_nav_menus(

    array(

      'my-custom-menu' => __( 'My Custom Menu' ),

      'extra-menu' => __( 'Extra Menu' )

    )

  );

}

add_action( 'init', 'wpb_custom_new_menu' );

بمجرد إضافة موقع القائمة ، تابع وأضف بعض عناصر القائمة في مسؤول ووردبريس WordPress باتباع البرنامج التعليمي الخاص بنا حول كيفية إضافة قوائم التنقل للمبتدئين .

سيسمح لنا ذلك بالانتقال إلى الخطوة التالية وهي عرض القائمة في المظهر الخاص بك.

عرض قوائم التنقل المخصصة في قوالب ووردبريس

بعد ذلك ، نحتاج إلى عرض قائمة التنقل الجديدة في قالب ووردبريس WordPress الخاص بك. 

المكان الأكثر شيوعًا حيث يتم وضع قوائم التنقل عادةً هو قسم رأس الموقع بعد عنوان الموقع أو الشعار مباشرةً.

ومع ذلك ، يمكنك إضافة قائمة التنقل الخاصة بك في أي مكان تريده.

ستحتاج إلى إضافة هذا الرمز في ملف القالب الخاص بك حيث تريد عرض قائمتك.

<?php

wp_nav_menu( array( 

    'theme_location' => 'my-custom-menu', 

    'container_class' => 'custom-menu-class' ) ); 

?>

موقع المظهر هو الاسم الذي اخترناه في الخطوة السابقة.

فئة الحاوية هي فئة CSS التي ستتم إضافتها إلى قائمة التنقل الخاصة بك. ستظهر قائمتك كقائمة ذات تعداد نقطي عادي على موقع الويب الخاص بك.

يمكنك استخدام فئة CSS لتصميم قوائمك .custom_menu_class . إليك نموذج CSS لمساعدتك على البدء:

div.custom-menu-class ul {

    margin:20px 0px 20px 0px;

    list-style-type: none;

    list-style: none;

    list-style-image: none;

    text-align:right;

}

div.custom-menu-class li {

    padding: 0px 20px 0px 0px;

    display: inline;

} 

div.custom-menu-class a { 

    color:#FFFFFF;

}

لمعرفة المزيد حول تصميم قائمة التنقل ، راجع البرنامج التعليمي المفصل الخاص بنا حول كيفية تصميم قوائم التنقل في WordPress

إضافة قائمة تنقل مخصصة في ووردبريس باستخدام منشئ صفحات

إذا كنت تقوم بإنشاء صفحة مقصودة مخصصة أو تخطيط الصفحة الرئيسية ، فإن استخدام مكون إضافي منشئ صفحات ووردبريس WordPress سيجعل الأمر برمته أسهل كثيرًا.

نوصي باستخدام Beaver Builder ، وهو أفضل منشئ صفحات ووردبريس WordPress في السوق. يسمح لك بإنشاء أي نوع من تخطيط الصفحة باستخدام أدوات السحب والإفلات البسيطة (لا يلزم وجود تشفير).

يتضمن هذا أيضًا إضافة قائمة تنقل مخصصة إلى تخطيط صفحتك.

أولاً ، ستحتاج إلى تثبيت وتفعيل المكون الإضافي Beaver Builder .

عند التنشيط ، تحتاج إلى إنشاء صفحة جديدة أو تعديل صفحة موجودة حيث ترغب في إضافة قائمة التنقل. 

في شاشة محرر المنشورات ، انقر فوق الزر "Launch Beaver Builder ".

إذا كانت صفحة جديدة ، فيمكنك استخدام أحد القوالب الجاهزة التي تأتي مع Beaver Builder. يمكنك أيضًا تعديل صفحتك الخارجية على الفور.

بعد ذلك ، تحتاج إلى إضافة وحدة القوائم وسحبها وإفلاتها على صفحتك إلى المكان الذي تريد عرض القائمة فيه.

سيؤدي ذلك إلى إظهار إعدادات وحدة القائمة في نافذة منبثقة. 

أولاً ، تحتاج إلى تحديد قائمة التنقل التي تريد استخدامها. 

يمكنك دائمًا إنشاء قوائم جديدة أو تعديل قائمة موجودة من خلال زيارة المظهر » قوائم في منطقة إدارة ووردبريس WordPress.

يمكنك مراجعة الإعدادات الأخرى أيضًا. يتيح لك Beaver Builder اختيار ألوان وخلفية وخصائص نمط أخرى مخصصة لقائمتك.

بمجرد الانتهاء ، يمكنك النقر فوق الزر حفظ ومعاينة القائمة الخاصة بك.

إنشاء قوائم مستجيبة متوافقة مع الجوّال في ووردبريس

مع زيادة استخدام الأجهزة المحمولة ، قد ترغب في جعل قوائمك متوافقة مع الجوّال عن طريق إضافة أحد التأثيرات الشائعة العديدة.

يمكنك إضافة تأثير الانزلاق (أعلاه) وتأثير القائمة المنسدلة وحتى تأثير التبديل لقوائم الهاتف المحمول.

لدينا دليل مفصل خطوة بخطوة حول كيفية إنشاء قوائم WordPress سريعة الاستجابة للجوال .

أنجز المزيد باستخدام قوائم التنقل في ووردبريس

تعد قوائم التنقل أداة قوية لتصميم الويب. 

إنها تسمح لك بتوجيه المستخدمين إلى أهم أقسام موقع الويب الخاص بك.

يتيح لك WordPress القيام بأكثر من مجرد عرض الروابط في قائمتك. جرب هذه البرامج التعليمية المفيدة لتوسيع وظائف قوائم التنقل على موقع WordPress الخاص بك.

• كيفية إضافة أيقونات الصور مع قوائم التنقل في WordPress
• كيفية إضافة أوصاف القائمة في قالب WordPress الخاص بك
• كيفية إضافة قائمة استجابة ملء الشاشة في WordPress
• كيفية إضافة قائمة ضخمة إلى موقع WordPress الخاص بك

هذا كل شيء ، نأمل أن يساعدك هذا الدليل النهائي في تعلم كيفية إضافة قائمة تنقل في ووردبريس WordPress. 

إذا أعجبك هذا المقال ، فالرجاء أضافة تعليق وتققيم للموضوع .

أذا كان لديك أي أستفسار لاتتردد بمراسلتنا هنا 

يمكنك أيضًا العثور علينا على Twitter و Facebook