نصائح لإخفاء قائمة الجوال في ووردبريس
نشرت: 2021-04-29في معظم الحالات ، تحتوي سمات WordPress بالفعل على أنماط محددة تسمح لها بتحويل قائمة التنقل العادية إلى قائمة متنقلة. إنه ملائم إذا كنت بحاجة إلى حل سريع خارج الصندوق. على سبيل المثال ، لديك تخطيط تقليدي لأجهزة كمبيوتر سطح المكتب وقائمة هامبرغر على الأجهزة المحمولة. ومع ذلك ، إذا كنت ترغب في إجراء مزيد من التخصيص أو حتى استبدال قائمة الهاتف المحمول الموجودة لديك بالكامل ، فهذا ممكن أيضًا. هناك عدة طرق لإخفاء قائمة الهاتف المحمول في WordPress ، إما باستخدام المكونات الإضافية أو التعليمات البرمجية .
كيفية إخفاء قائمة المحمول في WordPress
يتطلب التخصيص الكامل لموقع الويب القليل من المعرفة والخبرة. إذا كنت تريد تخصيصًا آمنًا دون مخاطر ، فيمكنك الاستعانة بالمحترفين لتخصيص موقع الويب الخاص بك وصيانته. في حين أن هناك بعض الأجزاء السهلة التي يمكنك القيام بها بنفسك ، فإن التخصيص الأكثر جدية يتطلب لمسة احترافية. عندما يتعلق الأمر بقائمة الجوال في WordPress ، يمكنك استخدام المكونات الإضافية لتبسيط العملية . أو ، إذا كانت لديك معرفة بالشفرة ، يمكنك إنشاء تغييرات مباشرة داخل الكود.
لمساعدتك في تغيير طريقة ظهور قائمة الجوال على موقع الويب الخاص بك ، إليك الطريقتان الأكثر شيوعًا لإكمالها:
- إخفاء قائمة الأجهزة المحمولة في WordPress باستخدام مكون إضافي
- إخفاء قائمة الجوال برمز CSS
كيفية إخفاء قائمة الهاتف المحمول في WordPress باستخدام مكون إضافي
ربما تكون قد عثرت على سمة WordPress ذات سلوك مثير للاهتمام لقائمة الأجهزة المحمولة ، وتريد تكراره بسهولة. لا تتطلب هذه الطريقة معرفة بالترميز ، لذا فهي أكثر ملاءمة لهذه المهمة. بعد تثبيت مكون إضافي ، ستتمكن من إزالة قائمة هاتفك المحمول تمامًا على الأجهزة المحمولة . أيضًا ، ستسمح لك بعض المكونات الإضافية بتخصيصها بعمق. إلى جانب الاختباء الأساسي ، يمكنك أيضًا استخدامه لإزالة عناصر محددة فقط في قائمتك.
إنشاء قائمة موبايل جديدة
الخطوة الأولى هي الانتقال إلى المظهر> القوائم . هناك ستتمكن من إنشاء قائمة جديدة من خلال النقر على خيار "إنشاء قائمة جديدة" في الأعلى. أدخل اسمًا لقائمتك الجديدة وأكد ذلك باستخدام زر "إنشاء قائمة" في الزاوية اليمنى السفلية من الشاشة.

بعد هذه الخطوات ، لن يكون التحديد على الجانب الأيسر غير قابل للنقر ، ويمكنك إضافة عناصر لقائمتك الجديدة. عندما تنتهي من إضافة عناصر جديدة ، ما عليك سوى النقر فوق "حفظ القائمة" .
ابحث عن مكون إضافي وثبته
الخطوة التالية هي البحث عن مكون إضافي وتثبيته. هناك العديد من المكونات الإضافية التي يمكن أن تساعدك في التعامل مع القوائم وتخصيصها . ومن أشهرها WP Mobile Menu و Max Mega Menu و Responsive Menu وما إلى ذلك. من أجل التوضيح ، لنقم بتثبيت WP Mobile Menu وتنشيطه.
بمجرد الانتهاء ، انتقل إلى Mobile Menu Options (خيارات قائمة الجوال) على الشريط الجانبي الأيسر لـ WordPress. داخل خيارات البرنامج المساعد ، يمكنك الآن اختيار ما إذا كنت تريد عرض قائمة هاتفك المحمول الجديدة على اليسار أو اليمين. حدد القائمة التي تم إنشاؤها مسبقًا ثم قم بالتمرير لأسفل إلى "إخفاء قائمة السمات الأصلية" . هناك ، يمكنك اختيار إزالة عناصر محددة من القائمة الأصلية. إذا نقرت على حقل "Find Element" ، فستحصل على معاينة حية للتحديدات للاختيار من بينها. بعد الانتهاء من عملية الاختيار ، ما عليك سوى حفظ التغييرات.


استبدال أو إخفاء القائمة
بعد أن تختار ما تريد إخفاءه ، ما عليك سوى الرجوع إلى المظهر> القوائم . حدد من القائمة المنسدلة قائمة الجوال التي تم إنشاؤها مسبقًا وقم بتعيين "موقع العرض" . القائمة الأصلية الخاصة بك مخفية الآن واستبدالها بقائمتك المخصصة.
يمكنك الآن زيارة موقع الويب الخاص بك لمشاهدة القائمة الجديدة الخاصة بك قيد التشغيل. سيخفي المكون الإضافي الآن قائمة الهاتف المحمول لموضوعك ويعرض بدلاً من ذلك قائمة مخصصة.
كيفية إخفاء القائمة برمز CSS
تتطلب طريقة أخرى لإخفاء قائمة الجوال معرفة معينة بكود CSS وممارساته . الأشخاص الذين غالبًا ما ينشئون قوالب WordPress مخصصة يعرفون بالفعل مدى تعقيد بعض التخصيصات. وبالنظر إلى هذه النقاط ، فهي ليست طريقة موصى بها تمامًا للمبتدئين. مع ذلك…
ابحث عن اسم القائمة الخاصة بك
الخطوة الأولى هي العثور على القائمة التي تريد تعديلها. ربما تكون أسهل طريقة هي استخدام أدوات مطور المتصفح المتكاملة . انتقل إلى موقع الويب الخاص بك حيث تريد إجراء التغييرات وفتح أدوات المطور. إذا كنت تستخدم Google Chrome ، فيمكنك القيام بذلك باستخدام اختصار Ctrl + Shift + I. في الجزء العلوي من الشاشة ، ستجد خيار Toggle Device Toolbar الذي سيوضح لك كيف يبدو موقع الويب الخاص بك على الأجهزة المحمولة. يمكنك حتى تغيير الأنواع والقرارات المختلفة.
الآن بعد أن رأيت كيفية عرضه على الأجهزة المحمولة ، حدد الزر الذي يشبه السهم وانقر على القائمة الخاصة بك لفحصه. سيقودك على الفور إلى جزء من الكود حيث يمكنك رؤية فئة CSS لقائمة معينة. هذا هو ، سترى اسم الفصل هذا.
إخفاء القائمة الخاصة بك مع سطر جديد من التعليمات البرمجية
بعد حصولك على الاسم الصحيح ، ما عليك سوى الانتقال إلى المظهر> تخصيص وتحديد "CSS إضافية" . بشكل عام ، يكون هذا عادةً في الجزء السفلي من الشريط الجانبي الأيسر. انقر فوقه ، وستظهر لك الشاشة التالية. هناك ، يمكنك النقر فوق الجزء السفلي من الشاشة لتحديد عرض الهاتف المحمول وفوقه ، ستدخل الرمز لإخفاء القائمة:
الكود: .menu-name {display: none؛}
أخيرًا ، انقر فوق الزر "نشر" وتكون بذلك قد انتهيت. إذا كنت أكثر دراية برمز CSS ، فيمكن إكمال الكثير من هذه التغييرات داخل ملف CSS. ومع ذلك ، سيتعين عليك الانتباه إلى الاستفسارات الإعلامية. سيسمحون لك بإنشاء قواعد مختلفة لأجهزة مختلفة ، بحيث يمكنك التحكم بشكل أكبر في مواقع الويب الخاصة بك وسلوك القائمة.

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