كيفية إضافة قائمة همبرغر إلى موقع الويب الخاص بك على WordPress
نشرت: 2022-09-17تعد إضافة قائمة هامبرغر إلى موقع WordPress الخاص بك طريقة رائعة لتحسين تجربة الهاتف المحمول للزائرين. هناك عدة طرق مختلفة للقيام بذلك ، لكننا سنوضح لك أسهل طريقة باستخدام مكون إضافي مجاني. أولاً ، ستحتاج إلى تثبيت وتفعيل المكون الإضافي WP Mobile Menu. لمزيد من المعلومات ، راجع دليلنا خطوة بخطوة حول كيفية تثبيت مكون WordPress الإضافي. بمجرد تنشيط المكون الإضافي ، ستحتاج إلى الانتقال إلى WP Mobile Menu »صفحة الإعدادات لتكوين المكون الإضافي. في صفحة الإعدادات ، سترى خيار تمكين قائمة الهامبرغر. يمكنك أيضًا اختيار موضع قائمة الهامبرغر وتحديد نقطة التوقف حيث يجب عرضها. إذا كنت تريد ، يمكنك أيضًا إضافة نموذج بحث وأيقونات وسائط اجتماعية ومحتويات مخصصة أخرى إلى القائمة. بمجرد الانتهاء ، انقر فوق الزر حفظ التغييرات لتخزين الإعدادات الخاصة بك. هذا كل شيء ، لقد نجحت في إضافة قائمة هامبرغر إلى موقع WordPress الخاص بك.
هذه طريقة من ست خطوات يمكن استخدامها. ما هي قائمة همبرغر؟ ليس الاسم هو الذي يجعلك تشعر بالجوع. إنها طريقة نطقك لها. يتكون زر قائمة الهامبرغر من ثلاثة خطوط أفقية ، وأكثرها شيوعًا هي همبرغر. يظهر عنصر التنقل في العديد من مواقع الويب والتطبيقات والبرامج ويمكن العثور عليه بسهولة. تعد قائمة الهامبرغر عنصرًا وظيفيًا يسهل استخدامه على الهواتف الذكية على أساس يومي ، أو عندما تقضي الكثير من الوقت على الإنترنت. إنه يوفر طريقة ملائمة للمستخدمين للتنقل بين الصفحات والفئات دون الشعور بالارتباك.
باستخدام المكون الإضافي Respive Menu ، يمكنك إنشاء قائمة Hamburger جميلة وسريعة الاستجابة مع جميع الميزات التي تحتاجها. بعد تحديد السمة ، اكتب اسم قائمتك ، بالإضافة إلى عدة حقول أخرى. يمكن استخدام تخصيص الحاوية وزر التبديل أثناء التنقل في نمط قائمة قائمة الجوال ، والمعروف أيضًا باسم تصميم قائمة همبرغر سريع الاستجابة. باستخدام Superfly Menu ، يمكنك إنشاء زر تنقل مستقل أو زر يكمل شريط القوائم. إنه مكون إضافي رائع آخر لبرنامج WordPress يعمل على تحسين التصفح على الشاشات الصغيرة بجعله أكثر طبيعية ويسهل التصفح. باستخدام هذا المكون الإضافي ، يمكنك تغيير لون كل عنصر على حدة وإضافة صورة رأس وتغيير صورة الخلفية. أكثر من ذلك ، لدينا أيضًا AirMenu في قائمتنا ، مما يسمح لك بإنشاء تصميم سريع الاستجابة لموقع الويب الخاص بك. المكان الأكثر شيوعًا للعثور على زر الهامبرغر هو أعلى واجهة المستخدم.
عند الضغط عليه ، سيكشف الزر عن قائمة همبرغر مخفية سابقًا (تُعرف أيضًا باسم قائمة الهامبرغر). يمكن أن تظهر هذه القائمة على شكل قائمة مشروطة أو قائمة منسدلة أو قائمة منزلقة أو قائمة كل شيء أو لا شيء. في حالة عناصر مثل سجلات الرحلة والإيصالات وإعدادات الدفع ، يجب النقر فوق قائمة الهامبرغر لأنها أقل أهمية.
هذه الأزرار ، بالإضافة إلى كونها مفيدة لمهام معينة ، لا تحتاج إلى شغل جزء كبير من الشاشة الرئيسية. انتقل إلى صفحة "المظهر" وانتقل إلى قائمة "القوائم" في القائمة الموجودة على الجانب الأيسر.
كيف يمكنني تعديل قائمة همبرغر في ووردبريس؟

المظهر> القوائم يمكن استخدامها لتغيير ما يظهر في القائمة. يمكنك تغيير CSS الخاصة بالقائمة باستخدام السمة الفرعية أو أداة التخصيص أو المكون الإضافي لإضافة CSS. تعمل قائمة الهامبرغر ، التي تظهر عند النقر فوق موقع ويب أو تطبيق أو النقر فوقه ، كرمز لدرج التنقل أو القائمة الجانبية.
بمجرد تحديد القائمة ، انقر فوق زر القائمة "تعديل" لتغييرها. قائمة التنقل هي ميزة سمة WordPress تتيح للمستخدمين إنشاء قوائمهم الخاصة باستخدام محرر القائمة المدمج في منطقة إدارة WordPress. حدد الإعدادات من قائمة WordPress. قم بسحب وإسقاط الخدمات المرتبطة بموقعك على الويب في مربع "الخدمات الممكّنة" ضمن "أزرار المشاركة". المجلد / wp-content / uploads / هو المكان الذي يتم فيه تخزين جميع الوسائط وتحميل الصور بشكل افتراضي. في معظم الحالات ، لن يقوم WordPress بتحميل الصور بسبب إعداد أذونات الملف غير الصحيحة. القائمة المنسدلة للهامبرغر هي مفهوم مختلف تمامًا عن الهامبرغر القياسي في WordPress.
ما هي قائمة همبرغر في ووردبريس؟
قائمة الهامبرغر هي عنصر تحكم رسومي يمكن استخدامه كأيقونة قائمة تنقل في موقع Wordpress. يتكون عادةً من ثلاثة خطوط أفقية متوازية تمثل شريطين من أشرطة القوائم وشريط ثالث يمثل عنصر قائمة محددًا. عند النقر فوقها ، تتسع أيقونة القائمة لتكشف عن عنصر القائمة المحدد وعناصر القائمة الفرعية الخاصة به.
نظرًا لأنها تشبه الساندويتش الشهير ، يشار إلى هذه الوجبة باسم قائمة الهامبرغر. يمكن استخدامه كأداة UI / UX أو كأداة يحبها بعض المصممين. تحتوي العديد من تطبيقات الجوال ومواقع الويب على قائمة هامبرغر كنمط تنقل خاص بها. يوصى بوضع أيقونات الهامبرغر في الزاوية اليسرى العلوية من الصفحة. نظرًا لأن شاشات الهاتف المحمول بها مساحات صغيرة نسبيًا ، فمن الأهمية بمكان استخدام هذا النمط لزيادة كمية المحتوى المتاح. يمكن العثور على قائمة الهامبرغر في الزاوية اليمنى العليا من صفحة Evernote الرئيسية. هذه واحدة من أكثر مجموعات الأدوات مفتوحة المصدر شيوعًا لتطوير مواقع الويب.
انظر إلى المسافة البيضاء بين اسم كل كتلة محتوى ورمزها لمعرفة مقدارها. سيتمكن المستخدمون لديك من معرفة مقدار الوقت الذي تستغرقه المهمة حتى تنتهي إذا كان بإمكانك قياس الوقت. توجد قائمة أو رمز هامبرغر يمكن استخدامه للوصول إلى خيارات البرنامج على جهاز محمول.
بالانتقال إلى صفحة الخيارات ، يمكنك تصفح خيارات hotdog و hamburger ، بالإضافة إلى القائمة الرئيسية. من خلال قائمة النقر بزر الماوس الأيمن ، يمكنك النقر بزر الماوس الأيمن بسرعة وسهولة على العناصر الموجودة في الصفحة ، مما يسمح لخيارات البرنامج بالظهور على شكل همبرغر أو نقانق. يمكنك تنظيم قوائم موقع الويب الخاص بك عن طريق وضع قائمة الهامبرغر عليها.
قوائم همبرغر: طريقة سهلة لتحسين مظهر موقع الويب الخاص بك
يمكن تخصيص القائمة وجعلها أنيقة مع مجموعة متنوعة من الألوان والخطوط. بالإضافة إلى تخصيص الرموز النقطية و CSS ، يمكنك جعل قوائمك تبدو فريدة من نوعها. إذا كنت ترغب في تحسين مظهر قوائم موقع الويب الخاص بك ، فقد يكون WP Hamburger خيارًا ممتازًا لك. يمكنك استخدامه لإنشاء مظهر جديد لقوائمك باستخدام هذا المكون الإضافي. صمم Norm Cox رمز الهامبرغر لجهاز Xerox Star ، وهو أول كمبيوتر تجاري.
كيف يمكنني تفعيل قائمة الهمبرغر؟
لتنشيط قائمة الهامبرغر ، ما عليك سوى النقر فوق رمز الهامبرغر في الزاوية اليسرى العلوية من الشاشة. سيؤدي هذا إلى فتح القائمة بحيث يمكنك الوصول إلى جميع الميزات والخيارات المتاحة.
تم تصميم رمز الهامبرغر في الأصل ليكون بمثابة قائمة بها خيارات. يمكن استخدامه الآن لإخراج القوائم من جانب الشاشة. بنقرة واحدة أو بالمرور فوق الرمز أو النقر فوقه ، يمكنك توسيع القائمة المختصرة للإعدادات والطاقة والإعدادات الأخرى. تم تصميم رمز الهامبرغر (مع قيود صارمة) ليكون سهل الاستخدام للغاية. على الرغم من أنها تفتقر إلى الصفات الوصفية ، فمن السهل التغاضي عنها إذا لم تكن على دراية بها. تتكون قائمة الهامبرغر عادةً من ثلاثة خطوط أفقية تعمل عموديًا. إذا كنت تستبدل القائمة الرئيسية لموقع ويب بقائمة هامبرغر ، فيجب أن تضع في اعتبارك أن هذا الرمز ليس هو الرمز الوحيد الذي يجب استخدامه.
عند استبدال القائمة الرئيسية لموقع ويب بقائمة همبرغر ، يجب أن تضع في اعتبارك أن هذا الرمز هو واحد فقط من العديد من الاستخدامات الممكنة. تظهر بجوار القائمة الرئيسية في بعض مواقع الويب لتوفير خيارات أو معلومات إضافية لا يمكن الوصول إليها بسهولة من الصفحة الرئيسية. من المهم أن تضع في اعتبارك أن استخدام رمز قائمة الهامبرغر على مواقع سطح المكتب يمكن أن يكون خطيرًا. يعتبر تدخليًا ومزعجًا إذا تم استخدامه بشكل غير صحيح. ومع ذلك ، إذا تم إجراؤه بشكل صحيح ، فيمكن أن يساعد في تقليل الانحرافات مع تزويد المستخدمين أيضًا بمزيد من الخيارات.

ما هي قائمة همبرغر في أندرويد؟
يتم استخدامه للحفاظ على القائمة (المعروفة أيضًا باسم قائمة الهامبرغر) أو شريط التنقل من الانهيار خلف زر أو عرضه على الشاشة أثناء الضغط عليه. تُعرف أيضًا الأيقونة المرتبطة بعنصر واجهة المستخدم هذه ، والتي تتكون من ثلاثة أشرطة أفقية ، باسم أيقونة القائمة المطوية.
ما هي قائمة همبرغر على الهاتف؟
لا يُقصد من زر الهامبرغر أن يشبه برجر ؛ إنه مجرد رمز. على الرغم من استخدامه بشكل شائع في التطبيقات ، إلا أنه ليس مصطلحًا يستخدم لوصف أزرار القائمة. نستخدم هذا الرمز بشكل يومي. يظهر زر الهامبرغر عندما تتنقل في قائمة أو تنتقل إلى شريط تنقل في أحد التطبيقات بثلاثة خطوط مكدسة.
كيف أحصل على قائمة همبرغر على سطح المكتب Elementor؟
لا توجد قائمة همبرغر على عنصر سطح المكتب بشكل افتراضي. ستحتاج إلى إنشاء قائمة مخصصة وإضافة رمز الهامبرغر يدويًا.
احصل على قائمة همبرغر لسطح المكتب الخاص بك
يمكن لمستخدمي سطح المكتب الوصول إلى قائمة الهامبرغر باستخدام أداة قائمة التنقل عند تحميل المحتوى الخاص بهم. يمكن العثور على القائمة المنسدلة في قائمة المحتوى> التخطيط في أداة قائمة التنقل المنسدلة. يجب بعد ذلك تعيين نقطة توقف الاستجابة على قيمة عالية جدًا ، مثل 99999 بكسل. ستتمكن من رؤية قائمة الجوال على جميع الشاشات نتيجة لذلك. اضبط التأثير (الجوال) على "Off Canvas - Slide from Right" في المظهر لتكوين قائمة الهامبرغر.
كيفية تحرير قائمة همبرغر وورد
لتحرير قائمة الهامبرغر في WordPress ، ستحتاج إلى الوصول إلى لوحة إدارة WordPress. بمجرد تسجيل الدخول ، انتقل إلى صفحة المظهر> القوائم . من هنا ، يمكنك تعديل القائمة الحالية أو إنشاء قائمة جديدة. لتعديل قائمة الهامبرغر ، ما عليك سوى النقر فوق رمز الهامبرغر ثم إجراء التغييرات. تأكد من النقر فوق الزر "حفظ القائمة" عند الانتهاء.
هذه قائمة تنقل متنقلة بها أيقونة همبرغر على اليسار وثلاثة أشرطة أفقية على اليمين. يمكنك تحرير موقع الويب الخاص بك من الفوضى باستخدامه. سنستخدم المكون الإضافي Respive Menu WordPress من أجل إنشاء قائمة Hamburger الخاصة بنا. في حين أن سمة قائمة الاستجابة الافتراضية وظيفية تمامًا ، يمكننا تخصيصها وتصميمها حسب الحاجة لجعلها فريدة حقًا. يجب تكوين قائمة جديدة في إعدادات القائمة أولاً. يمكنك الاختيار من بين مجموعة متنوعة من أنماط الخطوط عن طريق تحديد حشوة نص العنوان ، ولون الخلفية ، ولون تمرير الخلفية ، وحجم الخط ، ومحاذاة النص ، ووزن الخط ، وعائلة الخط ، وعرض الصورة ، وارتفاع الصورة. يمكن تخصيص شريط البحث فقط باستخدام المساحة المتروكة والارتفاع ونصف قطر الحدود ولون النص ولون الخلفية ولون العنصر النائب ولون الحدود للمستخدمين المجانيين.
تعد أزرار التبديل متعددة الاستخدامات للغاية وتأتي مع مجموعة متنوعة من خيارات التكوين مثل نمط الزر وموضع الزر ونوع الزر ونص الزر وسلوك الزر. عند النقر فوق الزر "تبديل" ، يتم تنشيط قائمة الاستجابة ، ويتم عرض الحاوية. باستخدام المكون الإضافي Respive Menu ، يمكنك إنشاء قائمة مذهلة سيستمتع بها جميع المستخدمين. يشتمل الإصدار المجاني على 20 من الرسوم المتحركة للأزرار ، وتنفيذ قائمة سطح المكتب والقائمة الضخمة ، و 600 رمز خط من FontAwesome و GlyphIcon ، وقوائم التحكم مع لوحات المفاتيح والاختصارات التي تعمل باللمس. يضيف الإصدار المحترف عددًا من الميزات الجديدة التي لم تكن متوفرة في الإصدار المجاني.
كيف يمكنني تحرير قائمة منسدلة في WordPress؟
عندما تختار قائمة لتعديلها ، ستظهر قائمة منسدلة أعلى الصفحة ، مما يسمح لك بتحديد قائمة من بين الخيارات الأخرى. يمكنك تعديل القائمة المنسدلة عن طريق تحديد القائمة التي تريد تعديلها من القائمة "تحديد" والنقر فوق الزر "تحديد".
ووردبرس] همبرغر القائمة Css
قائمة الهامبرغر هي عنصر تحكم رسومي يمكن استخدامه كأيقونة قائمة تنقل في صفحة ويب أو تطبيق ويب. يأتي الاسم من تشابهه مع الهامبرغر ، وقد شاع استخدامه لأول مرة من قبل نورمان نورمان ، الذي استخدمه في تطبيق متصفح الويب Surfin 'Safari. تتكون قائمة الهامبرغر من ثلاثة أشرطة أفقية تمثل رمز القائمة. عندما لا يتم استخدام القائمة ، يتم تكديس الأشرطة الثلاثة فوق بعضها البعض. عند تنشيط القائمة ، يتم تدوير الأشرطة لتشكيل علامة X ، وتظهر القائمة.
تعمل قائمة Hamburger ، التي يمكن عرضها على جهاز محمول أو على شاشة أصغر ، بمثابة رابط تنقل في موقع ويب. عندما يكون لديك عدد كبير جدًا من الأزرار والروابط على شريط التنقل الرئيسي ، يتم استخدامها أيضًا. تسمح لك قائمة الهامبرغر سريعة الاستجابة بتقليل حجم قائمتك أثناء إنشاء تصميم قائمة مضغوطة أيضًا. يوضح CodePen كيف يمكن أن تكون قائمة همبرغر CSS مفيدة بطريقة أكثر اكتمالاً ، بالإضافة إلى مثال أكثر عمومية عن كيفية استخدام قائمة هامبرغر CSS. عندما يكون رمز القائمة مفتوحًا ، فإنه يتحول إلى تقاطع ويتم تحريكه. عندما يكون لدينا عدد كبير من العناصر أو القوائم الفرعية أو معلومات إضافية في قائمتنا ، يمكننا استخدام قائمة ملء الشاشة. قائمة هامبرغر CSS ممتعة تتحول إلى قائمة ملء الشاشة أثناء تحركها للخارج من الزاوية اليمنى العليا للشاشة.
يستخدم JavaScript ، على الرغم من أنه محدود للغاية: فقط لتغيير حالة القائمة والفتح والإغلاق ؛ يتم تبديل فئات CSS. هذا هو JavaScript خالص بدون مكتبات أو تبعيات. تعد قوائم همبرغر CSS طريقة رائعة لتقليل مقدار مساحة الشاشة على الأجهزة المحمولة عند تصميم تخطيط موقع الويب الخاص بك. بالإضافة إلى ذلك ، يمكن استخدامها كقوائم تفاعلية مع أيقونات قائمة عائمة ومساحة أكبر لقائمة خارج اللوحة. يمكن أن تساعدك قوائم JavaScript في تحديد المجموعة الأفضل لقائمة الهامبرغر الخاصة بك.
ما هو الهامبرغر في المغلق؟
ما هي قائمة همبرغر؟ على جهاز محمول أو على شاشة أصغر ، تعرض قائمة Hamburger روابط التنقل. من ناحية أخرى ، يمكن استخدام قوائم همبرغر CSS على مواقع سطح المكتب أيضًا. عند النقر فوق رمز الهامبرغر ، ستظهر قائمة منزلقة أعلى المحتوى الرئيسي.
كيف أقوم بإعداد قائمة همبرغر سريعة الاستجابة؟
إنشاء قائمة همبرغر سريعة الاستجابة باستخدام CSS. علاوة على ذلك ، عندما يكون حجم الشاشة 750 × 400 ، يجب علينا إخفاء قائمة الهامبرغر سريعة الاستجابة (CSS). نقوم ببساطة بإلغاء تحديد المربع الذي يشير إلى "الحظر" ؛ نقوم أيضًا بإلغاء تحديد المربع الذي يقول لا شيء في قائمة الهامبرغر. بشكل افتراضي ، سيكون مخفيًا.
أيقونة همبرغر: أداة ملاحة مفيدة
عند النقر فوق رمز الهامبرغر ، يتم عرض كل من الصفحة الرئيسية والصفحات الأخيرة والصفحات التي زرتها خلال الـ 24 ساعة الماضية. نتيجة لذلك ، لن تضطر إلى إعادة زيارة صفحة معينة عندما تحتاج إلى ذلك.
ستتمكن من التنقل عبر الإنترنت بسهولة أكبر باستخدام رمز Hamburger لأنه يتم استخدامه بشكل متكرر عند التصفح.