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

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

هموطنور که عرض کردم بستگی به قالب و شرایط کد نویسی شما داره
روش هایی که عرض کردم رو حداقل روی ۲۰۰ قالب مختلف وردپرسی پیاده کردم.
مطمین باشید یکی از مراحل رو اشتباه میرید ( کش - کامپایل مجدد 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 یا ... استفاده کنید آیکن ها و ... بهم میریزند