در این مقاله قصد داریم به تغییر فونت قالب بپردازیم:
امروزه زیبایی سایت یکی از دغدغه ها طراحان سایت ها می باشد و با توجه به اینکه بیشتر طراحان از وردپرس برای سایت خود استفاده می کنند در این مقاله قصد داریم به تغییر فونت قالب در وردپرس بپردازیم :
[stextbox id=’info’ direction=’rtl’]
در ادامه به سوالات زیر پاسخ می دهیم
تغییر فونت در وردپرس چیست ؟
چگونه از افزونه های تغییر فونت قالب در وردپرس استفاده کنیم ؟
چه فونت هایی در افزونه های متداول در وردپرس وجود دارد ؟
کد تغییر فونت در وردپرس چیست ؟
[/stextbox]
تغییر فونت در وردپرس
وردپرس یک سیستم طراحی سایت می باشد که به دلیل سادگی و پشتیبانی قوی که دارد بیشتر طراحان از این سیستم استفاده میکنند . یکی از چالشی ترین کارها که برای تازه واردان در حوزه کار با وردپرس تغییر فونت قالب در وردپرس می باشد ، زیرا اکثر افراد دوست دارند فونت مخصوصی و منحصر به فردی را برای سایت خود داشته باشند
اما یک مشکلی وجود دارد آن نوشتن کد برای تغییر فونت قالب در وردپرس وجود دارد که افراد برای پیچیدگی آن سعی می کنند از افزونه ها آماده و مفید در وردپرس استفاده کنند و تغییرات لازم را بر روی سایت خود بدهند .
اگر شما قصد دارید تغییرات را بر روی سایت فارسی بدهید باید از افزونه های فارسی استفاده کنید امروزه افزونه های زیادی برای فونت های فارسی وجود دارد که در دل خود فونت های متنوعی دارند .
نحوه استفاده از افزونه های تغییر فونت قالب در وردپرس
برا این بتوانید از افزونه های تغییر فونت قالب در وردپرس استفاده کنید ابتدا باید افزونه مورد نیاز را با توجه به نیاز خود شناسایی کنید و سپس آن را دانلود کنید . دقت داشته باشید انتخاب افزونه بسیار مهم است زیرا اگر دقت نکنید شاید در ابتدا از زبان شما پشتیبانی نکند یا اینکه فونت هایی که دارد مطابق میل شما نباشد
برای همین باید کمی روی این موضوع تامل کنید بعد از انتخاب می توانید به راحتی افزونه مورد نظر را بر روی وردپرس دانلود کنید . بعد از نصب و فعال کردن افزونه در قسمت تنظیمات پیشخوان دو عدد منو اضافه می شود که یک منو فونت پیشخوان و منو دیگری فونت سایت را تغییر می دهد .
برای تغییر فونت می توانید قسمت های مختلف را به صورت جداگانه تغییر دهید که در زیر به این قسمت ها اشاره کرده ایم :
- فونت تگ های h1 تا h6 : این تگ ها را در وردپرس می توانید انتخاب کنید و فونت مربوطه را به راحتی تغییر دهید .
- فونت بدنه : می توانید با انتخاب فونت بدنه ، بدنه اصلی سایت خود را به هر فونت دلخواهی که می خواهید در آورید .
- فونت ادمین : معمولا این فونت برای اسم سایت که در صفحه اصلی در قسمت نوار ابزار وجود دارد استفاده می شود .
فونت های متداول در افزونه های تغییر فونت قالب در وردپرس
در زمان انتخاب افزونه های تغییر فونت و یا عوض کردن فونت ها باید دقت کنید که بر روی مرورگرهای فایرفاکس ، کروم و اینترنت اکسپلورر تست شده باشد و مشکلی نداشته باشند . فونت های زیادی در افزونه ها برای تغییر فونت قالب وجود دارد که در زیر به پرتکرار ترین آنها اشاره کرده ایم :
- بی اصفهان B esfehan
- بی کودک B Koodak
- بی مهسا B mahsa
- بی سینا B sina
- بی نازنین B NAZANIN
- بی یکان B yekan
- دست نویس B dast nevis
- گندم B gandom
- آی آر یکان IR yekan
- ایران سنس IRAN sans
- ایران یکان iranyekan
- ایران نستعلیق IRANnastaliq
- آریال arial
- وردانا veranda
در زیر به فرمت های استاندارد برای فونت ها اشاره کرده ایم :
- woff : این فرمت را موزیلا معرفی کرد و دارای فونت های سبک و راحت تر می باشد .
- woff2 : این نسل فشرده شده نسل woff می باشد که سریعتر عمل می کند .
- eot : این فرمت را مایکروسافت معرفی کرد و بیشتر اینترنت اکسپلورر این فرمت را پشتیبانی می کند .
- svg : این فرمت دارای حجم فایل پایین است برای همین کارایی بیشتری دارد .
- otf : این فرمت دارای ویژگی های زیادی می باشد
کد تغییر فونت قالب در وردپرس
همانطور که گفتیم دو روش برای تغییر فونت قالب در وردپرس دو روش وجود دارد یک روش استفاده از افزونه های موجود و روش دیگر استفاده از کدنویسی در وردپرس می باشد که البته این را جزء اصولی ترین راهها برای تغییر فونت قالب می باشد . تغییر فونت از طریق کد نویسی از طریق طراحی پوسته انجام می شود برای انجام این کار باید مراحل زیر انجام شود :
فونت های استاندارد و مورد نیاز با فرمت های ttf , woff , eot , svg , otf , woff 2 می باشد که در پوشه فونت در کنار فایلهای پوسته می توانید آپلود کنید .
در این گام باید دستور font-face را در فایل یا پوشه style.css فراخوانی کنید .
هر قسمتی از پوسته که مدنظرمان می باشد را با دستور font-family در دستور فونت فیس فراخوانی کرده و سپس تغییر می دهیم .
کدهایی که در دستور فونت فیس وجود دارد به صورت زیر می باشد :
@font-face {
font-family: ‘EMoji’;
src: url(‘EMoji.eot?’) format(‘eot’);
url(‘WMoji.woff’) format(‘woff’),
url(‘WMoji.ttf’) format(‘truetype’);
}
همچنین می توانید سبک ها و وزن های مورد نیاز را برای فونت مورد نظر انتخاب کنید :
[stextbox id=’info’]
@font-face {
font-family: ‘Open Sans’;
font-style: normal;
font-weight: 400;
src: local(‘Open Sans’), local(‘OpenSans’), url(https://themes.googleusercontent.com/static/fonts/opensans/v8/
cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format(‘woff’);
}
@font-face {
font-family: ‘Open Sans’;
font-style: normal;
font-weight: 700;
src: local(‘Open Sans Bold’), local(‘OpenSans-Bold’), url(https://themes.googleusercontent.com/static/fonts
/opensans/v8/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff) format(‘woff’);
}
@font-face {
font-family: ‘Open Sans’;
font-style: italic;
font-weight: 400;
src: local(‘Open Sans Italic’), local(‘OpenSans-Italic’), url(https://themes.googleusercontent.com/static/fonts
/opensans/v8/xjAJXh38I15wypJXxuGMBobN6UDyHWBl620a-IRfuBk.woff) format(‘woff’);
}
@font-face {
font-family: ‘Open Sans’;
font-style: italic;
font-weight: 700;
src: local(‘Open Sans Bold Italic’), local(‘OpenSans-BoldItalic’), url(https://themes.googleusercontent.com/static/fonts/
opensans/v8/PRmiXeptR36kaC0GEAetxjqR_3kx9_hJXbbyU8S6IN0.woff) format(‘woff’);
}
[/stextbox]
و بعد از مراحل بالا می توانید هر زمانی که نیاز دارید از این فونت ها استفاده کنید :
1 {
font: 700 italic ‘Open Sans’, sans-serif;
}
p {
font-family: ‘Open Sans’, sans-serif;
}
p .note {
font-style: italic;
}
نتیجه گیری
یکی از امکانات وردپرس این است که شما می توانید به راحتی افزونه های را اضافه کنید و برای تغییر فونت از آنها استفاده کنید همچنین یک راه دیگر برای تغییر فونت در سایت ها کدنویسی می باشد .
