3 طرق سهلة لإضافة رمز مفضل لـ WordPress في عام 2022 (دليل مناسب للمبتدئين)

هل أنت مستعد لتعلم كل ما تريد معرفته عن رمز WordPress المفضل لديك؟

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

سترى أيضًا أن بعض الأشخاص يطلقون على الرموز المفضلة "رمز الموقع". لا تقلق - إنهما نفس الشيء.

في هذا المنشور ، ستتعلم:

• لماذا يجب أن تهتم بشيء صغير مثل رمز WordPress المفضل لديك
• كيفية إنشاء رمز مفضل لموقع WordPress الخاص بك (وما الحجم والشكل المطلوب استخدامه)
• كيفية إضافة الأيقونة المفضلة إلى ووردبريس بثلاث طرق مختلفة

لماذا يجب أن تهتم بأيقونة WordPress المفضلة لديك

اعلم اعلم. ربما لن تؤدي الصورة الصغيرة التي تظهر في علامة تبويب المتصفح فقط إلى نجاح عملك أو كسره. ولكن هناك سببان يجب أن تستغرق بعض الوقت لإنشاء أيقونة مفضلة لـ WordPress.

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

إنها HeroThemes و Twitter ، أليس كذلك؟

هذا مهم لأن الأشخاص يحبون فتح عدة علامات تبويب ( لا - لست الوحيد الذي يخزن علامات التبويب! ). حتى في عام 2009 ، كان لدى الأشخاص متوسط ​​3 علامات تبويب ، مع وجود المزيد بين الشباب. وبينما لا يمكنني العثور على المزيد من البيانات الحديثة ، فأنا على استعداد للمراهنة على أن المتوسط ​​قد ارتفع وليس انخفض!

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

عندما تفكر في مدى سهولة إضافة رمز مفضل لـ WordPress ، فإن هذه الفوائد تستحق بالتأكيد قضاء بضع دقائق من يومك.

كيفية إنشاء صورة فافيكون بالحجم والشكل المناسبين

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

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

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

لذلك لإنشاء رمزك المفضل ، إليك كل ما تحتاجه:

• صورة مربعة. الحجم الأمثل لأيقونة WordPress هو 512 × 512 بكسل ، على الرغم من أن شيئًا أصغر مثل 260 × 260 بكسل لا يزال مقبولاً. ستعمل جميع الطرق التي سأعرضها لك على تغيير حجمها حسب الحاجة .
• صورة بتنسيق png ، وهي أفضل رهان للويب الحديث.

لإنشاء صورتك بالفعل ، يمكنك استخدام أداة مثل Adobe Photoshop أو GIMP. أو يمكنك أيضًا استخدام شيء مثل Favicon.io لإنشاء صورة الأيقونة المفضلة من نص أو رمز تعبيري.

إذا كان لديك شعار عالي الدقة ، فإن أسهل ما يمكنك فعله هو مجرد الحصول على نسخة مربعة من شعارك ( هذا ما نستخدمه في HeroThemes ).

كيفية إضافة رمز مفضل إلى WordPress (3 طرق)

بمجرد حصولك على ملف الصورة ، فأنت جاهز لإضافة هذا الرمز المفضل إلى موقع WordPress الخاص بك.

أدناه ، سأوضح لك ثلاث طرق مختلفة يمكنك من خلالها إضافة رمزك المفضل إلى WordPress. كل طريقة مختلفة قليلاً ، رغم ذلك.

لمساعدتك في اختيار الخيار المناسب لموقعك ، إليك ملخص سريع:

• أضف الأيقونة المفضلة مع وظائف WordPress الأساسية - هذا بسيط للغاية ويتيح لك إضافة رمزك المفضل عبر أداة تخصيص WordPress. الجانب السلبي الوحيد هو أنه لن يضيف تنسيقات favicon لجميع الأجهزة. بالنسبة لمعظم المواقع ، هذا جيد تمامًا ، على الرغم من ذلك .
• البرنامج الإضافي RealFaviconGenerator WordPress - هذا يجعل من السهل جدًا إضافة رمز مفضل لجميع الأجهزة . الجانب السلبي الوحيد المحتمل هو أنه يتطلب منك الحفاظ على المكون الإضافي نشطًا ، وهو ما قد لا يحبه بعض الأشخاص.
• الطريقة اليدوية RealFaviconGenerator - بدلاً من استخدام المكون الإضافي ، يمكنك استخدام موقع RealFaviconGenerator وإضافة الكود يدويًا. تلغي هذه الطريقة الحاجة إلى الاحتفاظ بالمكوِّن الإضافي نشطًا ، ولكنها تصبح أكثر تعقيدًا بعض الشيء لأنك ستحتاج إلى إضافة مقتطف رمز إلى رأس القالب الخاص بك.

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

كيفية إضافة رمز مفضل إلى WordPress مع الوظيفة الأساسية

هذا واحد بسيط حقًا لأنه يستخدم ميزة WordPress الأساسية.

للبدء ، انتقل إلى المظهر ← تخصيص في لوحة معلومات WordPress للوصول إلى مُخصص WordPress:

بمجرد دخولك إلى أداة تخصيص WordPress ، انقر فوق خيار Site Identity :

بعد ذلك ، ابحث عن قسم رمز الموقع وانقر على تحديد صورة لتحميل صورة الرمز المفضل لديك:

سيؤدي ذلك إلى فتح مكتبة وسائط WordPress العادية حيث يمكنك تحميل صورتك كما تفعل عادةً.

بمجرد تحميل صورتك ، انقر فوق الزر تحديد :

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

اضبط على الاقتصاص المناسب ثم انقر فوق Crop Image :

وانت انتهيت! تأكد من النقر فوق خيار النشر أعلى أداة تخصيص WordPress ويجب أن يكون الرمز المفضل لديك مباشرًا.

كيفية استخدام مكون إضافي لبرنامج WordPress Favicon (يغطي المزيد من الأجهزة)

الآن ، سأوضح لك كيفية استخدام مكون إضافي لأيقونة WordPress لتحقيق نفس التأثير.

مرة أخرى - يتمثل الاختلاف بين هذه الطريقة والطريقة السابقة في أن المكون الإضافي سيضيف الرموز المفضلة المحسّنة لمزيد من الأجهزة. يمنحك أيضًا واجهة تتيح لك تخصيص كيفية ظهور رمزك المفضل للأجهزة المختلفة.

ستتمكن من إنشاء مفضلات مخصصة من أجل:

• iOS
• ذكري المظهر
• هاتف ويندوز
• إلخ.

لست بحاجة إلى هذا بالضرورة - فالأمر يتعلق أكثر بتغطية حالات الحافة.

لاتباع هذه الطريقة ، ستحتاج إلى تثبيت Favicon المجاني بواسطة المكون الإضافي RealFaviconGenerator.

بمجرد تنشيط المكون الإضافي ، انتقل إلى Appearance → Favicon . استخدم الزر تحديد من مكتبة الوسائط لتحميل أو تحديد رمزك المفضل من مكتبة وسائط WordPress.

ثم ، انقر فوق إنشاء رمز مفضل :

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

بمجرد الانتهاء من إجراء تلك التعديلات ، قم بالتمرير لأسفل وانقر فوق الزر " إنشاء الرموز المفضلة" و "كود HTML" :

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

هذا هو! لقد انتهيت من كل شيء. فقط تأكد من إبقاء المكون الإضافي نشطًا - وإلا ستختفي الرموز المفضلة لديك.

كيفية إضافة رمز مفضل إلى WordPress يدويًا باستخدام أداة RealFaviconGenerator نفسها

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

إذا كانت هذه مشكلة بالنسبة لك ، فيمكنك أيضًا استخدام نفس الأداة للقيام بكل شيء يدويًا.

النتيجة النهائية هي نفسها تمامًا ، ستحتاج فقط إلى تحميل الصور يدويًا عبر FTP وإضافة بعض الأكواد إلى قسم <head> في موقعك.

سأقسم هذا إلى خطوات لأنه أكثر تعقيدًا بعض الشيء ...

الخطوة 1: إنشاء حزمة فافيكون الخاصة بك

للبدء ، توجه إلى موقع RealFaviconGenerator وانقر فوق تحديد صورة الأيقونة المفضلة لديك لتحميل صورة الأيقونة المفضلة الخاصة بك:

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

كما هو الحال مع المكون الإضافي ، قم بالتمرير لأسفل إلى أسفل وانقر فوق الزر إنشاء الرموز المفضلة لديك ورمز HTML عند الانتهاء من إجراء التعديلات:

الخطوة 2: قم بتحميل حزمة Favicon الخاصة بك إلى موقع الويب الخاص بك

في الشاشة التالية ، انقر فوق الزر لتنزيل حزمة Favicon الخاصة بك:

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

تأكد من وضع جميع الملفات في المجلد الجذر - لن يعمل هذا بطريقة أخرى.

الخطوة 3: أضف مقتطف الشفرة إلى <head> لموضوعك

لإنهاء الأمور ، ستحتاج إلى إضافة مقتطف الشفرة من RealFaviconGenerator إلى قسم <head> في قالب WordPress الخاص بك:

أو يمكنك إضافة مقتطف الشفرة التالي إلى ملف function.php في القالب الفرعي الخاص بك ( تحتاج إلى استخدام سمة فرعية ):

/* Adds the favicon code snippet from RealFaviconGenerator */
add_action('wp_head', 'add_favicon');
function add_favicon(){
?>
REPLACE THIS LINE OF TEXT WITH FAVICON CODE
<?php
};

كلتا الطريقتين على ما يرام!

بمجرد القيام بذلك ، تكون قد انتهيت تمامًا وسيبدأ الرمز المفضل لديك في العمل.

أضف أيقونة WordPress المفضلة لديك اليوم

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

وهذا هو الشيء العظيم:

بمجرد إضافة رمز مفضل إلى موقع WordPress الخاص بك ، فلن تضطر أبدًا إلى التفكير فيه مرة أخرى!

هل لديك أي أسئلة أخرى حول كيفية إضافة أيقونة WordPress المفضلة؟ أخبرنا في التعليقات وسنساعدك!