گام اول برای انجام این کار نصب قالب و فریم ورک می باشد.
برای افزودن فونت در مرحله اول لازم است یک قالب طراحی شده با فریم ورک گانتری ۵ داشته باشیم که برای این آموزش، قالب kraken، محصولی از شرکت rockettheme را انتخاب کردیم.
پس از نصب قالب و فارسی سازی مطالب آن جهت مشاهده بهتر تغییرات فونت، مراحل افزودن فونت را شروع می کنیم.
دریافت فونت و انتقال به پوشه قالب
برای مثال قرار است فونتی با نام iransans ایجاد کنیم. به مسیر نصب قالب templates/kraken رفته و وارد پوشه custom شوید و یک پوشه جدید با نام fonts ایجاد کنید (اگر قبلا ایجاد نشده است). حال یک پوشه فرضی به نام iransans در پوشه fonts ایجاد کنید و فونتی را که دانلود کرده بودید در این پوشه کپی کنید.
معرفی به Font Picker در قالب
برای این که بتوانیم فونت را در قسمت مدیریت قالب داشته باشیم و از قسمت Font Picker فونت دلخواه خود را انتخاب کنیم، باید فونت را به theme.yaml معرفی نماییم.
از پوشه اصلی قالب به پوشه Gnatry رفته و فایل theme.yaml را با یک ویرایشگر کد باز کنید.
عبارت Font: را جستجو کرده (در قالب kraken حدود خط ۴۱) و خط زیر را طبق تصویر اضافه نمایید.
دقت کنید که iransans نام فونت ما است و فونت با این نام فراخوانی خواهد شد. عدد ۴۰۰ که در ابتدای خط نوشته شده، برای تعیین حجم فونت استفاده می شود که ۴۰۰ به معنی سایز نرمال است. پس از این مرحله می تونید در قسمت font Picker در مدیریت قالب، فونت iransans را مشاهده کنید.
اما مشکل اینجاست که حتی در صورت انتخاب فونت اضافه شده به لیست نیز تغییری در سایت ایجاد نخواهد شد و فونت iransans لود نمی شود. برای معرفی و لود فونت مورد نظر باید مراحل زیر را انجام دهید:
به پوشه custom برگردید و یک پوشه جدید به نام SCSS ایجاد کنید. حال وارد این پوشه شوید و یک فایل با نام custom.scss ایجاد کنید (در صورتی که قبلا ایجاد نشده باشد).
فایل custom.scss را با یک ویرایشگر کد باز کنید و خطوط زیر را اضافه نمایید:
در خط دوم مسیر پوشه ی تعریف فونت های پیش فرض را فراخوانی کرده و در خط سوم نیز فونتی که خودمان ایجاد کردیم را فراخوانی می کنیم.
با انجام این مراحل، فونت مورد نظر بر روی قالب پیش فرض بصورت زیر اعمال می شود.
در بعضی از قالب ها که دارای preset های مختلفی هستند، باید به مسیر
templates/rt_kraken/gantry/presets.yaml