كيفية إنشاء هياكل قائمة مخصصة في WordPress

نشرت: 2015-07-22

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

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

نوع القوائم

هناك عدة أنواع مختلفة من القوائم. تعتمد أنواع القائمة التي يمكنك استخدامها على ميزات المظهر الخاص بك. تشمل أنواع القوائم الشائعة ما يلي:

  • القائمة الأساسية - تظهر هذه القائمة أسفل العنوان. يجب أن يتضمن التنقل الرئيسي والصفحات التي يتوقعها زوارك بناءً على نوع موقع الويب لديك: الصفحة الرئيسية ، حول ، جهة الاتصال ، المدونة ، المحفظة ، إلخ.
  • القائمة الثانوية - تظهر هذه القائمة أعلى الرأس. يجب أن يشمل ذلك الروابط والصفحات التي تريد أن تمنحها لقرائك في مكان مناسب ولكن ليس بالضرورة في هيكل التنقل الرئيسي الخاص بك. يمكن أن تكون هذه عناصر مثل البرامج التعليمية وعربة التسوق وما إلى ذلك.
  • الشريط الجانبي - يمكن وضع القوائم المخصصة في الشريط الجانبي باستخدام أداة القائمة المخصصة. يمكنك استخدام العديد من عناصر واجهة المستخدم كما تريد ووضع أي قائمة فيها.
  • التذييل - يمكنك إنشاء قائمة لتذييل الصفحة فقط. عادة ما تحتوي هذه القائمة على معلومات أقل من القائمة الأساسية الخاصة بك. اعتمادًا على احتياجات موقعك ، فإنه يحتوي عادةً على الصفحة الرئيسية ، وحول ، والاتصال ، والمدونة ، وما إلى ذلك. إذا كان موقعك يتضمن منشورات عن الوظائف ، وبرنامج تابع ، ومواقع شقيقة ، فيمكن تضمينها هنا أيضًا.
  • قائمة الروابط الاجتماعية - هذه قائمة خاصة موجودة في سمات مثل Twenty Fifteen التي تضع روابط الوسائط الاجتماعية الخاصة بك في الشريط الجانبي. إذا كان الموضوع يتعرف على الشبكة الاجتماعية ، فسيوفر الرمز المناسب. إذا لم يكن الأمر كذلك ، فسيتم عرض الأسماء كنص (وفقًا لكيفية تسمية الارتباط).

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

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

إنشاء القوائم المخصصة الخاصة بك

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

إنشاء القوائم من النهاية الخلفية

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

إنشاء القوائم من النهاية الخلفية

في شاشة القائمة ، حدد إنشاء قائمة جديدة ، ومنح القائمة اسمًا ، ثم انقر فوق الزر "إنشاء قائمة".

إنشاء القوائم من النهاية الخلفية 2

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

الصفحات

الصفحات

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

الصفحات 2

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

الصفحات 3

يمكنك تحديد السهم الموجود على اليمين لفتح العنصر وإجراء تعديلات مثل تغيير الاسم والموقع. يمكنك أيضًا إزالة العنصر من هيكل القائمة هنا.

روابط مخصصة

روابط مخصصة

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

الروابط المخصصة 2

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

فئات

فئات

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

الفئات 2

احفظ قائمتك

بمجرد أن تعجبك بنية القائمة الجديدة الخاصة بك ، احفظها ثم يمكنك استخدامها.

إدارة المواقع

هناك طريقتان لاستخدام قائمتك من النهاية الخلفية.

إعدادات القائمة

إعدادات القائمة

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

إدارة المواقع

إدارة المواقع

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

القطعة

القطعة

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

اختبارات

اختبارات

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

استخدام الواجهة الأمامية لعرض WYSIWYG

استخدام الواجهة الأمامية لعرض WYSIWYG

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

قم بتخصيص الشكل والمظهر مع سمات مثل Divi

تمنحك بعض السمات ، مثل Divi 2.4 للموضوع الأنيق ، أدوات حتى تتمكن من إجراء تعديلات على شكل ومظهر قوائمك من الواجهة الأمامية ورؤية تأثيرها على الفور. بهذه الطريقة ستعرف ما سيراه زوار موقعك قبل حفظه.

قم بتخصيص الشكل والمظهر مع سمات مثل Divi

إليك نظرة على تعديلات قائمة Divi. يمكنك إجراء هذه التعديلات نفسها لتغيير الشكل والمظهر لكل عنصر من عناصر القائمة.

المزيد من التخصيص - استخدام الإضافات لتعديل قوائمك

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

أداة معالج القائمة المخصصة

أداة معالج القائمة المخصصة

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

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

إعدادات الأداة سهلة الاستخدام. يمكنك اختيار القائمة من مربع القائمة المنسدلة وتحديد عوامل التصفية والرجوع والإخراج والحاوية والفئات والروابط والبديل (هذا مستوى آخر من الشروط). يمنحك أيضًا رمزًا قصيرًا حتى تتمكن من لصق قوائمك في المحتوى الخاص بك.

Nextend قائمة الأكورديون

Nextend قائمة الأكورديون

يتيح لك هذا المكون الإضافي إنشاء قوائم بأسلوب الأكورديون مع تحكم كامل في مستويات القائمة والألوان والرسوم المتحركة وما إلى ذلك ، ولكل منها إعداداته وأسطحه الخاصة. يمكنك التحكم في مستويات وحالات الخطوط والخلفيات والألوان والصور وما إلى ذلك. فهي تسرع نظام القائمة باستخدام ذاكرة التخزين المؤقت وتوفر أنواعًا مختلفة من الرسوم المتحركة ولديها مستويات غير محدودة من القوائم وتوفر 30 إعدادًا.

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

هناك أيضًا إصدار Pro يضيف ثلاثة سمات ودعمًا. تبدأ الأسعار من 29 دولارًا.

قائمة الاستجابة

قائمة الاستجابة

يحتوي هذا المكون الإضافي المجاني على 70 خيارًا لضبط شكل القوائم وشعورها وتصرفها. يمكنك ضبط العناوين و CSS والإجراءات والأحجام والرسوم المتحركة والبرامج النصية وغير ذلك الكثير. إنه يعمل بشكل رائع للأجهزة المحمولة ولديه ميزات لسحب القائمة من جانب واحد وتعيين موقع القائمة. سيؤدي ذلك أيضًا إلى تصغير CSS وجافا سكريبت في قائمتك. يمكنك أيضًا إضافة HTML مخصص واستيراد / تصدير الإعدادات الخاصة بك.

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

ملحقات أخرى لتعديل القوائم

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

  • قائمة ووردبريس ميجا
  • القائمة المنسدلة CSS3 ميجا
  • قائمة WP المستجيبة
  • 4 قوائم Font Awesome
  • الرموز القصيرة في القوائم
  • مظهر أسرع - القوائم
  • قائمة الطعام والشراب
  • قوائم البيع بالتجزئة البسيطة
  • تنقية قوائم WordPress
  • القطعة Menuizer

نصائح لإنشاء هياكل قائمة رائعة

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

افكار اخيرة

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

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