كيفية إضافة زر في قائمة رأس ووردبريس الخاصة بك

هل تريد إضافة زر في قائمة رأس  ووردبريس الخاصة بك؟

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

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

إضافة أزرار في قائمة التنقل في  ووردبريس

لماذا تضيف زرًا في قائمة رأس  ووردبريس؟

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

قائمة التنقل في الرأس مع روابط عادية

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

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

قائمة التنقل مع زر

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

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

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

إضافة زر في قائمة رأس  ووردبريس الخاصة بك

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

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

أضف رابطًا لقائمة  ووردبريس

بعد ذلك ، تحتاج إلى النقر فوق الزر ” خيارات الشاشة” في الأعلى. سيكشف هذا عن قائمة ذبابة مع مجموعة من الخيارات. تحتاج إلى تحديد المربع بجوار خيار “فئات CSS”.

إظهار فئات CSS في خيارات الشاشة

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

أضف فئة CSS مخصصة إلى ارتباط

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

بعد إدخال الاسم ، انقر فوق الزر “حفظ القائمة” لتخزين تغييراتك.

الآن بعد أن أضفنا فئة CSS المخصصة الخاصة بنا إلى عنصر القائمة ، يمكننا تصميمها عن طريق إضافة كود CSS المخصص الخاص بنا .

ما عليك سوى الانتقال إلى المظهر »تخصيص لبدء تشغيل مُخصص سمة  ووردبريس.

سترى الآن معاينة مباشرة لموقع الويب الخاص بك على اليمين ومجموعة من إعدادات السمات في العمود الأيسر.

خيار CSS إضافي في أداة تخصيص سمة  ووردبريس

أنت الآن بحاجة إلى النقر فوق علامة التبويب CSS الإضافية لتوسيعها. سيُظهر لك هذا مربعًا حيث يمكنك إضافة رمز CSS المخصص الخاص بك.

هنا ، يمكنك نسخ ولصق كود CSS التالي كنقطة بداية.

.menu-button { 
background-color:#eb5e28;
border:1px;
border-radius:3px;
-webkit-box-shadow:1px 1px 0px 0px #2f2f2f;
-moz-box-shadow:1px 1px 0px 0px #2f2f2f;
box-shadow:1px 1px 0px 0px #2f2f2f;
}
.menu-button a,  .menu-button a:hover, .menu-button a:active { 
color:#fff !important;
}

بمجرد إضافة رمز CSS ، سيقوم مُخصص السمات بتطبيقه تلقائيًا على معاينة موقع الويب الخاص بك ، وستكون قادرًا على رؤية التغييرات سارية المفعول.

لا تقلق ، لن يتم نشر التغييرات على موقع الويب الخاص بك حتى تقوم بالنقر فوق الزر نشر.

معاينة زر القائمة

لا تتردد في اللعب مع CSS بقدر ما تريد. يمكنك تغيير لون الخلفية ولون نص الرابط وإضافة حدود والمزيد.

لا تنس النقر فوق الزر “نشر” لحفظ التغييرات.

ألم يكن هذا سهلا؟

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

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

خدمات مميزة لآجلك

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

اشترك معنا لمزيد من المعرفة

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