استفاده از آیکن های زیبا در طراحی وب

فونت آیکون

در صفحه­ ساز ویژوال کامپوزر، المان آیکون را جستجو کنید. المان­ های مختلفی از آیکون برای نمایش استفاده می­کنند که شما می ­توانید بر اساس نوع طراحی خود این المان ­ها را انتخاب کنید.

حال برای توضیح روند اضافه کردن آیکون، ما المان “آیکون” را انتخاب و به صفحه­ ساز اضافه می­کنیم. در صفحه تنظیمات آیکون، از بین کتابخانه­ هایی که برای آیکون وجود دارد یکی را انتخاب نمایید( برای مثال کتابخانه معروف Font Awesome را از جعبه بازشونده کتابخانه­ ها کلیک کنید). سپس از “جعبه آیکون”، آیکون مورد نیازتان را انتخاب کنید. همچنین تنظیماتی مثل ترازبندی آیکون، اندازه و … را نیز می ­توانید تغییر دهید.

برای یک مثال دیگر، در المان “باکس آیکون” شما می­بایست نام آیکون را از لینک لیست آیکون­ های سایت Font Awesome انتخاب کرده و در جعبه مشخص شده، نام آیکون را وارد نمایید.

ذکر این نکته لازم است که سایت https://fontawesome.com/  محدود بوده و باید از برنامه­ های رفع فیلتر استفاده کنید.

پس از اضافه کردن آیکون و ذخیره تغییرات، این المان­ ها به سایت اضافه می­شود.

آیکون تصویری

معمولاً المان ­های Ultimate Addons، قسمتی برای اضافه کردن آیکون دارند. المان “باکس اطلاعات” را در نظر بگیرید. در صفحه تنظیمات این المان، قسمت “آیکون برای نمایش”، گزینه آیکون تصویر را انتخاب نمایید. پس از آن می­بایست تصویر آیکون را آپلود کنید. شما می­توانید از سایت flaticon.com، تصاویر مختلفی از آیکون­ ها را مشاهده و دانلود نمایید.

(سایت flaticon.com محدود بوده و برای مشاهده و دانلود آیکون باید از ابزارهای رفع فیلتر استفاده کنید.) نام آیکون یا دسته­ بندی آیکون مورد نظر خود را در جعبه جستجو در سایت flaticon.com جستجو کرده و از بین آیکون­ های نمایشی، آیکون مورد نیازتان را انتخاب و دانلود کنید.

حال تصویر آیکون را در صفحه تنظیمات المان باکس اطلاعات آپلود کنید. با استفاده از سایر تنظیمات می­توانید برای آیکون عنوان، توضیحات، انیمیشن و … اضافه کنید.

پس از ذخیره تنظیمات، آیکون­ های تصویری و جذابی که به سایتتان اضافه کردید را در مرورگر مشاهده کنید.