پرش به مطلب اصلی

ظاهر سایت

انتخابگر آیکون​

برای تغییر فونت‌آیکون و تصاویر استاتیک سایت می‌توانید از این ابزار استفاده کنید.نحوه کار به این صورت است که آیکون‌هایی که این قابلیت را دارند یک نقطه قرمز رنگ در حالت ویرایش روی آنها نمایش داده میشود. وقتی موس را روی آن ببرید یک باکس نمایش داده میشود که حاوی یک دکمه برای انتخاب آیکون جدید است. با کلیک رو این دکمه صفحه انتخابگر آیکون نمایش داده می‌شود.

نکته

در حال حاضر این امکان برای هدر سایت در حالت دسکتاپ و ویندوز و ناوبری پایین موبایل فعال شده است و به زودی برای صفحه محصول نیز قابل استفاده خواهد بود.

SVG پیشفرض​

  • در این قسمت می‌توانید از SVG های پیشفرض اسکریپت استفاده نمایید. این حالت ساده ترین نوع تغییر آیکون مورد نظر می‌باشد که تنها کافیست روی آیکون مورد نظر کلیک کرده و در پایین صفحه دکمه انتخاب را بزنید
    نکته

    در قسمت استایل پیشفرض استایل دهی پیشفرض آیکون یا تصویر قرار دارد که به عنوان راهنما قرار داده شده است. شما می‌توانید از قسمت برای تغیر مقادیر زیر روی ویرایش کلیک کنید. استایل مورد نظرخودتان را به آیکون یا تصویر مورد نظر اعمال کنید.

برای SVG پیشفرض قرار دادن سه استایل زیر ضروری است.

{
    width: 25px;
    height: 25px;
    fill: red;
}

semantic icons​

  • فایل‌های کتابخانه fomantic-ui به صورت پیشفرض در اسکریپت لود شده است. شما برای استفاده از آیکون‌های این کتابخانه نیز می‌توانید کلاس مورد نظر را از لینک fomantic-ui در باکس class قرار دهید.

SVG دلخواه​

  • برای استفاده از این نوع آیکون کافیست کد html فایل svg را در قسمت svg / html قرار دهید.
    نکته

    دقت داشته باشید فقط از ابتدا تا انتهای تگ svg را وارد کنید و از قرار دادن سایر تگها و کامنت ها خودداری نمایید. همچنین دقت کنید که ابعاد و رنگ فایل را نیز مشخص کرده باشید .

اطلاع

آموزش نحوه دریافت SVG از سایت های مرتبط

Fontawesome​

  • برای استفاده از این آیکون ها ابتدا باید تگ زیر را در داشبورد مدیریت ⬅ تنظیمات پیشرفته ⬅ شخصی سازی و در قسمت مشخص شده برای تگ های دلخواه برای افزودن به اسکریپت وارد نمایید تا کتابخانه مورد نظر در اسکریپت بارگذاری شود .
<link href="/pages/css/font-awesome.css" rel="stylesheet" as="style">

پس از آن کافیست از سایت Fontawesome فقط نام کلاس را در قسمت class وارد نمایید به طور مثال : fa-thin fa-house

flaticon​

  • برای استفاده از این آیکون ها ابتدا باید تگ زیر را در داشبورد مدیریت ⬅ تنظیمات پیشرفته ⬅ شخصی سازی و در قسمت مشخص شده برای تگ های دلخواه برای افزودن به اسکریپت وارد نمایید تا کتابخانه مورد نظر در اسکریپت بارگذاری شود .
<link href="/pages/css/fonts/flaticon/flaticon.css" rel="stylesheet" as="style">

پس از آن کافیست از لینک قرار داده شده در بالای صفحه فقط نام کلاس را در قسمت class وارد نمایید به طور مثال : flaticon-bag

نکته

دقت داشته باشید برای تغییر سایز این نوع آیکون باید سایز فونت را تغییر دهید . کلاس‌های fs-1 برای بزرگترین سایز و fs-10 برای کوچکترین سایز در اسکریپت قابل استفاده می‌باشد. به طور مثال : flaticon-bag fs-7

Material Icon​

  • برای استفاده از این نوع آیکون در سایت مربوطه خروجی svg از آیکون مورد نظر تهیه کنید و محتوای فایل دانلود شده را در تب svg قرار دهید.

remix Icon​

  • برای استفاده از این نوع آیکون در سایت مربوطه خروجی svg از آیکون مورد نظر تهیه کنید و محتوای فایل دانلود شده را در تب svg قرار دهید.

کتابخانه​

  • در این روش می‌توانید هر فایل تصویری را از کتابخانه تصاویر خود انتخاب نمایید.
    هشدار

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