وب آموز : از فونت های دلخواه خود در سایتتان استفاده کنید

[vahab00]

سلام دوستان
نمیدونم این آموزش قبلا اینجا ذکر شده یا نه اما من هم مینویسم . امیدوارم مورد رضایت شما قرار بگیره

معمولا در خیلی از موارد برایتاش پیش آمده است که بخواهید از فونت های دلخواه خود در سایتتان استفاده نمایید و معمولا جهت استفاده از آن کاربران مبتدی تنها فونت مورد نظر خود را تعریف خواهند کرد

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

اما در این صورت چه باید کرد ؟

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

برای اینکار باید فونت مورد نظر خود را به چهار فرمت زیر تبدیل کنیم

woff , svg , eot , ttf

برای تبدیل فونت های خود به فرمت های بالا باید از یک کنورتر استفاده کنید ک پیشنهاد من استفاده از سایت زیر می باشد

تبدیل فونت ها

در این سایت ابتدا فونت خود را از گزینه add fonts انتخاب میکنید

پس از انتخاب و آپلود شدن در سایت گزینه Download Your Kit فعال میشه که میتونید فونت آماده خودتون رو دانلود کنید

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

لازم به ذکر است در فایل استایل شیت ک این سایت برای دانلود بهتون داد کد های زیر قرار داره و تنها کافیه ک کد رو تو استایل قالبتون بزارید و فایل های فونت ها رو هم در پوشه قالبتون قرار بدید

سپس در فایل استایل خود کدهای زیر را تعریف میکنید تا فونت مورد نظر شما در سیستم مورد نظر کاربر آپلود شود (بالا توضیح دادم که سایت بالا بهتون بصورت آماده میده)

@font-face {
    font-family: 'fontname';
    src: url('fontname.eot');
    src: url('fontname.eot?#iefix') format('embedded-opentype'),
         url('fontname.woff') format('woff'),
         url('fontname.ttf') format('truetype'),
         url('fontname.svg#fontname') format('svg');
    font-weight: normal;
    font-style: normal;

} 

پس از قرار دادن کد بالا باید کلمه fontname رو با نام فونت های موجود خود تغییر نام بدید و در هرجایی از سایتتان که خواستید از این فونت استفاده نمایید

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

منبع : وب آموز - از فونت های دلخواه خود در سایتتان استفاده کنید

یا حق