هر سایتی یک شناسه ی خاص برای خودش داره.در واقع برای هر سایت مثل یک برند یک سری مشخصات وجود داره.مهم تر از همه دامین سایته که معرف اصلیشه.بعد از اون یک سری موارد دلخواه مثل  لوگو اختصاصی هست که برای سایت ها مورد استفاده قرار می گیره.قطعا مشاهده کردید که در خیلی از سایت ها تصاویر کوچکی در کنار آدرس سایت و در نوار مرورگر وجود داره.این تصاویر فاوآیکن(favicon) نامیده میشن.در این مقاله مختصری به معرفی فاوآیکن و هک کاریردی برای  ایجاد اون در سایت می پردازیم.

فاوآیکن در وردپرس

فاوآیکن چیست؟

به شکل های کوچک که به شکل آیکن در کنار آدرس سایت و در مروگر قابل مشاهده هستن فاوآیکن گفته میشه.فاوآیکن یک نماد از سایت شماست و به شناخته شدن سایت شما کمک می کنه.در واقع برای اعتبار سایت شما لازمه.در پست های آینده چندین اشتباه رایج در وردپرس رو توضیح خواهیم داد که یکی از مهم ترین اونا عدم استفاده از فاوآیکنه.فاوآیکن معمولا سایز کوچک تر لوگوی یک سایته.حال این که بعضی از سایت ها هم از لوگو و فاوایکن متفاوتی استفاده می کنن.به علاوه اغلب قالب های مدرن وردپرس که طراحی میشن این امکانو خودشون دارن.کافیه در کنترل پنل فالب جست وجویی داشته باشید.به هر حال قالب هایی هستن که این ویژگی رو ندارن و در این آموزش با یک کد این ویژگی رو به قالب اضافه می کنیم.

نحوه ساخت فاوآیکن

ساخت فاوآیکن ساده تر از اون چیزیه که فکر می کنید.برای ساخت اون نیاز به آشنایی مختصری با فوتوشاپ دارید.ابتدا فوتوشاپ رو باز می کنید.فاوآیکن باید یک مربع ساده باشه.سایز استاندارد فاوآیکن می تونه بین 16*16 یا 32*32 باشه.خب حالا فوتوشاپ یا هرنوع ادیتوری که این ویژگی هارو داره رو باز کنید و یک پروژه جدید با سایز 128*128 ایجاد کنید.سپس عکس رو داخل پروژه قرار بدید و پروژه رو ریسایز کنید.تغییر سایزتون می تونه به 32 در 32 باشه و به یاد داشته باشید که پرژه رو با پسوند PNGسیو کنید.چرا که در مرورگرهای امروزی این پسوند سازگاری بیشتری داره.اگه در مرورگرتون به مشکلی مثل عدم نمایش فاوآیکن برخوردید،ایراد در نسخه مرورگره.لذا بهتره برای اطمینان یافتن از کارایی فاوآیکن ریسازتون با 16*16 انجام بدید.

نحوه قرار دادن فاوآیکن در سایت:

خب اگه فاوآیکن در قالب شما پیش بینی شده که خیلی کارتون ساده تره.کافیه تصویر ادیت شده رو در قسمت favicon در تنظیمات قالب آپلود کنید.اگه این امکان در قالبتون وجود نداره باز هم مشکلی نیست.کد زیر رو در فایل header.php پیست کنید.

</pre>
<link rel="icon" href="http://www.wpbeginner.com/favicon.ico" type="image/x-icon" /><link rel="shortcut icon" href="http://www.wpbeginner.com/favicon.ico" type="image/x-icon" />
<pre>

امیدوارم این آموزش مفید واقع شده باشه براتون

منبع:بیگ تم

 

یک نظر

  1. امیر

    بسیار ممنون از شما برای این مطلب ارزشمند من تو هیچ سایتی نتونستم مشکلم رو حل کنم!

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *