آموزش قراردادن آیکون درکناراسم سایت

  • ۱۵۹۵

آموزش قرار دادن آیکون در کنار اسم سایت یا وبلاگ (FavIcon)

حتما شما هم Icon یا شکلک هایی که در کنار عنوان سایت ها در مرورگر نمایش داده می شود را دیده اید. استفاده از این شکلک ها که به آن Favicon گفته می شود، علاوه بر زیبایی باعث مشخص شدن یک سایت در بین Tab های مختلف می شود.

اگر دوست دارید برای سایت یا وبلاگ خود Favicon ایجاد کنید، با این مقاله آموزشی همراه شوید.

مرحله اول :

قبل از هر چیز، باید آیکون یا شکلک مورد نظر خود را طراحی کنید. برنامه های زیادی برای طراحی آیکون وجود دارند که می توانید از آنها استفاده کنید. و یا می توانید از بین مجموعه آیکون های آماده، یکی را انتخاب کنید. اما توجه داشته باشید که آیکون مورد نظر، باید در اندازه 32x32 پیکسل باشد. اگر آیکون مورد علاقه شما بزرگ تر از این اندازه بود، باید آن را ویرایش کرده و کوچک کنید.

از این سایت ها هم می توانید برای ایجاد Favicon استفاده کنید :

www.favicon.cc

 

اسم آیکونی که می خواهید به عنوان Favicon استفاده کنید را favicon.ico قرار دهید.

 

مرحله دوم :

بعد از آماده کردن آیکون مورد نظر خود، باید آن را در فضایی در اینترنت آپلود کنید.

 

- اگر هاست مستقل برای سایت خود دارید، به راحتی فایل favicon.ico را در ریشه اصلی سایت خود در پوشه public_html قرار دهید. و کار تمام است. بعد از Refresh کردن صفحه اول سایت خود، favicon را خواهید دید.

 

- اگر وبلاگ دارید، ابتدا باید فایل favicon.icon را در فضایی در اینترنت آپلود کنید. (مثلا در آپلود سنتر سرویس دهنده وبلاگتان) . سپس باید این کد را در فایل اصلی قالب وبلاگ خود ، و بعد از تگ <head> قرار دهید :

 

  <link href="http://Address/favicon.ico" rel="shortcut icon">


به جای عبارت قرمز رنگ ، آدرس لینکی که favicon.ico را آپلود کرده اید قرار دهید.

مثلا

<link href="http://bayanbox.ir/id/3821125568990108234?view" rel="shortcut icon">

 

بعد از Refresh کردن وبلاگ خود، آیکون را خواهید دید.

در قالب های بلاگ هم در قسمت ویرایش ساختار فعلی بعد از<!DOCTYPE html><html><head> شماره 2

آدرس عکسی را که آپلود کرده‌اید قرار دهید،به این ترتیب بعد ازRefresh کردن در کنار وب شما آیکون مورد نظر قرارمی گیرد.

              

ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
شما میتوانید از این تگهای html استفاده کنید:
<b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">