فاو آیکن در وردپرس
Favicon یک تصویر بسیار کوچک یا آیکون است که به عنوان علامت اختصاری سایت در نوار کناری مرورگر اینترنت و در کنار آدرس سایت یا وبگاه به کار برده و ظاهر می شود. فاو آیکون در محل نمایش Bookmark ها نیز در کنار نام صفحه نشان داده میشود.
favicon به یک سایت هویت می بخشد و قابلیت استفاده سایت و نیز تجربه کاربران را بهبود می بخشد. تصویر زیر برای درک این مطلب به شما کمک می کند :
اکثر کاربران اغلب زبانه های زیادی در پنجره مرورگر خود باز می کنند. این سبب می شود عنوان وب سایت به دلیل تعداد زیاد زبانه ها و کمبود فضا نمایش داده نشود. فاو آیکون به کاربران امکان شناسایی وب سایت را می دهد و کاربر می تواند به سرعت به برگه ای که می خواهد رجوع کند. علاوه بر موارد بالا صاحبان سایتها می توانند از کاربران خود بخواهند که سایت آنها را به صفحه اصلی دستگاه تلفن همراهشان اضافه کنند. در واقع یکی از کارکردهای نماد سایت یا فاو آیکون زمانی است که یک کاربر سایتی را به صفحه اصلی دستگاه تلفن همراه خود بوسیله نماد سایت به عنوان نماد برنامه، اضافه می کند.
برای اضافه کردن فاوآیکون در وردپرس چندین راه مختلف وجود دارد
- افزودن فاوآیکون در وردپرس با استفاده از تنظیمات قالب
- اضافه کردن فاو آیکون به نسخه های قدیمی تر وردپرس
- افزودن فاوآیکون در وردپرس با استفاده از کدنویسی
- افزودن گراواتار به عنوان فاوآیکون در وردپرس
قبل از اینکه بخواهیم تا آیکون مورد نظر برای افزودن به وردپرس را انتخاب کنیم لازم فاوآیکون در اندازه استاندارد طراحی شده باشد. بنابراین اگر لوگو سایت خودتون را طراحی کردید با استفاده از یک نرمافزار ویرایشگر تصاویر مثل فتوشاپ در سیستم عامل ویندوز و یا Gimp در سیستم عامل گنو/لینوکس لوگو مورد نظر خودتون را باز کرده و اونو با اندازه ۱۶*۱۶ پیکسل تغییر اندازه داده و با فرمت png. ذخیره کنید.
افزودن فاوآیکون به وردپرس از تنظیمات قالب
برای اضافه کردن favicon به وردپرس با استفاده از تنظیمات قالب وردپرس باید این امکان در تنظیمات قالب تعریف شده باشد. شاید امکان اضافه کردن فاوآیکون در قالب شما وجود نداشته باشد بنابراین اگر چنین نبود می توانید تا از روش کدنویسی استفاده کنید. برای این مورد ابتدا وارد پیشخوان وردپرس شده و سپس به مسیر نمایش> سفارشی سازی مراجعه کنید. بعد از اینکه صفحه سفارشی سازی برای شما باز شد مشابه تصویر زیر روی دکمه هویت سایت کلیک کنید تا وارد بخش مربوط به تغییر فاوآیکون در وردپرس شوید.
بعد از کلیک روی گزینه هویت سایت مشابه تصویر زیر با این صفحه مواجه خواهید شد، حالا کافیه تا از بخش انتخاب تصویر که در قسمت نمادک سایت قرار داره تصویر فاوآیکون دلخواه خودتون را که در اندازه ۱۶*۱۶ پیکسل آماده کردید را انتخاب کرده و آپلود کنید. در نهایت بعد از آپلود شدن فایل روی دکمه ذخیره کلیک کنید تا فاوایکون مورد نظر به سایت شما اضافه شود.
از نسخه ۴٫۳ وردپرس به بالا می توان نماد فاو آیکن یا سایت را از منطقه مدیریت وردپرس اضافه کرد. کافیست به Appearance » Customize و روی برگه « Site Identity »کلیک کنید.
بخش site identity در Customizer به شما این امکان را می دهد که عنوان سایت، توضیحات و کنترل سایت را تغییر دهید و در صورتی که مایل نباشید آنها را در هدر نمایش دهید، می توانید گزینه نمایش را برای آنها غیر فعال کنید، کافیست تیک جعبه کنار گزینه Display Header Text را بردارید. همچنین در این بخش می توانید آیکون سایت خود را آپلود کنید. برای انجام این کار باید روی دکمه select file کلیک کنید و سپس تصویری را که می خواهید به عنوان نماد سایت استفاده کنید آپلود کنید.
اگر اندازه تصویر بیش از اندازه ای که توصیه شده باشد، وردپرس به شما اجازه می دهد تا آن را برش بزنید. اگر دقیقا مطابق اندازه توصیه شده باشد، فقط می توانید تغییراتتان را ذخیره کنید. اکنون می توانید پیش نمایش سایت خود و فاو آیکون آن را در عمل مشاهده کنید. همچنین کاربران هر سایت می توانند آن را بر روی دستگاه تلفن همراه مشاهده کنند و سپس از منوی مرورگر گزینه “افزودن به صفحه اصلی” را انتخاب کنند تا نماد آن سایت بر روی صفحه اصلی گوشی ظاهر شود.
اضافه کردن فاو آیکون به نسخه های قدیمی تر وردپرس
پس از ساخت Favicon خود آن را به دایرکتوری ریشه وب سایت خود از طریق FTP آپلود کنید. سپس این کد را در فایل header.php تم خود قرار دهید.
link rel=”icon” href=”https://www.example.com/favicon.png” type=”image/x-icon” />
<link rel=”shortcut icon” href=”https://www.example.com/favicon.png” type=”image/x-icon” />
اگر دوست ندارید از FTP استفاده کنید، می توانید از افزونه ای به نام All in One Favicon استفاده کنید.
افزودن فاوآیکون به وردپرس با کدنویسی
در این روش باید از طریق کدنویسی اقدام به اضافه کردن فاوآیکون در وردپرس کنید. ابتدا وارد هاست خود شده و به مدیریت فایل هاست که با کلیک روی گزینه File Manager قابل دسترسی است مراجعه کنید.
بعد از اینکه وارد محیط مدیریت فایل در هاست خود شدید به مسیر /public_html/wp-content/themes/ مراجعه کرده و سپس وارد پوشه قالبی که روی سایت شما فعال هستش مراجعه کنید. حالا در این مرحله با کلیک روی دکمه Upload که در بالای صفحه قرار دارد تصویر فاوآیکون خودتون را که با عنوان favicon.png ذخیره کردید در مسیر اصلی پوشه قالب آپلود کنید. سپس در همین مسیر به دنبال فایلی با نام header.php بگردید و بعد از یافتن فایل روی اون راست کلیک کرده و گزینه Edit را انتخاب کنید. با انتخاب این گزینه وارد صفحه ویرایش فایل خواهید شد که میتونید کدهای این فایل را تغییر دهید. حالا کافیه تا کد زیر را درست بین دو تگ <title></title> قرار داده و فایل را ذخیره کنید.
<link rel=”shortcut icon” href=”favicon.png”/>
با اضافه کردن قطعه کد بالا تصویر favicon.png به عنوان فاوآیکون صفحات در وردپرس انتخاب شده و در تمامی صفحات به نمایش در خواهد آمد.
افزودن گراواتار به عنوان فاوآیکون در وردپرس
برخی کاربران تمایل دارند تا تصویر گراواتار را به عنوان فاوآیکون در وردپرس نمایش دهند. همانطور که می دانید گراواتار به عنوان یک سایتی است که متعلق به شرکت وردپرس بوده و با استفاده از اون قادر خواهید بود تا برای ایمیل های خود یک تصویر آواتار انتخاب کنید. حالا در هر سایتی که از گراواتار پشتیبانی کند اگر از این ایمیلها استفاده کنید، تصویر گراواتار شما در سایت مورد نظر نمایش داده خواهد شد. برای اینکه این تصویر را به عنوان فاوآیکون در وردپرس انتخاب کنید کافی تا قطعه کد زیر را در فایل فانکشن قالب خودتون قرار دهید. برای این منظور در همین حین که در مسیر پوشه قالب فعال در روی سایت خودتون که در مسیر /public_html/wp-content/themes/ قرار دارد به دنبال فایلی با نام functions.php بگردید و سپس با راست کلیک کردن روی فایل و انتخاب گزینه Edit وارد محیط ویرایشگر فایل فانکشن قالب شده و کدهای زیر را در مکان مناسبی از اون قرار دهید.
function dcg_gravatar_favicon() {
// Replace email here
$GetEmailHash = md5(strtolower(trim(‘mail@yoursite.com’)));
?>
<link rel=”shortcut icon” href=”<?php echo ‘http://www.gravatar.com/avatar/’ . $GetEmailHash . ‘?s=16;’; ?>” type=”image/x-icon” />
<?php
}
add_action(‘wp_head’, ‘dcg_gravatar_favicon’);
به جای mail@yoursite.com هم ایمیل خودتون را که برای اون تصویر گراواتار تعیین کردید را وارد کنید. حالا در این صورت تصویر گراواتار مورد نظر در اندازه ۱۶*۱۶ به عنوان فاوآیکون در سایت نمایش داده خواهد شد.
مطالب مرتبط:
ارسال فایل در بخش دیدگاه های وردپرس با افزونه Comment Attachment
درباره Mostafa Shoa
مدیر تیم پارس نویس، کارشناس مهندسی نرم افزار، مدرس دوره های برنامه نویسی و طراحی سایت در مدارس تیزهوشان، مشاور تبلیغات و بازاریابی استارتاپ ها و کسب و کارهای اینترنتی
نوشته های بیشتر از Mostafa Shoa
دیدگاهتان را بنویسید