چگونه فونت ایرانی (BYekan) را به وردپرس اصافه کنیم؟

[سیدرضا بازیار]

دوست عزیز اگر بدرستی انجام بدید هیچ مشکلی برای قالب پیش نمیاد.
فقط در صورتی که آپدیت کنید تغییرات از بین می ره. اگر میخواید طبق استاندارها انجام بدید فایل rtl.css ایجاد کنید. در تنظیمات وردپرس هم rtl تنظیم کنید تا این فایل در خروجی ظاهر شود.
روش های مختلفی وجود داره مثل استفاده از تابع wp_enqueue_style یا ...
بستگی قالب شما به چه صورتی کد نویسی شده هست و اینکه آیا از اصول localization وردپرس پیروی میکنه یا خیر
ضمنا اگر مخاطبین شما ایرانی هست پیشنهاد میکنم کلا گوگل فونت رو غیر فعال کنید ! به دلیل شبکه عجیب و غریب ایران بارگذاری منابع https مثل گوگل فونت در بعضی موارد تا چند دقیقه طول میکشه و سرعت سایت شما رو خیلی کند میکنه. کتابخونه ها رو دانلود و در هاست خودتون نگهداری کنید ( بر خلاف همه دنیا که استفاده از این cdn ها مزیت هست !!! )
اگر اصرار بر استفاده از google fonts رو دارید می تونید با استفاده از توابع جاوااسکریوت منابع رو اضافه کنید ولی این منابع در پنل ادمین شما ظاهر نمیشند و باید باز هم دستی اعمال کنید !

روش شما رو قبلا انجام دادم و هرگز عمل نمیکنه
هر روشی هم امتحان کردم نشد

[Rezash]

روش شما رو قبلا انجام دادم و هرگز عمل نمیکنه
هر روشی هم امتحان کردم نشد

هموطنور که عرض کردم بستگی به قالب و شرایط کد نویسی شما داره
روش هایی که عرض کردم رو حداقل روی ۲۰۰ قالب مختلف وردپرسی پیاده کردم.
مطمین باشید یکی از مراحل رو اشتباه میرید ( کش - کامپایل مجدد css و ...)

[سیدرضا بازیار]

هموطنور که عرض کردم بستگی به قالب و شرایط کد نویسی شما داره
روش هایی که عرض کردم رو حداقل روی ۲۰۰ قالب مختلف وردپرسی پیاده کردم.
مطمین باشید یکی از مراحل رو اشتباه میرید ( کش - کامپایل مجدد css و ...)

کد در حالت اولیه اجرا نمیشد تا اینکه کد رو به زیر تبدیل کردم

@font-face {
    font-family: 'BYekan',Tahoma;
    src: url('http://kazerun.info/wp-content/themes/kleo/fonts/BYekan.eot?#') format('eot'),
    url('http://kazerun.info/wp-content/themes/kleo/fonts/BYekan.woff') format('woff'), 
    url('http://kazerun.info/wp-content/themes/kleo/fonts/BYekan.ttf') format('truetype');
font-weight: normal;  
}
*{
    font-family: 'BYekan',Tahoma;
  font-size: 14px;
}
.h1 site-title { 
font-family: 'BYekan',Tahoma; 
}
.h2 site-title { 
font-family: 'BYekan',Tahoma; 
}
.h3 site-title { 
font-family: 'BYekan',Tahoma; 
}
.h4 site-title { 
font-family: 'BYekan',Tahoma; 
}
.h5 site-title { 
font-family: 'BYekan',Tahoma; 
}
.h6 site-title { 
font-family: 'BYekan',Tahoma; 
}

بخش * در ابتدا body گذاشتم و این مورد باعث شد که روی index عمل نکنه. وقتی تبدیلش کردم به * درست شد

این روش هم باعث میشه همه متن ها به 14 پیکسل تغییر کنند حتی هدینگ ها

راه حل چشه؟

[Rezash]

کد در حالت اولیه اجرا نمیشد تا اینکه کد رو به زیر تبدیل کردم

@font-face {
    font-family: 'BYekan',Tahoma;
    src: url('http://kazerun.info/wp-content/themes/kleo/fonts/BYekan.eot?#') format('eot'),
    url('http://kazerun.info/wp-content/themes/kleo/fonts/BYekan.woff') format('woff'), 
    url('http://kazerun.info/wp-content/themes/kleo/fonts/BYekan.ttf') format('truetype');
font-weight: normal;  
}
*{
    font-family: 'BYekan',Tahoma;
  font-size: 14px;
}
.h1 site-title { 
font-family: 'BYekan',Tahoma; 
}
.h2 site-title { 
font-family: 'BYekan',Tahoma; 
}
.h3 site-title { 
font-family: 'BYekan',Tahoma; 
}
.h4 site-title { 
font-family: 'BYekan',Tahoma; 
}
.h5 site-title { 
font-family: 'BYekan',Tahoma; 
}
.h6 site-title { 
font-family: 'BYekan',Tahoma; 
}

بخش * در ابتدا body گذاشتم و این مورد باعث شد که روی index عمل نکنه. وقتی تبدیلش کردم به * درست شد

این روش هم باعث میشه همه متن ها به 14 پیکسل تغییر کنند حتی هدینگ ها

راه حل چشه؟

* به معنی selector همه هست. یعنی همه المنت ها در صفحه رو گفتید فونتشون Byekan و سایزشون 14 باشند.
اگر فقط مشکل سایز هست font-size رو حذف کنید.
ولی برای اینکه قالب ظاهر مناسبی داشته باشه باید font-family و font-size رو بسته element بهش بدید
یعنی در قسمت های مختلف بگردید و هر جا font-family رو میخواید بدید به همون قسمت از کد بدید نه به کل المنت ها
با اینکار شما اگر از کتابخونه هایی مثل font awesome یا ... استفاده کنید آیکن ها و ... بهم میریزند