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

3
به کمک روش های طراحی سایت بدون کدنویسی کار طراحی سایت خیلی راحت تر شده اما همچنان دانستن css و html تا حدی لازم است تا برخی از مشکلات سایت را بتوانیم بهتر حل کنیم ، یکی از همین مشکلات قرار دادن فونت دلخواه در سایت است که در ویدئو زیر به دو روش آموزش دادم

 

 

در این آموزش میخواهیم فونت بی یکان را  به قالب سایتمان اضافه کنیم.  ابتدا یک پوشه به نام fonts در پوشه قالب بسازید و هر سه فونت BYekan.ttf – BYekan.woff – BYekan.eot را در این پوشه آپلود کنید.

بعد از آپلود  کد زیر را در فایل style.css  قالب سایتتان کپی کنید:

نکته : باید فایل style.css و  فلدر fonts در کنار هم باشند

@font-face {
font-family: ‘BYekan’;
src: url(‘fonts/BYekan.eot?#’) format(‘eot’),
url(‘fonts/BYekan.woff’) format(‘woff’),
url(‘fonts/BYekan.ttf’) format(‘truetype’);
}
body{
font-family:BYekan;
}

 

حال کافی است هر جا دستور font-family  در قالب هست مقدار Byekan را به صورت زیر به آن اضافه کنیم

h1{
 	font-family: 'Byekan';
	font-size:14px;
}

 

فونت فارسی

نکته : برای اینکه فونت در تمام مرورگرها به درستی نمایش داده شود نیاز به فرمت های ttf ، eot و woff فونت میباشید.

  • پسوند eot: مخصوص مرورگر IE
  • پسوند ttf: فرمت استاندارد فونت میباشد و به غیر از اینترنت اکسپلورر بیشتر مرورگرها از این فرمت پشتیبانی می‌کنند.
  • پسوند woff:  این فرمت بیشتر توسط مرورگرهای مدرن و اینترنت اکسپلورر ۹ به بعد پشتیبانی می‌شود.

دانلود فونت Byekan

 

همپنین به کمک افزونه Font farsi  در وردپرس میتوانید بدون نیاز به موارد فوق فونت دلخواه خودتان را نصب کنید

 

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

 

در همین زمینه ببینید :

طراحی سایت حرفه ای با قالب محبوب پابلیشر

 

 

ممکن است شما دوست داشته باشید
3 نظرات
  1. احمدرضا می گوید

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

    1. میثم همتی می گوید

      پیشنهاد میکنم اول آموزش html و css رو از بخش زیر ببنید

      مشکل اصلیتون در آدرس دهی تگ ها برای شناخت فونت است

      https://behinwebdesign.com/html-css/

      1. احمدرضا می گوید

        درود به شما آقای همتی عزیز،
        عالی بود خیلی لذت بردم…

ارسال یک پاسخ

آدرس ایمیل شما منتشر نخواهد شد.

این سایت توسط reCAPTCHA و گوگل محافظت می‌شود حریم خصوصی و شرایط استفاده از خدمات اعمال.