جاري جلب النتائج...

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

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

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

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

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

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

اقرأ حول - إضافات مجانية لتحسين صور المدونة

جدول المحتويات 

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

القوائم المنسدلة هي ببساطة التقسيمات المتفرعة من القائمة الرئيسية لمدونتك. تخيل أن لديك مدونة، والقسم الرئيسي فيها باسم "الأدب العربي". يتفرع من "الأدب العربي" (النثر، الروايات، النقد).

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

ملاحظة مهمة 💡: تطبيق القوائم المنسدلة يعتمد بشكل أساسي على "القالب" المُركب على مدونتك. تدعم القوالب الحديثة (المجانية والمدفوعة) مثل قالب سكويز أو سي بلس هذه العناصر عبر أكواد برمجية جاهزة تتعرف على رموز معينة سنشرحها لاحقًا.

تجهيز روابط التسميات قبل إنشاء القائمة

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

في منصة بلوجر، نعتمد في تصنيف العناصر على ما يسمى بـ "التسميات" (Labels). لذلك، يجب عليك تصنيف مقالاتك، وإضافة التسميات الصحيحة لكل مقال (مثل: أخبار، تقنية، رياضة). بعد نشر مقالاتك بالتسميات، قم بزيارة مدونتك واضغط على أي تسمية لفتح صفحة تضم جميع المقالات التابعة لها. قم بنسخ رابط هذه الصفحة من شريط العنوان؛ وسنحتاج إلى هذا الرابط في الخطوات التالية لربطه بالقائمة المنسدلة.اقرأ حول- خطوات إنشاء صفحة اتصل بنا احترافية

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

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

  1. الوصول إلى القائمة الرئيسية 📌 اذهب في لوحة تحكم بلوجر إلى قسم (التنسيق)، ثم ابحث عن أداة القائمة الرئيسية (Main Menu)، واضغط على أيقونة (تعديل) أو القلم بجوارها.
  2. إضافة عنصر منسدل 📌 اضغط على (إضافة عنصر جديد). في خانة "اسم الموقع"، اكتب اسم القائمة المنسدلة، ولكن انتبه جيداً: يجب أن يسبق الاسم علامة الزائد (+). (مثال: إذا كان القسم الفرعي باسم الشعر، اكتبه هكذا: +الشعر).
  3. وضع رابط مؤقت 📌 في خانة الرابط، اكتب رمز الشباك (#) كرابط مؤقت، ثم اضغط على حفظ.
  4. ترتيب العناصر بدقة 📌 استخدم الأسهم لتحريك القائمة المنسدلة (+الشعر) لتكون أسفل القائمة الرئيسية الخاصة بها (الأدب العربي) مباشرة. إذا لم تضعها أسفلها بشكل مباشر، فلن تنسدل القائمة بشكل صحيح.
  5. إضافة الرابط الحقيقي 📌 بعد الانتهاء، اذهب لمدونتك، انسخ رابط التسمية (القسم) الذي جهزناه سابقًا، وعد إلى أداة القائمة واحذف رمز الشباك (#) والصق الرابط الحقيقي بدلاً منه. ثم اضغط حفظ للعنصر، واختر حفظ من أسفل الصفحة لحفظ الأداة بالكامل.اقرأ حول - شرح إضافة سياسة الخصوصية لمدونة بلوجر

كيفية إضافة قوائم فرعية متداخلة قائمة داخل قائمة

في بعض المدونات الكبيرة (مثل المتاجر أو المواقع الإخبارية)، قد لا تكفي القوائم المنسدلة العادية، بل نحتاج إلى تفريعات أدق. بمعنى؛ قائمة منسدلة يخرج منها قائمة منسدلة أخرى! هذه تسمى القوائم المتداخلة (Sub-dropdown menus).

الطريقة مطابقة للخطوات السابقة، ولكن مع اختلاف بسيط جداً في الكتابة. عند رغبتنا في إضافة قائمة منسدلة داخل قائمة منسدلة أخرى، نكتب اسم القسم مسبوقاً بعلامتي زائد (++).

  • المستوى الأول (رئيسي): الأدب العربي (بدون أي علامات).
  • المستوى الثاني (منسدل): +الشعر (بعلامة + واحدة ويوضع تحت المستوى الأول).
  • المستوى الثالث (فرعي من المنسدل): ++العصر الجاهلي (بعلامتي ++ ويوضع تحت المستوى الثاني).

القاعدة الذهبية- أهمية التطابق الحرفي في التسميات

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

عند تصنيف أي موضوع (أي إضافة تسميات له قبل النشر)، لا بد من الالتزام بشكل حرفي بالاسم المكتوب. الهمزات، التاء المربوطة أو الهاء، كلها تُحدث فارقاً. إليك مثالاً توضيحياً:

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

أخطاء شائعة عند عمل قائمة منسدلة وكيفية تجنبها

لتكتمل خبرتك في هذا المجال، إليك أبرز الأخطاء التي قد تقع فيها، مع توفير الحلول السريعة لتجنبها:

المشكلة / الخطأ السبب والحل
القائمة لا تنسدل السبب في الغالب هو عدم استخدام العلامة (+) أو أن القالب قديم جداً ولا يدعم هذه الأكواد. الحل: التحقق من الاسم والتأكد من تحديث القالب.
ظهور القائمة المنسدلة كقائمة رئيسية حدث هذا لأنك لم تقم بترتيبها بشكل صحيح لتكون أسفل القائمة الرئيسية مباشرة. الحل: أعد ترتيبها باستخدام الأسهم من نافذة التنسيق.
الضغط على القائمة يوجه لصفحة خطأ 404 حدث هذا لأنك نسيت تغيير رمز (#) أو أدخلت رابط التسمية بشكل خاطئ أو ناقص. الحل: استبدال الرابط برابط سليم يعمل.
القوائم لا تتداخل مع بعضها بشكل جيد استخدام أكثر من علامتين (+++) في قالب لا يدعم سوى مستويين فقط. الحل: الاكتفاء بقائمة رئيسية وقائمة منسدلة واحدة للحفاظ على وضوح التصميم.

كيف تتفاعل القوائم المنسدلة على الهواتف المحمولة؟

في عالمنا اليوم، يأتي أكثر من 70% من زيارات المواقع عبر أجهزة الهواتف الذكية (الموبايل). فكيف تظهر هذه القوائم على الشاشات الصغيرة؟

عند الدخول للمدونة من جهاز الكمبيوتر، تجد الأقسام الرئيسية في واجهة المدونة بجانب بعضها، وبجانبها سهم صغير. عند المرور بالماوس (Hover)، تنسدل بانسيابية. أما في أجهزة الموبايل، فالأمر يختلف؛ حيث يتم تجميع هذه الأقسام داخل ما يعرف بـ "قائمة الهامبرغر" (Hamburger Menu) وهي عبارة عن ثلاثة خطوط أفقية (☰) تتواجد في الغالب أعلى يمين أو يسار الشاشة.

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

مقارنة- الطريقة اليدوية مقابل قوالب بلوجر الاحترافية

قد تتساءل: هل كل قوالب بلوجر تقبل استخدام القوائم المنسدلة بنفس السهولة؟ للإجابة على هذا السؤال، يجب أن نفهم الفرق بين القوالب الافتراضية القديمة والقوالب المطورة الحديثة بأكواد CSS و JavaScript المتقدمة.اقرأ حول - مقارنة شاملة| دليلك لاختيار أفضل قالب بلوجر

وجه المقارنة القوالب الافتراضية (الكلاسيكية) القوالب الاحترافية (مثل سي بلس وسكويز)
دعم القوائم المنسدلة يحتاج إلى إضافة أكواد HTML/CSS يدوياً داخل القالب. مدعوم تلقائياً، يعمل بمجرد إضافة رمز (+) قبل الاسم.
المظهر والشكل الجمالي بدائي وبسيط جداً. تأثيرات حركية ناعمة، ظل (Shadow)، وتوافق مع الألوان.
الميجا منيو (Mega Menu) غير مدعومة نهائياً. مدعومة، وتعرض أحدث المقالات بالصور داخل القائمة.
التوافق مع الهاتف قد تتداخل الروابط أو تظهر بشكل غير متناسق. تتجمع تلقائياً في قائمة منزلقة مريحة للعين.

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

تأثير القوائم المنسدلة على السيو (SEO) ومحركات البحث

يعتقد البعض أن القوائم المنسدلة هي مجرد إضافة جمالية، ولكن الحقيقة أن لها تأثيراً مباشراً على تهيئة محركات البحث (SEO). عندما تقوم بربط أقسامك عبر القوائم المنسدلة، فإنك تنشئ شبكة قوية من "الروابط الداخلية" (Internal Links) التي تساعد في ربط جميع الصفحات ببعضها.

عناكب محركات البحث (مثل Google Bot) تستخدم هذه القوائم كـ "خريطة" لمعرفة صفحاتك بسرعة. بدلاً من أن تنتظر روبوتات جوجل حتى تجد مقالاً مخفياً، يمكنها الزحف إلى القائمة المنسدلة والانتقال منها إلى قسم "التسميات"، لتقوم بفهرسة جميع مقالاتك المتعلقة بهذا القسم بشكل فوري. هذا التنظيم يرسل إشارة لجوجل بأنك تقدم تجربة مستخدم ممتازة، مما يمنحك فرصة للتقدم في نتائج البحث.

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

هل يوجد حد أقصى لعدد القوائم المنسدلة التي يمكن إضافتها؟

من الناحية التقنية، نظام بلوجر يسمح لك بإضافة عدد لا نهائي من الروابط داخل أداة القائمة الرئيسية. ولكن، للحفاظ على تجربة المستخدم، لا يُنصح بوضع أكثر من 5 إلى 7 قوائم رئيسية، يتفرع من كل منها 3 إلى 5 قوائم منسدلة كحد أقصى، حتى لا تبدو الواجهة مزدحمة وتربك الزائر.

قمت بعمل الخطوات ولكن فشلت في جعل القوائم متجاورة، ما الحل؟

يحدث هذا الخطأ بنسبة 99% بسبب تجاوزك للخطوة رقم 4 من الشرح. لكي يتعرف النظام على أن هذه القائمة هي فرع من قائمة أخرى، يجب أن تكون متواجدة أسفلها مباشرة في نافذة "تعديل القائمة". إذا كانت القائمة (+تقنية) في أول الترتيب، وكلمة (الرئيسية) أسفل منها، فلن تعمل القائمة المنسدلة. عليك باستخدام الأسهم المتاحة في أداة التعديل لضبط الترتيب.

هل يمكنني تغيير ألوان القائمة المنسدلة؟

نعم، ولكن هذا لا يتم من خيار "التنسيق" العادي. لتغيير الألوان (مثل لون الخلفية، لون الخط، تأثير المرور بالماوس)، يجب الذهاب إلى (المظهر) ثم (تخصيص) إذا كان قالبك يدعم ذلك. وإذا لم يكن مدعوماً، فستحتاج إلى الدخول إلى (تعديل HTML) والبحث عن عنصر كلاس (Class) يسمى .dropdown أو .main-menu وتغيير أكواد الألوان (Hex Codes) يدوياً.

لماذا يجب وضع رمز الشباك (#) عند إنشاء الاسم؟

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

ملخص تقني لمتطلبات إنشاء القوائم في بلوجر

لتأكيد المعلومات، إليك هذا الجدول التقني الذي يلخص المتطلبات لضمان نجاح العملية بدون أخطاء:

المنصة: بلوجر (Blogger)
مكان التعديل: لوحة التحكم > التنسيق > القائمة الرئيسية > تعديل
رمز القائمة المنسدلة: إضافة (+) قبل الاسم (مثال: +أخبار)
رمز القائمة المتداخلة: إضافة (++) قبل الاسم (مثال: ++محلية)
رمز الرابط المؤقت: شباك واحد (#)
سر الترتيب: استخدام الأسهم لضبط التسلسل
الحفظ المزدوج: بعد كل تعديل لا بد من حفظ العنصر، ثم حفظ الأداة بالكامل.


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

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

عن المؤلف

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

إرسال تعليق

الانضمام إلى المحادثة

Disqus shortname is missing. Consider reporting about this message to the admin of this blog. It seems you are the admin of this blog, add disqus shortname through Theme HTML editor to enable Disqus comments.

الانضمام إلى المحادثة