كيفية إضافة أيقونة مفضلة (Favicon) إلى موقع Framer الخاص بك
لإضافة أيقونة مفضلة في Framer: افتح إعدادات الموقع (⌘ + ,)، مرر لأسفل إلى "Site Images" ← "Favicon"، ارفع ملف PNG بحجم 64×64 بكسل، ثم انشر موقعك. هذا كل شيء.
الآن دعنا نستعرض التفاصيل ونحل أي مشكلات قد تواجهها.
مواصفات الأيقونة المفضلة في Framer
يتطلب Framer مواصفات محددة للأيقونة المفضلة:
- الحجم: 64 × 64 بكسل
- الصيغة: PNG (موصى بها)
- الخلفية: شفافة
الخطوة 1: فتح إعدادات الموقع
طريقتان للوصول إلى الإعدادات:
- اختصار لوحة المفاتيح: اضغط
⌘ + ,(Mac) أوCtrl + ,(Windows) - القائمة: انقر على أيقونة Framer ← Site Settings ← Open Settings
الخطوة 2: العثور على قسم الأيقونة المفضلة
- مرر لأسفل إلى "Site Images"
- حدد منطقة رفع "Favicon"
الخطوة 3: رفع الأيقونة المفضلة
يوفر Framer خانتين للرفع:
- أيقونة السمة الفاتحة: تظهر في المتصفحات ذات الوضع الفاتح
- أيقونة السمة الداكنة: تظهر في المتصفحات ذات الوضع الداكن
ارفع نفس الصورة في كلتا الخانتين إذا كان لديك نسخة واحدة فقط.
الخطوة 4: نشر موقعك
- انقر على زر النشر (Publish)
- تظهر الأيقونة المفضلة فقط على الموقع المنشور، وليس في المعاينة
دعم الوضع الفاتح والداكن
لماذا تستخدم نسختين؟
- الشعارات الداكنة تختفي على تبويبات المتصفح الداكنة
- الشعارات الفاتحة تختفي على تبويبات المتصفح الفاتحة
- النسخ المنفصلة تضمن الرؤية في جميع الأوضاع
كيفية إنشاء النسخ
- ابدأ بأيقونتك المفضلة العادية
- اعكس الألوان للنسخة البديلة
- حافظ على نفس الشكل والتصميم
- استخدم خلفيات شفافة لكلتا النسختين
إعداد أيقونة Apple Touch
منذ سبتمبر 2024، يدعم Framer أيقونات Apple Touch:
- الموقع: نفس قسم Site Images
- الحجم: 180 × 180 بكسل
- الغرض: أيقونة الشاشة الرئيسية على أجهزة iOS
استكشاف الأخطاء: الأيقونة المفضلة لا تظهر
تحقق من الأساسيات
- هل نشرت الموقع؟
- تحديث إجباري:
Cmd+Shift+RأوCtrl+Shift+R - جرب نافذة التصفح المتخفي
تحقق من موقع الرفع
- يجب أن تكون في إعدادات الموقع (Site Settings)، وليس إعدادات الصفحة
- يجب أن يكون الملف بصيغة PNG صالحة
استكشاف الأخطاء: Google يعرض الأيقونة القديمة
يحدّث Google الأيقونات المفضلة ببطء (من أيام إلى أسابيع).
خطوات لتسريع التحديث
- تأكد من أن الأيقونة المفضلة منشورة على موقعك
- افتح Google Search Console
- استخدم أداة فحص عنوان URL على الصفحة الرئيسية
- اطلب إعادة الفهرسة
استكشاف الأخطاء: مشاكل Safari
يخزن Safari الأيقونات المفضلة في الذاكرة المؤقتة بشكل مكثف.
خطوات الإصلاح
- امسح ذاكرة Safari المؤقتة بالكامل
- احذف ذاكرة الأيقونات المؤقتة:
~/Library/Safari/Favicon Cache/ - أغلق Safari وأعد فتحه
استكشاف الأخطاء: شعار Framer لا يزال يظهر
الأسباب الشائعة:
- لم يتم نشر الموقع بعد رفع الأيقونة
- مشكلة في ذاكرة المتصفح المؤقتة
- عرض المعاينة بدلاً من الموقع المنشور
الحل: انشر الموقع وامسح ذاكرة المتصفح المؤقتة.
أفضل الممارسات
- احتفظ بنسخ احتياطية: احفظ ملفات الأيقونة الأصلية
- اختبر في كل مكان: تحقق على Mac وWindows وiOS وAndroid
- استخدم أدوات التحقق: Favicon.im يتحقق من إعداداتك
- وثّق الألوان: تتبع أكواد الألوان الدقيقة لضمان اتساق العلامة التجارية
الأسئلة الشائعة
كيف أضيف أيقونة مفضلة في Framer؟
افتح إعدادات الموقع بالضغط على ⌘ + ,، مرر لأسفل إلى "Site Images"، انقر على "Favicon"، ارفع ملف PNG بحجم 64×64 بكسل، ثم انشر موقعك.
ما الحجم المناسب لأيقونة Framer المفضلة؟
يوصي Framer بحجم 64 × 64 بكسل بصيغة PNG مع خلفية شفافة.
لماذا لا تظهر أيقونة Framer المفضلة؟
الأسباب الأكثر شيوعاً: الموقع غير منشور، ذاكرة المتصفح المؤقتة، أو موقع رفع خاطئ. انشر موقعك، حدّث الصفحة إجبارياً، أو جرب نافذة التصفح المتخفي.
كم يستغرق Google لتحديث الأيقونة المفضلة؟
يحدّث Google الأيقونات المفضلة ببطء — عادةً من أيام إلى أسابيع. اطلب إعادة الفهرسة عبر Google Search Console لتسريع العملية.
هل يدعم Framer أيقونات الوضع الداكن؟
نعم. منذ سبتمبر 2024، يتيح لك Framer رفع أيقونات منفصلة للسمة الفاتحة والداكنة في إعدادات Site Images.
المراجع
- How to set up a favicon in Framer - مساعدة Framer الرسمية
- September 2024 Update: Apple Touch Icon and Favicons - تحديثات Framer
- Why isn't Safari displaying the favicon? - استكشاف أخطاء Framer
- Favicon.im - أداة اختبار والتحقق من الأيقونات المفضلة
Use favicon.im to quickly check if your favicon is configured correctly. Our free tool ensures your website's favicon displays properly across all browsers and devices.
Free Public Service
Favicon.im is a completely free public service trusted by developers worldwide.