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

چگونگی اضافه کردن فونت های سفارشی به قالب وردپرس

برای افزودن فونت در ابتدا باید آن فونت را در 3 و یا 4 فرمت داشته باشید. در این مطلب به عنوان نمونه فونت Iran-sans مثال زده می‌شود. فونت‌های شما باید در سه فرمت متفاوت یعنی ttf، eot و woff و در برخی موارد svgz باشد. اما نگران نباشید می‌توانید فونت مورد نظر خود را با همان فرمت رایج یعنی ttf دانلود کرده و با استفاده از سایت های مختلف آن را به فرمت های دیگر تبدیل کنید.

برای تبدیل فونت ttf به فرمت eot از آدرس https://everythingfonts.com/ttf-to-eot و برای تبدیل فونت ttf به فرمت woff از آدرس https://everythingfonts.com/ttf-to-woff استفاده کنید.

اضافه کردن فونت به قالب وردپرس

برای اینکار ابتدا قالب وردپرسی مورد نظر خود را دریافت و نصب نمایید. یک پوشه با نام fonts در داخل پوسته ایجاد کرده و در صورتی که چنین فایلی از قبل وجود داشت این کار را انجام ندهید. سپس فونت مورد نظر خود را با همان فرمت های گفته شده در بالا در این پوشه آپلود کنید. برای مثال Iran-sans.ttf ، Iran-sans.woff ، Iran-sans.eot را در این پوشه آپلود کنید.

اکنون نوبت به استایل نویسی برای این فونت ها در فایل style.css پوسته است که ما در پایین این کد را آماده سازی کردیم می توانید استفاده کنید و ان را در داخل فایل استایل پوسته خود قرار دهید.

<pre class="brush: php; title: ; notranslate" title="">@font-face {
 font-family: 'Iran-sans';
 src: url('Iran-sans.eot?#') format('eot'),
 url('Iran-sans.woff') format('woff'), 
 url('fonts/Iran-sans.ttf') format('truetype');
}
body{
font-family:Iran-sans;
}</pre>

بعد از قرار دادن کد فوق در فایل نام برده نوبت به تغییر تمامی font-family قالب است که می توانید این کلمه را جستجو و فونت را Iran-sans تغییر دهید.

مثال: اگر font-family یک بخش و تگ المان نوشته شده باشد font-family: Arial یعنی فونت این تگ یا المان Arial می باشد اینجاست که باید تغییر یابد به font-family:Iran-sans

به همین راحتی فونت سایت و قالب خود را تغییر خواهید داد حال با رفتن به صفحه ی سایت و زدن دکمه Ctrl+f5 تغییرات را مشاهده خواهید کرد.

تغییر فونت قالب حرفه ای وردپرس

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

روش دیگری که در اینجا وجود دارد نوشتن استایل سفارشی تغییر فونت قالب است.اگر دوست دارید فایل style.css را برای تغییر فونت دست کاری نکنید می توانید از روش زیر استفاده کنید.

۱) فونت ها را در سه فرمت یا چهار فرمت در پوشه fonts آپلود کنید.

۲) کد زیر را در فایل style.css قالب خود قرار دهید.

<pre class="brush: php; title: ; notranslate" title="">@font-face {
 font-family: 'Iran-sans';
 src: url('Iran-sans.eot?#') format('eot'),
 url('Iran-sans.woff') format('woff'), 
 url('fonts/Iran-sans.ttf') format('truetype');
}
body{
font-family:Iran-sans;
}

اکنون نیازی نیست تمامی font-family داخل استایل و یا rtl را سرچ و Iran-sans را جایگزین کنید؛ کافیست کد زیر را کپی و در بخش استایل سفارشی که در پنل تنظیماتی قالب قرار دارد Paste کنید.

<pre class="brush: php; title: ; notranslate" title="">body,div,p,a,h1,h2,h3,h4,h5,h6,span{
font-family:Iran-sans !important;
}

توجه: اگر این بخش یعنی استایل سفارشی در پنل تنظیماتی پوسته شما وجود نداشت می توایند در داخل فایل style.css قرار دهید.