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

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

این آموزش رایگان می باشد

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

وقتی قالبی را تهیه میکنیم و نصب میکنیم با توجه به قالب و طراحی که انجام شده طراح قالب فونتی را در نظر گرفته و با توجه به اینکه اکثر قالب های موجود انگلیسی هستند از فونت های انگلیسی  در طراحی قالب استفاده شده که برای ما که از فارسی  استفاده میکنیم خیلی خوشایند نیست و ظاهر جالبی نداره.برای همین یکی از کارهایی که ما باید برای زیباتر شدن سایت خود انجام دهیم استفاده از فونت‌های فارسی هست.

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

 

فونت ها در وب چند نوع هستند که با فرمت های مختلف وجود دارد. لیست این فونت را در زیر میتوانید مشاهده کنید.

  • پسوند eot : از این فرمت مرورگر اینترنت اکسپلورر (IE) استفاده میکنه که به صورت پیش فرض روی ویندوز وجود داره ولی خب امروزه استفاده از آن بسیار کم شده.
  • پسوند ttf : این فرمت از نوع های قدیمی هست که در ویندوز و در وب استفاده می شود و تقریبا تمامی مرورگرها از این فونت پشتیبانی میکنند.
  • پسوند woff : این فزمت امروزه تقریبا همه مرورگرها به رسمیت می شناسند و از این نوع پشتیبانی میکنند.
  • پسوند woff2 : این نوع نسخه تکامل یافته WOFF هست که در این نوع فونت بهینه تر شده و در نتیجه حجم فونت کمتر از فونت های قبل شده و این موضوع باعث تسریع در لود و در نتیجه سرعت بیشتر سایت خواهد شد.

نحوه پشتیبانی فونت ها را در تصویر زیر میتوانید مشاهده نمایید.

font_browser

 

برای افزودن فونت دلخواه به سایت وردپرسی، دو راه وجود دارد 1-افزودن فونت با کمک افزونه 2- افزودن فونت دستی و با افزودن کد

1- افزودن فونت دلخواه با افزونه

برای اینکار تا مدتی پیش افزونه‌ای با نام Use Any Font وجود داشت که ظاهرا تصمیم به پولی کردن این افزونه گرفتن و برای استفاده از این افزونه باید هزینه ای بپردازید. افزونه دیگری برای این کار منشتر شده با نام Custom Fonts که میتوانید از آن استفاده کنید.

2- افزودن فونت دلخواه بدون افزونه و به صورت دستی

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

ما برای آموزش از فونت تجاری ایران سنس استفاده خواهیم کرد.

پس ابتدا فونت مورد نظر را تهیه کنید که بهتر است شامل سه نوع ttf , eot , woff  باشد.

وارد هاست خود شوید و به پوشه قالب خود برید که در مسیر قرار دارد

پوشه قالب سایت شما \ wp-content\themes

در این مسیر فایلهای فونت را در پوشه fonts آپلود کنید (اگر این پوشه وجود نداشت این پوشه را بسازید)

سپس در همان مسیر فایل style.php را پیدا کنید و برای ویرایش باز کنید.

 

font style cudtom font - آموزش افزودن فونت دلخواه به سایت وردپرسی

و در این فایل کدهای زیر را اضافه کنید و ذخیره کنید.

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

حال باید تعیین کنیم که کدام قسمت ها از این فونت استفاده کند.برای این کار مانند کد زیر استفاده میکنیم

body {
font-family: iransans;
}

در این کد ما گفته ایم که هرچیزی که درون بدنه سایت ما هست از فونت ایران سنس استفاده کند و اگر بخواهیم مثلا بخش هایی که تگ H2 دارند از این فونت استفاده کنند.در این صورت باید به این شکل بنویسیم.

h2{
font-family: iransans;
}

اگر میخواهید بخش های مختلفی را انتخاب کنید می توانید به صورت ترکیبی بنویسید. به مثال زیر توجه کنید که گفته شده بخش هایی که h2 یا h1 یا p یا a یا درون body قرار دارند از فونت iransans استفاده کند.

body,h2,h1,p,a {
font-family: iransans;
}

برای درک بهتر مطالب گفته شده حتما آموزش ویدیویی افزودن فونت دلخواه را مشاهده کنید.

 

برای دانلود این آموزش کلیک کنید

حسین پارسافرد

50 دقیقه

دانلودی

دارای گارانتی بازگست وجه-اطلاعات بیشتر

محصولات مرتبط

نقد و بررسی‌ها

هیچ دیدگاهی برای این محصول نوشته نشده است.

اولین کسی باشید که دیدگاهی می نویسد “آموزش افزودن فونت دلخواه به سایت وردپرسی”

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

رایگان
فهرست