شرح كيفية وضع صورة favicon ليظهر على معظم الأجهزة

بسم الله الرحمن الرحيم السلام عليكم ورحمة الله وبركاته في هذا الشرح السريع سنتعرف على ايقونة favicon التي تظهر بجانب اس ..




26-06-2017 07:53 صباحا
kareem
عضـو متميز
rating
العضو غائب الدراسة
معلومات الكاتب ▼
تاريخ الإنضمام : 03-03-2014
رقم العضوية : 5072
المشاركات : 718
الجنس : ذكر
الدعوات : 1
يتابعهم : 1
يتابعونه : 15
قوة السمعة : 5120
موقعي : زيارة موقعي
عدد الإجابات: 38
اصدار المنتدى : 3.0.2
 offline 
بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته

في هذا الشرح السريع سنتعرف على ايقونة favicon التي تظهر بجانب اسم الموقع في الشريط العلوي للمتصفح كالتالي

NDA0NTg0MQ3939favicon_demo
في برنامج المنتدى الملف favicon.ico  موجود في مجلد المنتدى ارفع الملف الخاص بموقعك بدل منه وسيظهر مكانه في شريط المتصفح
ولكن المتصفحات تتطور وتزداد المتطلبات لتظهر صورة موقعك عليها بالشكل المناسب هذا مثال لمتصفح كروم على نظام أندرويد

MjQxOTc1MQ7474Screenshot_chrome_android
انظر كيف تظهر صورة الفيسبوك واليوتيوب لأنها مواقع أضافت معرفات جديدة ل favicon

طريقة إضافة صورة الموقع بدل أول حرف من النطاق

يكفي أن ترفع صورة اسمها
apple-touch-icon.png
لمجلد منتداك بالأبعاد 180x180

ثم تدخل للوحة الإدارة وتحرر القالب
headinclud

وتبحث عن
<link rel="shortcut icon" href="{$ForumAdress}favicon.ico" />


وتضيف تحتها

<link rel="apple-touch-icon" href="{$ForumAdress}apple-touch-icon.png" />


ثم تحفظ القالب

إذا لا يوجد لديك ملف favicon.ico يمكنك رفع صورة بالأبعاد 16x16 لمجلد المنتدى وتحرر القالب headinclud

وتستبدل

<link rel="shortcut icon" href="{$ForumAdress}favicon.ico" />


ب

<link rel="icon" href="{$ForumAdress}favicon.png" type="image/x-icon" />


وتحفظ القالب

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

مواقع مفيدة
موقع يتيح لك رفع صورة وينتج لك ملفات favicon والأكواد لتضيفها في الهيدر لدعم أغلبية المتصفحات على مختلف الأجهزة.
www.favicon-generator.org/
وموقع آخر
realfavicongenerator.net/

دمتم بخير
 
 
  favicon.zip   تحميل zip مرات التحميل :(0)
الحجم :(5.495) KB


26-06-2017 01:21 مساء
مشاهدة مشاركة منفردة [1]
أبو أنس السيوطي
عضـو مشارك
rating
معلومات الكاتب ▼
تاريخ الإنضمام : 29-05-2016
رقم العضوية : 6689
المشاركات : 12
الدولة : مصر
الجنس : ذكر
تاريخ الميلاد : 9-11-1991
يتابعهم : 0
يتابعونه : 0
قوة السمعة : 0
موقعي : زيارة موقعي
اصدار المنتدى : 3.0.2
 offline 
look/images/icons/i1.gif شرح كيفية وضع صورة favicon ليظهر على معظم الأجهزة
وعليكم السلام ورحمة الله وبركاته
جزاك الله خيرا اخي كريم
شرح سهل ومبسط
وقليل من يهتم بهذه الأشياء الصغيرة 
التي تجعل المنتدى أكثر احترافية
اسأل الله لك التوفيق  ولا تحرمنا من كل ما هو جديد

26-06-2017 01:34 مساء
مشاهدة مشاركة منفردة [2]
عبدالاله الهذلي
عضـو نشيط
rating
معلومات الكاتب ▼
تاريخ الإنضمام : 23-08-2016
رقم العضوية : 6837
المشاركات : 393
الدولة : الطائف
الجنس : ذكر
تاريخ الميلاد : 1-5-1998
الدعوات : 1
يتابعهم : 7
يتابعونه : 29
قوة السمعة : 600
موقعي : زيارة موقعي
عدد الإجابات: 18
اصدار المنتدى : 3.0.2
 offline 
look/images/icons/i1.gif شرح كيفية وضع صورة favicon ليظهر على معظم الأجهزة
صراحة أهنيك بـ أعماق قلبي ، أبدعت وكسرت روتين الأبداع .
سلمت على الشرح المميز
يالمميز 

26-06-2017 10:32 مساء
مشاهدة مشاركة منفردة [3]
kareem
عضـو متميز
rating
العضو غائب الدراسة
معلومات الكاتب ▼
تاريخ الإنضمام : 03-03-2014
رقم العضوية : 5072
المشاركات : 718
الجنس : ذكر
الدعوات : 1
يتابعهم : 1
يتابعونه : 15
قوة السمعة : 5120
موقعي : زيارة موقعي
عدد الإجابات: 38
اصدار المنتدى : 3.0.2
 offline 
look/images/icons/i1.gif شرح كيفية وضع صورة favicon ليظهر على معظم الأجهزة
المشاركة الأصلية كتبت بواسطة: أبو أنس السيوطي »
وعليكم السلام ورحمة الله وبركاته
جزاك الله خيرا اخي كريم
شرح سهل ومبسط
وقليل من يهتم بهذه الأشياء الصغيرة 
التي تجعل المنتدى أكثر احترافية
اسأل الله لك التوفيق  ولا تحرمنا من كل ما هو جديد
المشاركة الأصلية كتبت بواسطة: عبدالاله الهذلي »
صراحة أهنيك بـ أعماق قلبي ، أبدعت وكسرت روتين الأبداع .
سلمت على الشرح المميز
يالمميز 


شكرا على المرور والإهتمام.
 

28-06-2017 09:26 مساء
مشاهدة مشاركة منفردة [4]
mc nabulsy
عضـو مشارك
rating
معلومات الكاتب ▼
تاريخ الإنضمام : 11-04-2016
رقم العضوية : 6595
المشاركات : 25
الدولة : فلسطين
الجنس : ذكر
تاريخ الميلاد : 11-9-1998
يتابعهم : 1
يتابعونه : 1
قوة السمعة : 0
موقعي : زيارة موقعي
اصدار المنتدى : غير محدد
 offline 
look/images/icons/i1.gif شرح كيفية وضع صورة favicon ليظهر على معظم الأجهزة
شكرا لك


تم تحرير المشاركة بواسطة :mc nabulsy
بتاريخ:28-06-2017 10:24 مساء



المواضيع المتشابهه
عنوان الموضوع الكاتب الردود الزوار آخر رد
كيفية اضافة ورفع نتيجة مدرسة علي المنتدي rimasmisr
9 583 wasssell
طلب كيفية تخطي فحص متطلبات التشغيل latrali
5 99 kareem
كيفية اضافة اعلان ادسنس شاشة كاملة دهباوي
2 102 kareem
بالفيديو كيفية تركيب ملحق برمجي "مصمم ألوان المجموعات" بواسطة ftp kareem
2 121 kareem
كيفية تحويل استايل منتدى woltlab الىpbboard3.0.2 imad276
2 142 عبدالاله الهذلي

الكلمات الدلالية
كيفية ، صورة ، favicon ، ليظهر ، معظم ، الأجهزة ،







الساعة الآن 09:23 صباحا