سأشرح لكم في هذه التدوينة عملية وضع شعار مدونتك في مسار المتصفح أو ما يُسمى favicon باللغة الإنجليزية. لا بد أنك لاحظت أن العديد من المواقع تحتوي على شعار صغير بجانب مسار أو رابط الموقع في أعلى المتصفح. هذا الشعار والذي عادة ما يكون بحجم 16×16 بكسل هو عبارة عن صورة ولكن بحاشية ico. (التي ترمز لكونه أيقونة أو icon) وليس jpg. مثلاً.
حتى تضع هذا الشعار لا بد أن يكون لديك صورة ما تريد إستخدامها. بعد ذلك عليك تحويل الصورة إلى نوع ico أو أيقونة. هناك عدة طرق للقيام بذلك، ولكن أسهل طريقة هي بإستخدام المواقع المتخصصة على الشبكة والتي تقدم هذه الخدمة مجاناً. شخصياً، أستخدم موقع www.html-kit.com. كما هو واضح، كل ما عليك القيام به هو رفع الصورة من حاسوبك على الموقع ومن ثم ضغط Generate Favicon.ico. قم بعد ذلك بتنزيل الشعار الجديد إلى حاسوبك.
إذن لديك الآن شعار أيقونة لمدونتك ذات حاشية ico. لم يتبقى سوى ربط هذا الشعار بموقعك. للقيام بذلك عليك أولاً أن ترفع أيقونة الشعار ico. من حاسوبك إلى المجلد الرئيسي لموقعك (public_html مثلاً) وإلى مجلد images داخل مجلد الثيم أو القالب الذي تستخدمه (بإستخدام برنامج FTP مثلاً).
بعد رفع الشعار، إذهب إلى ملف header.php وأدخل الكود التالي:
<link rel="icon" type="image/x-icon" href="http://myblog.com/wp-content/themes/mythemename/images/ favicon.ico" /> <link rel="shortcut icon" type="image/x-icon" href="http://myblog.com/wp-content/ themes/mythemename/images/favicon.ico</span>" />
حيث myblog.com يساوي عنوان موقعك و mythemename يساوي إسم القالب الذي تستخدمه و favicon.ico هو إسم شعارك الذي رفعته للتو.
الهدف من ذلك هو التأكد من ظهور الشعار في الصفحة الرئيسية على الأقل في حال فشل المتصفح من ملاحظة الإيقونة في المجلد الرئيسي.
تأكد أنك وضعت هذا الكود في مع باقي روابط “link rel” وبين <head> و <head/> الموجودة في ملف الهيدر وإحفظه. أعد الدخول إلى موقعك من جديد وستشاهد الإيقونة يجانب مسار موقعك في أعلى المتصفح، كما يلي (أنقر على الصورة لتكبيرها):
ملاحظة: قد تحتاج إلى “رفرشة” أو مسح الذاكرة المؤقتة cache من متصفحك حتى تشاهد الشعار.
بالتوفيق، وما عليكم إلا السؤال إذا إحتجتم أي مساعدة.
9 تعليقات على “كيف تضيف شعار مدونتك إلى مسار المتصفح”
في الحقيقة كنت أبحث عنها من زمن!
أشكرك على هذا الموضوع المتميز الذي يهم ملاك ومطوري المواقع .. لك تقديري.
السلام عليكم،
تسلم يداك اخي على الشرح الوافي.
بالمناسبة هنا بعض الفحوصات الأساسية تفيد المواقع قبل الإطلاق الرسمي..
http://www.7lul.com/blog/web-dev/10-essential-checks-before-launching-your-site/
شكراً لك يا عزيزي..
من جد كنت أبحث عنها من زمان!
ألف شكر..
مرحباً أخي الكريم
بحثت عن هذا الأمر كثيراً، وحاولت تطبيقه مراراً فلم أفلح!
سؤالي وحيرتي تكمن في كيفية رفع الصورة المصغّرة إلى مجلد الصور أو إلى ملفات موقعي حتى.. مع العلم أن مدونتي مستضافة بشكل مجاني في ووردبريس.
هل بالإمكان مساعدتي؟
تقبل التقدير
أخي علي،
ووردبريس.كوم لا تسمح برفع الملفات أو الصور..
مرحباً مجدداً، وشكراً على التواصل السريع
فهمت ما تقوله، لكنني وجدت بعض المدونات المجانية في ووردبريس أضافت شعاراً لها في مسار المتصفح..
هذه على سبيل المثال:
http://5osh.wordpress.com
تقبل تقديري الكبير للمجهود الذي تبذله في هذه المدونة الرائعة
@علي،
قد تكون هذه ميزة جديدة لا علم لي بها.. أو أن هذه المواقع تدفع الرسوم الشهرية مقابل الخدمات التي تقدمها ووردبريس.كوم..
أنصحك بمتابعة هذه المدونة أو الإستفسار في منتدى ووردبرس.كوم العربي..
تحياتي لك..
ربما يكون هذا هو الأمر … على أية حال
أشكرك على التفاعل الطيب
بارك الله فيك، ولقد إستفدت من المدونة كثيراً..
أضف تعليق (الرجاء عدم إستخدام اللهجة العامية)