سینا صالحی فرد ۲۰ اردیبهشت ۱۳۹۳ ۲ 3894 بازدید
فیلم آموزش قراردادن فیوآیکن (favicon) در صفحات وب

حتماً تا به حال تصویر کوچک کنار عنوان صفحات وب را هنگام بازدید سایت های مختلف دیده اید. این تصویر که به آن فیوآیکن (favicon) می گویند، با استفاده از کدهای html، به صفحات سایت اضافه می شود. اگر می خواهید بدانید که چگونه به صفحه ی وب خود، فیوآیکن را اضافه کنید تا در تمامی مرورگرها قابل مشاهده باشد، فیلم آموزشی زیر را ببینید:

فیلم آموزش قراردادن فیوآیکن (favicon) در صفحات وب

برای دانلود فیلم آموزشی و اسنیپت های آموزش مربوطه از لینک های زیر استفاده کنید :

دسترسی به این بخش مخصوص اعضاست. شما می توانید به رایگان عضو شوید و به این بخش دسترسی داشته باشید. ورود / عضویت

دسترسی سریع :

متن فیلم آموزشی قراردادن فیوآیکن (favicon) در صفحات وب

Favicon

تصویر کوچکی است که کنار عنوان صفحه (title) در مرورگر نمایش داده می شود.

favicon1

برای قرار دادن favivon از تگ link که به صورت self close نوشته می شود استفاده می کنیم. این تگ در بین تگ head قرار می گیرد.

<link />

 

حال باید با صفت rel=”shortcut icon” نوع چیزی که داریم را مشخص کنیم و با صفت “http://adress.com/ax.png”=href آدرس تصویر را مشخص نماییم.

نکته : فیو آیکون می تواند فرمت های عکس gif,png , jpg و…. بگیرد.

مثال :


<html>
<head>
<title>welcome</title>
<link rel="shortcut icon"  href="http://onliner.ir/favicon-onliner.png"/>
<head>
<body>
</body>
</html>

نتیجه :

favicon2

نکته : اگر میخواهید در ورژن های قدیمی مرورگرها فیوآیکن شما نمایش داده شود، از تصویر با پسوند ico استفاده کنید. بهتر است اندازه فیو آیکن شما ۱۶*۱۶ باشد.

دسترسی سریع :

نظرات کاربران (۲)



  1. رائیکا

    سلام ممنون از اموزش های عالیتون
    من از شناسه placeholder استفاده کردم اما جز دستورات پیش فرض نیست تو محیط دریم ویور سی اس ۵ کار میکنم خروجی هم عمل نکرد
    اما با اون اسکریپت جواب گرفتم ولی تو اینترنت اکسپلورر اسکریپت جواب نداد IE9

    • گروه طراحی سایت

      سلام
      اسکریپت که همه جا ساپورت میشه مگر اینکه به پیام ها و یا تنظیمات مرورگرتون توجه نکرده باشید.
      و اما placeholder مربوط به html5 هست که باید چک بشه که مرورگرتون ازش پشتیبانی می کنه یا خیر.