میزبان فا

جلسه 15: افزودن فونت فارسی به قالب وردپرس + آموزش ویدیویی

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

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

اکثر قالب های وردپرسی که ما دریافت می کنیم ، مخصوصا قالب هایی که از سایت تم فارست خریداری می کنیم یا قالب هایی که از مخزن اصلی وردپرس دانلود می کنیم دارای فونت فارسی نیستند. فونت های پیشفرض این قالب ها Tahoma یا TimesNewRoman یا فونت های عربی هستند. امروز قصد داریم به شما میهن وردپرسی ها نحوه افزودن فونت فارسی به قالب وردپرس را آموزش دهیم.

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

آماده سازی فونت فارسی برای استفاده در قالب

در ابتدای کار شما نیاز به آماده سازی سه فرمت از فایل فونت خود دارید. شما باید فرمت های ttf ، eot و woff فونت خود را داشته باشید. پس ابتدا به دنبال فرمت ttf که فرمت اصلی فونت هست در وب بگردید. مثلا سرچ کنید: دانلود فونت بی یکان فارسی

بعد از دانلود فرمت ttf می توانید با استفاده از ابزار تبدیل ttf به eot آنرا به BYekan.eet تبدیل کرده و با استفاده از ابزار تبدیل ttf به woff آنرا به BYekan.woff تبدیل کنید. ( البته برای راحتی کار شما عزیزان هر سه فرمت فونت بی یکان را آماده کرده ایم و می توانید از انتهای همین صفحه دانلود کنید. )

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

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

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

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

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

 

حالا کافیست در فایل style.css  قالب جستجو کرده و font-family های قالب را تغییر دهید.

مثلا اگر جایی از این فایل نوشته شده بود font-family: Tahoma یعنی فونت این المان Tahoma هست. پس می توانید آنرا به font-family:BYekan تغییر دهید.

حالا سایت وردپرسی خود را باز کرده و با زدن ctrl+f5 خواهید دید که فونت زیبای یکان به سایت شما اضافه شده!

موفق و پیروز باشید…

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

راستی! برای دریافت مطالب وردپرسی در کانال تلگرام میهن وردپرس عضو شوید.

این آموزش قسمتی از آموزش وردپرس از ابتدا تا انتها می باشد. شما می توانید در دوره آموزش کامل کار با وردپرس٬ دوره را کامل تر مشاهده نمایید و مدرک وردپرس دریافت کنید. پکیج آموزش کامل وردپرس

پکیج های آموزشی

نظرات کاربران

avatar
مرتب سازی براساس:   جدیدترین | قدیمی ترین
powerport20
powerport20

سلام. امکانش هست آموزش افزودن فونت به ویرایشگر tinymce advanced را هم در سایتتان بزارید؟ تشکر

kourosh201013
kourosh201013

سلام وقت بخییر
در آموزش به هنگام اضافه کردن کد فونت در قسمت rtl.css اگر ابتدای فایل کد را اضافه نکنیم و بعد از مورد زیر که در قالب هست اضافه کنیم اشکالی دارد.
Theme Name: KuteTheme
Description: Adds support for languages written in a Right To Left (RTL) direction.
[Table of contents]
1. General
2. Header
3. Footer
4. Main menu
5. Owl carousel Theme
6. Visual Composer
7. Sidebar
8. Blog
9. Woocommerce
10. Responsive

محمد قاسمی
محمد قاسمی

درود.

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

محسن
محسن

سلام
من فونت ایران سنس رو از روشی که شما گفتین روی سایتم نصب کردم اما سرعت لود فونت پایین اومده. به طوری که بعد از هربار وارد شدن در سایت همه چیز در کسری از ثانیه بالا میاد اما فونت بعد از دو سه ثانیه!
مشکل چیه؟؟؟!!
در ضمن از آموزش خوبتون هم ممنون….

مجتبی
مجتبی

با سلام
من فونت و به روش بالا نصب کردم
و درست شد اما چرا فونت B Yekan به قسمت فونت ها در ویرایش گر متنم افزوده نمیشه
چطوری میشه این فونت رو به ویرایشگر متن اضافه کرد که راحت بتونم فونت متن دلخواهمو تغییر بدم
با تشکر از شما و سایت خوبی که دارید

محمد قاسمی
محمد قاسمی

درود.

باید در کدنویسی Editor دست ببرید و این کار را انجام دهید.

امیر
امیر

سلام قالب من divi هست کارهایی که گفتین رو انجام دادم ولی تغییری نکرده

احسان
احسان

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

حامد فرّی
حامد فرّی

کوتاه – مختصر و مفید . خسته نباشید

حامد فرّی
حامد فرّی

ممنون – عالی بود

مریلا
مریلا

ممنونم فوق العاده بود

sasa
sasa

من هرکاری میکنم فونتم تغییر نمیکنه طبق اموزشهم میرم ولی فونت سایتم خیلی بده.چکار باید کنم راه دیگه ای نیست فونت عوض کنم شاید یک دلیلی داره عوض نمیشه کش رو هم خالی کردم

mohamad
mohamad

سلام من میخوام فونت byekan رو به ادیتور TinyMCE Advanced اضافه کنم چطوری میتونم این کار رو انجام بدم ؟

امیر
امیر

سلام چطوری سایز فونت ها رو بزرگ تر کنیم؟

mohamad
mohamad

سلامممنون از آموزش خوبتونمن کارایی که گفتید رو روی قالب انجام دادم اما تغییری نکرد ! میشه راهنمایی کنید ؟!

سعید
سعید

سلام  تگ ‌!important به css را برای نمایش داده شدن فونت ایرانسس در سایت باید در کدام قسمت کد زیر اعمال کنیم؟من طبق روش گفته شده مراحل رو انجام دادم اما تغییری در سایت به وجود نیومد و کل سایت به فونت معمولی تغییر کرده.@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;
}

sadeghi-h880
sadeghi-h880

اضافه کردن پسوند های فونت به وردپرس مخصوصا برای آپلود فونت در be themeامنیت، مهم ترین دغدغه وردپرس برای محدود کردن کاربران در آپلود فایلهای مختلف بیان شده است.اما این بدان معنا نیست که نمیشود هیچ استثنایی برای این محدودیت قائل شد.برای این منظور کافی است این قطعه کد را به فایل functions.php اضافه کنید:/** add new type to wordpress */function my_myme_types($mime_types){$mime_types[‘ttf’] = ‘application/x-font-ttf’; //Adding ttf extension$mime_types[‘eot’] = ‘application/vnd.ms-fontobject’; //Adding eot extension$mime_types[‘svg’] = ‘image/svg+xml’; //Adding svg extension$mime_types[‘woff’] = ‘application/x-font-woff’; //Adding woff extensionreturn $mime_types;}add_filter(‘upload_mimes’, ‘my_myme_types’, 1, 1);

سجاد
سجاد

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

مریم زارعی
مریم زارعی

با سلام و خسته نباشید خدمت شمامن تغییر فونت را در قالب zerif pro میخواهم انجام بدهم.اما اعمال نشد.(در لوکال هاست)

reza
reza

سلام طبق این آموزش انجام بدید حل خواهد شد.

مریم زارعی
مریم زارعی

با سلام و خسته نباشید خدمت شمامن نیاز به پک آموزشی شما در ارتباط با قالب zerif pro دارم.آیا سی دی آموزشی دارید که من خریداری کنم؟

reza
reza

سلام نه متاسفانه

ata
ata

ممنونم خیلی خوب بود

محمدرضا اصفهانی
محمدرضا اصفهانی

سلام و روز به خیر٬من از فونت شبنم استفاده کردم و فونت رو عوض کردم اما از فونت انگلیسیش خوشم نمیاد و فک کنم times roman باشه٬ممنون می شم راهنمایی بفرمایین که چجوری می تونم انگلیسی رو هم عوض کنم

reza
reza

سلام بايد فونت انگليسي روي فونت شبنم باشه همزمان نميشه دو تا فونت گذاشت

صادق
صادق

من دقیقا همین کارا رو رو لوکال هاست انجام دادم ولی هیچ تغییری نکردقالب Twenty Seventeenفونت هم ایران سنس

reza
reza

سلام یه تگ ‌!important به css اضافه کنید

سعید
سعید

@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;
}ممنون میشم اینجا اصلاح بفرمایید. با سپاس از سایت بی نظیر و پشتیبانی عالیتون

صادق
صادق

یه سوال دیگه هم داشتم.زبون پنل مدیریت وردپرسو که انگلیسی میکنم دیگه فایل rtl.css کار نمیکنه!میشه هم زبونش انگلیسی باشه هم از فایل rtl.css استفاده کرد؟

reza
reza

سلام خير راست چين در صورت فارسي بودن سايت كار ميكنه

صادق
صادق

ببخشید من یکم مبتدیم.?این کارو انجام دادم فونت عوض میشه ولی ایران سنس نمیشه!! arial میشه.با همین بی یکان هم که گذاشتین امتحان کردم باز فونت arial میشه!!

صادق
صادق

اینو چی کارش کنم؟

reza
reza

در صورت نیاز به راست چین باید یا فارسی کنید وردپرس رو یا کد های ‌rtl.css در style.css کپی شود

صادق
صادق

الآن سایت راستچین شده درسته.ولی فونت کار نمیکنه.همونطور که گفتم فونت عوض میشه ولی arial میشه. اون فونتی که من میخوام نمیشه.

reza
reza

طبق كدهاي فوق بايد فونت فاميلي ها رو تعريف كنيد تا اوكي بشه

سارا
سارا

ببخشید یه سوال؟شما میدونید چطور میشه بعضی از فونتهای سایت رو که نوشته system توی وردپرس تغییر داد؟ من فونتهای سایتمو به روش شما تغییر دادم همه چیز اکی هست فقط فونت یه جا رو  از چیزیکه من تعریف کردم درست نمیخونه و وقتیکه inspect میزنم نوشته که این فونت system ای هست در حالیکه بقیه رو داره remote از چیزیکه من تعریف کردم میخونه. ممنون

reza
reza

از همين روش ميتونيد تغيير بديد

سارا
سارا

متوجه منظورتون نشدم. من همین روش رو پیاده سازی کردم اما این فونتی که نوشته شده در روش system استفاده میشه در هیچ کدوم از فایلهای css هم فراخوانی نشده. از طرفی من فونت body رو با دستور important به اون فونتی که میخواستم تغییر دادم اما این فونتی که داره خودش برای بعضی جاها میخونه هیچ جا نیست تا بتونم تغییرش بدم.ممنون میشم بیشتر راهنمایی کنید.

reza
reza

باید ببینید اون جایی که فونت سیستم رو میخونه استایلش چی هست و بهش استایل font-family بدید تا فونت دلخواه شما رو اجرا کنه

سارا
سارا

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

niusha96
niusha96

با سلام من طبق این اموزش پیش رفتم و در لوکال هاست جواب داد اما در هاست اینترنت جواب نمیدهد اگه میشه راهنمایی کنیدممنون از سایت خیلی خوبتون

رضا حسینی راد
رضا حسینی راد

سلام درست مراحل رو طی کنید و همه چیز اوکی باشه فرقی نداره روی لوکال کار کنید یا روی هاست اصلی

niusha96
niusha96

نام قالب من pixova-liteهست که  قسمت style.css اصلا font-family و تابع خاصی نداره !!! و فقط شامل لایسنس قالب و یکسری اطلاعات کلی راجع به قالب هست .. توی این شرایط میشه لطفا منو راهنمایی کنید 

رضا حسینی راد
رضا حسینی راد

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

artmis29
artmis29

سلام، من قالب انفولد رو ازتون خریدم، تو فونت های فارسی که گذاشتید، ایران سنس نیست، کد بالا رو به custom.css و rtl.css اضافه کردم و نام فونت رو به ایران سنس تغییر دادم، فایل های ایران سنس هم به فولدر fonts  اضافه کردم، اما کار نمی کنه، چطور می تونم فونت ایران سنس رو اضافه کنم؟
ممنونم

رضا حسینی راد
رضا حسینی راد

سلام ایران سنس چون لایسنس داره به قالب اضافش نکردیم. به سی اس اس خاصیت !important بدید اوکی میشه. البته تغییرات توی قالب جزو پشتیبانی نیست

alirezarezaei19
alirezarezaei19

سلام من با آموزش  شما اقدام کردم و فایل SVG رو هم ساختم و به آوادا اضافه کردم ولی متن های پارگرافها عوض نشدن و فقط سر تیتر ها BYEKAN  شدن. لطفا راهنمایی کنین. ممنون

رضا حسینی راد
رضا حسینی راد

سلام قالب آوادا رو اگر از ما خریداری کردید خودش دارای 63 فونت فارسی هست و نیازی به اضافه کردن دستی نداره!

alirezarezaei19
alirezarezaei19

خوب پس کاربرد آین آموزش برای چی بوده؟ !!

رضا حسینی راد
رضا حسینی راد

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

حمیدرضا میرفروغی
حمیدرضا میرفروغی

سلام لطفا آموزش صفر تا صد اضافه کردن پکیج 60 فونت که در قالب هایتان به کار می برید را بگذارید؟

رضا حسینی راد
رضا حسینی راد

سلام برای هر قالبی فرق میکنه

علیرضا غلامی
علیرضا غلامی

سلام.من فونت ایران سنس رو گرفتم و طبق اموزش پیش رفتم ولی نشد چی کار کنم من االان؟

رضا حسینی راد
رضا حسینی راد

سلام قالبتون چه قالبی هست؟ ظاهرا توی یکی از مراحل دارید اشتباه پیش میرید

misini16
misini16

پسر وااااااااااقعا دمت گرم 

amirhosseinfaraji59
amirhosseinfaraji59

سلاممن متوجه نشدم دقیقا.الان در قالب گود نیوز من 60 فونت فارسی شما از قبل قرار دادید. با این کاری که شما توضیح دادید آیا فونت جدید به آن لیست اضافه می شود یا جایگزین یکی از فونت ها می شود و یا ….؟خوب متوجه نشدم.ممنون

رضا حسینی راد
رضا حسینی راد

سلام خیر فونت اصلی سایت میشه ایران سنس. بهتره همزمان یک فونت روی کل سایتتون باشه

wpDiscuz