كما تعلم، هناك العديد من الطرق لتحسين تجربة المستخدم في تصميم المواقع الإلكترونية ، ومنها إضافة أو تغيير أيقونات لوحة تحكم ووردبريس. لا يقتصر تخصيص لوحة تحكم ووردبريس على المظهر فقط، بل يهدف إلى جعل استخدام موقعك أسهل وأكثر متعة! للبدء بسرعة، أضف أو غيّر أيقونات لوحة التحكم.
تُسهّل الأيقونات المُخصصة سير عملك وتجعل التنقل سهلاً للغاية، خاصةً للمستخدمين الجدد. بالإضافة إلى ذلك، تُضفي لوحة التحكم المُخصصة شعوراً بالترحاب والمتعة أثناء العمل!
سنتعرف اليوم على أيقونات لوحة تحكم ووردبريس، ونوضح كيفية إضافتها بسهولة باستخدام إضافة، ونتعرف أيضًا على كيفية استخدام خط أيقونات ووردبريس. هل أنت مستعد لتحسين تجربة المستخدم لموقعك؟ هيا بنا نبدأ!
فهم أيقونات إدارة ووردبريس
ووردبريس هي تلك الصور الصغيرة التي تظهر بجانب كل عنصر من عناصر القائمة في لوحة تحكم ووردبريس. تُساعد هذه الأيقونات على جعل لوحة التنقل أكثر سهولة في الاستخدام وأكثر تنظيمًا بصريًا. يستخدم ووردبريس افتراضيًا خط Dashicons ، وهو خط أيقونات موجود منذ عام ٢٠١٣ ولم يطرأ عليه تغيير كبير منذ ذلك الحين.
إذا كنت ترغب في تجديد لوحة تحكم ووردبريس الخاصة بك، فإن تغيير هذه الأيقونات يُعد بداية رائعة! يمكنك استبدال الأيقونات الافتراضية بأيقونات تناسب ذوقك بشكل أفضل، أو حتى إضافة أيقوناتك الخاصة للحصول على مظهر شخصي مميز.
تُعدّ الأيقونات وسيلة فعّالة لأنها معروفة عالميًا، وتُسهّل على المستخدمين العثور على ما يحتاجونه، سواءً أكانت صفحة تسجيل الدخول، أو مقالًا مُحددًا، أو أقسامًا رئيسية أخرى في الموقع. وهذا مفيدٌ للغاية، خاصةً إذا كنت تعمل على موقع متعدد اللغات أو تستهدف جمهورًا دوليًا.
بالنسبة لعملاء تصميم المواقع الإلكترونية غير الملمين بـ WordPress، يمكن للأيقونات المخصصة تبسيط التنقل في لوحة تحكم الإدارة وجعل التجربة تبدو مصممة خصيصًا لهم.
تعرّف على: كيفية إصلاح مشكلة عدم ظهور أيقونات Elementor؟
تُعد أيقونات إدارة ووردبريس عناصر أساسية في تصميم مواقع الويب
تواصل مع مصممي مواقع الويب لدينا وأضف أو غيّر أيقونات إدارة ووردبريس بسهولة وحسّن تجربة المستخدم لموقعك الإلكتروني.
كيفية إضافة أو تغيير أيقونات لوحة تحكم ووردبريس: طريقتان
بعد أن تعرفت على وظيفة أيقونات إدارة ووردبريس، حان الوقت لفهم كيفية إضافة أو تغيير أيقونات الإدارة في ووردبريس. هناك طريقتان لتعديل أيقونات إدارة ووردبريس بسهولة. الأولى هي استخدام إضافة (Plugin) لإنجاز المهمة بسرعة وسهولة. أما الثانية فهي تغيير أيقونات الإدارة باستخدام جزء من التعليمات البرمجية.
سنستعرض كلا الطريقتين لمساعدتك في تحديد الأنسب لك. هيا بنا نبدأ:
كيفية إضافة أو تغيير أيقونات لوحة تحكم ووردبريس باستخدام إضافة
إذا كنت جديدًا على إضافة الأيقونات في ووردبريس، فإن استخدام إضافة هو أسهل طريقة للبدء. في هذا الدليل، سنوضح لك كيفية إضافة الأيقونات باستخدام Font Awesome .
للحصول على أيقونات على موقع ووردبريس الخاص بك باستخدام Font Awesome، اتبع هذه الخطوات البسيطة:
قم بتثبيت وتفعيل الإضافة.
أولاً، قم بتسجيل الدخول إلى لوحة تحكم ووردبريس الخاصة بك، ثم انتقل إلى الإضافات وقم بتثبيت وتفعيل إضافة Font Awesome.
اضبط إعدادات الإضافة حسب الحاجة.
بعد التفعيل، ستتم إعادة توجيهك إلى الإضافات المثبتة . ابحث عن Font Awesome وانقر على الإعدادات. تم إعداد الإضافة لاستخدام أيقونات الويب المجانية عبر شبكة توصيل المحتوى (CDN) الخاصة بـ Font Awesome افتراضيًا، لذا إذا كنت راضيًا عن ذلك، فأنت جاهز تمامًا.
تعرّف على: كيفية حذف مستخدمي إدارة ووردبريس غير المرئيين؟
إذا كنت ترغب في الحصول على أيقونات مجانية ومدفوعة، فستحتاج إلى إنشاء مجموعة أدوات Font Awesome، والحصول على رمز API، وإضافته إلى إعدادات الإضافة. (أما إذا كنت تبحث فقط عن أيقونات أساسية، فيمكنك تخطي هذه الخطوة!) بعد الانتهاء، لا تنسَ النقر على " حفظ التغييرات".
أضف الأيقونة في المكان الذي تريد أن تظهر فيه.
والآن إلى الجزء الممتع! يُمكن إضافة أيقونات Font Awesome باستخدام رمز مختصر أو HTML . صيغة الرمز المختصر هي [icon name= “value”]. ما عليك سوى استبدال "value" باسم الأيقونة التي تريدها. على سبيل المثال، لإضافة أيقونة جائزة، استخدم [icon name= “award”].
إذا كنتَ أكثر درايةً بلغة HTML، فيمكنك استخدام صيغة Font Awesome القياسية. توفر Font Awesome مقتطفات HTML لكل أيقونة، لذا ما عليك سوى نسخها ولصقها في المكان الذي ترغب في ظهور الأيقونة فيه.
قم بمعاينة التغييرات التي أجريتها.
قبل النشر، عاين المنشور أو الصفحة للتأكد من ظهور الأيقونة بشكل صحيح. إذا لم تظهر، فتأكد من استخدامك لأيقونة مجانية وليست مدفوعة.
تعرف أيضاً على: كيفية تعديل وتخصيص العناوين في ووردبريس بسلاسة؟
الطريقة الثانية: كيفية إضافة أو تغيير أيقونات قائمة الإدارة يدويًا باستخدام جزء من التعليمات البرمجية
إذا كنت ترغب في القيام ببعض العمل العملي، يمكنك تخصيص أيقونات المسؤول عن طريق إضافة القليل من التعليمات البرمجية.
قبل البدء، نوصي بالاطلاع على دليل سريع حول كيفية إضافة التعليمات البرمجية المخصصة بأمان في ووردبريس إذا لم تكن قد فعلت ذلك من قبل.
أسهل وأسلم طريقة للقيام بذلك هي استخدام WPCode ، وهي رائعة لإضافة أكواد مخصصة، وCSS ، وHTML دون خطر حدوث أي أعطال. بالإضافة إلى ذلك، هناك نسخة مجانية (WPCode Lite) تؤدي الغرض، بينما تتضمن النسخة المدفوعة بعض الميزات الإضافية المفيدة.
مثال: استبدال أيقونة باستخدام أيقونات Dashicons الافتراضية
في هذا المثال، سنستخدم Dashicons (مجموعة الأيقونات المدمجة في ووردبريس) لاستبدال أيقونة موجودة. ولأن Dashicons مُحسّنة لووردبريس، فلن تُبطئ موقعك.
إليك ما ستحتاجه قبل أن تبدأ:
- عنوان URL لعنصر القائمة الذي تريد تحديثه
- اسم الأيقونة التي تريد استخدامها
لنفترض أنك تريد تغيير أيقونة قائمة "المنشورات". ما عليك سوى تمرير مؤشر الماوس فوق عنصر قائمة "المنشورات" في لوحة التحكم، وسترى عنوان URL في شريط الحالة أسفل المتصفح. أنت تحتاج فقط إلى الجزء الأخير - هنا، سيكون edit.php.
بعد ذلك، انتقل إلى موقع Dashicons الإلكتروني، وابحث عن الأيقونة التي تريدها، وانسخ "slug" الخاص بها (مثل dash icons-format-aside).
والآن، لنضف الكود:
- انتقل إلى مقتطفات التعليمات البرمجية » أضف مقتطفًا في لوحة التحكم الخاصة بك.
- انقر على + إضافة مقتطف مخصص وقم بإعطاء المقتطف عنوانًا.
- اختر "مقتطف PHP" ضمن "نوع الكود" ، ثم الصق الكود التالي في المحرر:
دالة تغيير أيقونة قائمة المنشورات() {global $menu;// المرور على عناصر القائمة foreach ($menu as $key => $menu_item) {// البحث عن عنصر قائمة "المنشورات" (عنوان URL الافتراضي هو 'edit.php')if (isset($menu_item[2]) && $menu_item[2] == 'edit.php') {// تغيير الأيقونة إلى فئة Dashicon مختلفة $menu[$key][6] = 'dashicons-format-aside'; // غيّر هذا إلى اسم Dashicon المفضل لديك}}}add_action('admin_menu', 'change_post_menu_icon');
ما عليك سوى استبدال dashicons-format-aside برمز الأيقونة الذي نسخته سابقًا.
بعد وضع الكود، انتقل إلى الإدراج ، واضبط الموقع على "للمسؤولين فقط"، ثم فعّل المقتطف . بعد ذلك، انقر على "حفظ المقتطف" .
الآن، سيبدأ ووردبريس باستخدام الأيقونة التي اخترتها لصفحة المنشورات - بكل بساطة!
ذات صلة: كيفية إعداد رموز Elementor المختصرة لاستخدام القوالب بسهولة
يختتم
كما ترى، ليس من الصعب إضافة أو تغيير أيقونات لوحة تحكم ووردبريس. بمجرد فهمك لجوهر هذه الأيقونات ووظائفها، ستساعدك على تحسين تصميم موقعك الإلكتروني وتجربة المستخدم.
سواء اخترتَ استخدام إضافة لتغيير الأيقونات بسرعة أو تجربة إضافة كود برمجي مخصص للتحكم المباشر، فإن العملية سهلة وبسيطة، ويمكن أن تُحدث فرقًا كبيرًا، خاصةً للعملاء أو المستخدمين غير الملمين بـ WordPress. لذا، انطلق - امنح لوحة التحكم الخاصة بك لمسةً جماليةً واجعلها تعكس شخصيتك!
