أداة قائمة Elementor Nav: لا حاجة إلى Elementor Pro
قائمة التنقل هي أداة Master Addons تضع أي قائمة WordPress في رأس Elementor أو تذييل أو صفحة وتتيح لك تصميمها من اللوحة. اختر تخطيطًا أفقيًا أو رأسيًا لكل جهاز، وقم بتصميم العناصر الرئيسية والنماذج المنسدلة والقوائم الفرعية في حالاتها العادية والحولية والنشطة، وقم بإقرانها بامتداد Mega Menu للوحات متعددة الأعمدة. على الهواتف ينهار إلى تبديل همبرغر افتراضيًا. يضيف Master Addons Pro تخطيط همبرغر لأي عرض، مع القوائم المنبثقة والقوائم غير القماشية.
تخطيطات أفقية وعمودية وهمبرغر
اضبط التخطيط بشكل منفصل لسطح المكتب والكمبيوتر اللوحي والهاتف. أفقي يناسب الشريط العلوي. يأتي Vertical في أربعة أنواع: عادي مع منسدلات جانبية، وتبديل، وأكورديون، وجانب، مما يثبت القائمة على حافة الصفحة. تستخدم الهواتف تبديل الهامبرغر افتراضيًا. باستخدام Pro، يمكنك اختيار الهامبرغر لأي عرض وفتح القائمة كإسقاط افتراضي أو نافذة منبثقة أو لوحة Offcanvas.
- يتم تعيين التخطيطات لكل جهاز، بما في ذلك نقاط التوقف الإضافية لـ Elementor.
- القوائم العمودية كالمعتاد أو التبديل أو الأكورديون أو الجانب.
- قوائم الهامبرغر المنبثقة وغير القماشية مع Master Addons Pro.
- يعمل مع القائمة الضخمة تمديد للألواح متعددة الأعمدة.
تخطيطات القائمة العمودية: عادي، تبديل، الأكورديون والجانب
اختر Vertical in Layout ويظهر عنصر تحكم ثانٍ، Type. يفتح كل نوع قوائم فرعية بطريقة مختلفة، ويمكن ضبط كل من التخطيط والنوع لكل جهاز، بحيث يمكن أن تظل القائمة عادية على سطح المكتب وتتحول إلى الأكورديون على الهواتف.
- عادي يفتح قائمة فرعية على جانب القائمة عندما يقوم القارئ بتمرير العنصر الأصلي الخاص به.
- تبديل يقوم بتوسيع القائمة الفرعية الموجودة أسفل القائمة الأصلية عند النقر، ويمكن أن يظل العديد منها مفتوحًا في وقت واحد.
- الأكورديون يتم توسيعه أيضًا عند النقر، ولكن فتح قائمة فرعية واحدة يؤدي إلى إغلاق القائمة التي كانت مفتوحة.
- جانب يثبت القائمة على حافة الصفحة. توجد العناصر الرئيسية فقط في الشريط، وتفتح قوائمها الفرعية في لوحة بجانبه.
عادي: تفتح القائمة الفرعية على الجانب عند التمرير.
التبديل: تتوسع القائمة الفرعية ضمن العنصر الخاص بها.
الأكورديون: قائمة فرعية واحدة مفتوحة في كل مرة.
الجانب: العناصر الرئيسية في شريط على حافة الصفحة، مع وجود القائمة الفرعية في لوحة بجانبها.
قم بتصميم كل مستوى قائمة وحالة
تحتوي علامة التبويب "النمط" على أقسام منفصلة لعنصر القائمة الرئيسية، وقائمة Dropdown، وعنصر قائمة Dropdown، والقائمة الفرعية Dropdown، وعنصر القائمة الفرعية Dropdown. يحصل كل منها على ألوان وخلفيات للحالات العادية والتحريك والنشطة، بالإضافة إلى الحشو والحدود والفواصل، لذلك يمكن أن يبدو الرابط إلى الصفحة الحالية مختلفًا عن الباقي.
- الحالات العادية والتحويمية والنشطة للعناصر الرئيسية والعناصر المنسدلة.
- تصميم منفصل للوحة المنسدلة وعناصرها وقوائمها الفرعية الأعمق.
- فواصل بين العناصر، حسب النوع والحجم واللون.
تبديل الهامبرغر وأيقونات المؤشر
قم بتصميم تبديل الهامبرغر كرمز أو نص أو كليهما، مع عرض افتراضي أو مكدس أو مؤطر وشكل مربع أو دائري. يمكنه إظهار رمز واحد أثناء إغلاق القائمة وآخر أثناء فتحها. تحدد أيقونات المؤشر العناصر التي تحتوي على قوائم منسدلة وقوائم فرعية: اختر الرموز الخاصة بك، وأظهرها أو أخفيها، واضبط حجمها ولونها وموضعها وتدويرها.
- همبرغر التبديل كرمز أو نص أو كليهما.
- أيقونات مختلفة للقائمة المغلقة والمفتوحة.
- أيقونات مؤشر القائمة المنسدلة والقائمة الفرعية المخصصة مع التدوير.
التباعد المنسدل والتخطيطات لكل جهاز
اضبط العرض المنسدل وفجوته من أعلى القائمة، والفجوات بين العناصر والحشوة داخل كل رابط. تتحكم مدة الانتقال في مدى سرعة تغير ألوان التمرير والنزلات. نظرًا لأنه تم تعيين التخطيط لكل جهاز، فإنك تقرر أين تتحول القائمة من شريط أفقي إلى قائمة رأسية، أو إلى الهامبرغر باستخدام Pro.
- عرض منسدلة وفجوة من الأعلى.
- فجوات بين العناصر وحشوة الارتباط لسهولة النقر عليها.
- مدة الانتقال لتغييرات التحليق والإسقاط.
عناصر واجهة مستخدم قائمة Elementor Pro مقابل قائمة التنقل الخاصة بـ Master Addons
لا يحتوي المكون الإضافي المجاني لـ Elementor على عنصر واجهة مستخدم لوضع قائمة WordPress وتصميمها. تأتي عناصر واجهة المستخدم الخاصة بقائمة WordPress مع Elementor Pro. وإليك كيفية المقارنة.
| إليمنتور برو | قائمة التنقل للإضافات الرئيسية | |
|---|---|---|
| سعر | ترخيص إليمينتور برو | متضمنة في الإضافات الرئيسية؛ أنواع الهامبرغر المنبثقة وغير القماشية مع Pro |
| التخطيطات | أفقي، عمودي، منسدل | أفقي، عمودي (4 أنواع)، همبرغر |
| قائمة الجوال | قم بالتبديل أسفل نقطة التوقف التي تختارها | الهامبرغر على الهواتف بشكل افتراضي؛ المنبثقة وOffcanvas مع Pro |
| التخطيط لكل جهاز | إعداد نقطة توقف واحدة | تعيين لكل جهاز |
| تحريك مؤشر الرسوم المتحركة | نعم | لا |
| القائمة الضخمة | عنصر واجهة المستخدم في القائمة مع المحتوى المنسدل | ملحق القائمة الضخمة |
إذا كنت تدفع بالفعل مقابل Elementor Pro، فإن عناصر واجهة المستخدم الخاصة بالقائمة الخاصة به تقوم بالمهمة. بدونها، قائمة التنقل و القائمة الضخمة يمنحك الامتداد قائمة رأس مصممة بدون Elementor Pro.
لمحة سريعة عن قائمة التنقل
ما تفعله الأداة، اقرأ من Master Addons 3.2.3.
| عنصر | أداة قائمة التنقل |
|---|---|
| مصدر القائمة | أي قائمة من المظهر، القوائم، مختارة في القائمة المحددة |
| التخطيطات | أفقي وعمودي على كل جهاز؛ همبرغر على الهواتف بشكل افتراضي |
| الأنواع العمودية | عادي، تبديل، الأكورديون والجانب |
| همبرغر على سطح المكتب والكمبيوتر اللوحي | ماستر أدونز برو |
| أنواع الهامبرغر | الافتراضي على الهواتف؛ المنبثقة وOffcanvas مع Pro |
| القوائم الفرعية | أقسام نمط منفصلة للنقطة المنسدلة وعناصرها والقوائم الفرعية الأعمق وعناصرها |
| تنص على | عادي، يحوم ونشط للعناصر الرئيسية والعناصر المنسدلة |
| أيقونات المؤشر | أيقونات القائمة المنسدلة والقائمة الفرعية التي تختارها، بالحجم واللون والموضع والتدوير |
| تحريك مؤشر الرسوم المتحركة | لا (أداة قائمة Elementor Pro تحتوي عليها) |
| لزجة | لا يوجد إعداد في القطعة؛ اجعل حاوية الرأس لزجة |
| لوحات القائمة الضخمة | ملحق القائمة الضخمة |
| الاحتياجات | Elementor وMaster Addons، لا يوجد Elementor Pro |
أمثلة على قائمة التنقل
خمسة عروض توضيحية حية تم إنشاؤها باستخدام الأداة. افتح واحدًا، ثم قم باستيراد التخطيط من عارض القالب أدناه.
- نافبار الفحم وقائمة ضخمة: شريط رأس داكن مع لوحة قائمة ضخمة متعددة الأعمدة.
- قائمة التنقل مع الشريط العلوي: شريط اتصال فوق القائمة الرئيسية.
- اختلافات القائمة المنسدلة: عدة أنماط منسدلة في نفس القائمة.
- قائمة التنقل العمودي: القائمة كقائمة عمودية.
- القائمة الجانبية العمودية: النوع الجانبي مثبت على حافة الصفحة.
كيفية إضافة قائمة التنقل في Elementor
تستخدم الأداة القوائم التي تقوم بإنشائها في WordPress، لذا ابدأ من هناك.
- قم بإنشاء القائمة الخاصة بك ضمن المظهر > القوائم.
- في Elementor، اسحب عنصر واجهة مستخدم قائمة التنقل الخاصة بـ Master Addons إلى رأسك أو تذييلك أو صفحتك.
- اختر القائمة في حدد القائمة واختر تخطيطًا لسطح المكتب.
- قم بالتبديل إلى عرض الجهاز اللوحي والهاتف للتحقق من التخطيط على كل جهاز. تحصل الهواتف على تبديل الهامبرغر بشكل افتراضي.
- قم بتصميم عناصر القائمة والنماذج المنسدلة وقم بالتبديل في علامة التبويب "النمط"، ثم قم بالنشر.
للحصول على إرشادات كاملة للرأس، اقرأ كيفية إنشاء قائمة التنقل في Elementor بدون Pro. للحصول على رأس على مستوى الموقع، استخدم المجاني منشئ الموضوع.
أزواج جيدة مع: القائمة الضخمة للوحات متعددة الأعمدة، محتوى خارج القماش (Pro) للوحة المنزلقة للخارج، منشئ الموضوع للحصول على رأس على مستوى الموقع، شروط العرض (Pro) لعرض قائمة مختلفة للزوار الذين قاموا بتسجيل الدخول، و علامات التبويب للتنقل داخل الصفحة.
الأسئلة المتداولة لقائمة التنقل
كيف يختلف هذا عن عناصر واجهة مستخدم قائمة Nav الأخرى؟
تحتاج عناصر واجهة المستخدم الخاصة بالقائمة الخاصة بـ Elementor إلى Elementor Pro. تعمل قائمة التنقل الرئيسية للإضافات بدون Elementor Pro وتضيف تخطيطات لكل جهاز وأربعة أنواع من القوائم الرأسية وتصميم منفصل لكل مستوى وحالة قائمة وأيقونات مؤشر مخصصة ومفتاح همبرغر قابل للتصميم. كما أنه يعمل مع ملحق القائمة الضخمة.
هل يمكنني استخدام هذه القائمة مع ملحق Mega Menu؟
نعم. قم بتشغيل ملحق Mega Menu، وقم بإنشاء محتوى اللوحة لعنصر القائمة من شاشة قوائم WordPress، ثم حدد تلك القائمة في عنصر واجهة مستخدم Nav Menu. تعرض الأداة لوحات القائمة الضخمة في الواجهة الأمامية.
هل من الصعب إعداد الأنماط المختلفة للعادية والتحويم والنشطة؟
لا. افتح علامة التبويب "النمط"، واختر جزءًا من القائمة مثل عنصر القائمة الرئيسي، وقم بالتبديل بين علامات التبويب "عادي" و"تحريك" و"نشط" لتعيين الألوان لكل حالة.
كيف يمكنني تحرير القائمة التي تظهر في الأداة؟
تعرض الأداة قائمة WordPress، لذا يمكنك تحريرها ضمن المظهر والقوائم. إضافة العناصر أو إعادة تسميتها أو إعادة ترتيبها هناك وحفظها. يحتوي عنصر التحكم في تحديد القائمة في الأداة على رابط مباشر لتلك الشاشة، وتظهر التغييرات في Elementor بعد التحديث.
كيف يمكنني إضافة قائمة فرعية؟
في المظهر، القوائم، اسحب العنصر قليلاً إلى اليمين أسفل العنصر الذي ينتمي إليه، حتى يضع WordPress علامة عليه كعنصر فرعي، ثم احفظه. تعرض الأداة ذلك على أنه منسدلة. قم بتصميمه في النمط وقائمة Dropdown وعنصر القائمة Dropdown.
هل أحصل على قائمة همبرغر على الهاتف المحمول بدون Pro؟
نعم. على الهواتف، تتحول الأداة إلى الهامبرغر بشكل افتراضي، وتفتح القائمة في مكانها أسفل المفتاح. يحتاج استخدام الهامبرغر على سطح المكتب أو الجهاز اللوحي، أو فتحه كلوحة منبثقة أو Offcanvas، إلى Master Addons Pro.
ما هي أفضل حالة استخدام لنوع القائمة "Offcanvas" أو "Popup"؟
كلاهما من أنواع الهامبرغر الاحترافية. يقوم Offcanvas بتمرير القائمة من اليسار أو اليمين، مما يناسب الهواتف والحد الأدنى من التصميمات. يفتح Popup القائمة فوق الصفحة، والتي تعمل بشكل جيد للتنقل في الموقع بالكامل على مواقع المحفظة أو الوكالات. بدون Pro، يفتح الهامبرغر الموجود على الهواتف القائمة الموجودة أسفل التبديل.
هل ستعمل هذه القائمة مع رأس سمة WordPress الموجودة لدي؟
نعم، يمكنك وضع عنصر واجهة المستخدم في أي مكان يعمل فيه Elementor. لاستبدال رأس السمة بالكامل، قم بإنشاء قالب رأس بالمجاني منشئ موضوع الإضافات الرئيسية وأضف عنصر واجهة مستخدم قائمة التنقل إليه.
هل يمكنني الحصول على نمط قائمة مختلف على الهاتف المحمول مقابل سطح المكتب؟
نعم. يمكن ضبط التخطيط والمحاذاة والعديد من إعدادات النمط لكل جهاز. على سبيل المثال، احتفظ بشريط أفقي على سطح المكتب، واستخدم الأكورديون الرأسي على الأجهزة اللوحية، وقم بتبديل الهامبرغر على الهواتف.
هل يمكنني جعل القائمة لزجة؟
لا تحتوي الأداة على إعداد لزج، لذا اجعل حاوية الرأس لزجة بدلاً من ذلك. باستخدام Elementor Pro، استخدم Advanced وMotion Effects وSticky: أعلى تلك الحاوية. بدون برو، أضف selector { position: sticky; top: 0; z-index: 99; } إلى الحاوية الموجودة في قسم CSS المخصص للإضافات الرئيسية. لدينا دليل رأس لزجة يغطي الإعداد الكامل.
لماذا لا تظهر قائمتي؟
تحقق من أربعة أشياء. تحتاج الأداة إلى قائمة مختارة في القائمة المحددة، ويحتاج الموقع إلى قائمة واحدة على الأقل ضمن المظهر، القوائم. يظهر قالب الرأس فقط مكان تطبيق حالة العرض الخاصة به. على الهواتف، يتم طي القائمة في الهامبرغر، لذا تأكد من أن لون التبديل يبرز من خلفية الرأس. أخيرًا، قم بمسح ذاكرة التخزين المؤقت وأي إعداد تأخير لـ JavaScript بعد التغييرات.
عناصر واجهة المستخدم والملحقات الشائعة
إنشاء مواقع متطورة في وقت أقل.
التشكل الزجاجي
إضافات الحاويات
أنماط
![ملحق Master Addons Post/Page Duplicator لـ Elementor: رابط صف MA Duplicator في قائمة صفحات WordPress لإنشاء صفحة مقصودة - مسودة [مكررة #128]](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
ناسخ البريد/الصفحة
