آموزش های وردپرسخانهسیستم مدیریت محتواعمومی

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

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

افزودن فونت فارسی به قالب وردپرس یکی از نیازهای اساسی هر وبسایت وردپرسی است. با استفاده از فونت دلخواه در وردپرس، شکل و ظاهر سایت ما بصورت کلی تغییر خواهد کرد و با استفاده از آن می توانید ظاهری بهتر در سایت خودتان ایجاد کنید. بخصوص زمانی که از فونت‌های محبوبی مثل ایران سنس، بی یکان و ایران سنس دست نویس استفاده کنید. این فونت‌ها جزو محبوب‌ترین فونت ها در وب فارسی به حساب می آیند که در بسیاری از سایت‌ها با این فونت‌ها مواجه شده‌اید. همانطور که می دانید وقتی ما از قالب‌هایی که از تم فارست خریداری می‌کنیم یا اینکه اقدام به نصب قالب وردپرس از طریق مخزن وردپرس می‌کنیم این قالب‌ها معمولا با فونت‌های Tahoma ، Arial و … هستند. بنابراین محتوای سایت ما از نظر فونت طراحی بصری خوبی نخواهد داشت. لازم است در ابتدا فونت دلخواه خودمان را تهیه کرده و سپس اقدام به نصب فونت در وردپرس کنیم. در این آموزش قصد دارم تا به نحوه نصب فونت در وردپرس و افزودن فونت فارسی به قالب وردپرس بپردازم که با استفاده از آن می توانید فونت سایت خودتون را تغییر داده و ظاهر سایت را صرفا با یک فونت زیرورو کنید.

توجه : این آموزش در تاریخ 19 دی 1398 مورد بازبینی و ویرایش قرار گرفته است.

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

قبل از نصب فونت در وردپرس باید ابتدا فونت دلخواه خودتان را در سه فرمت تهیه کنید. این فرمت ها که برای وبسایت مورد استفاده قرار میگیرند شامل eot، ttf و woff هستند. معمولا فونت با فرمت ttf با همه مرورگرها سازگاری دارد و نسبت به سایر فونت‌ها بیشتر مورد استفاده قرار میگیرد. پس برای استفاده از فونت دلخواه خودتان (فونت رایگان) کافیست در گوگل جستجو کرده و فونت دلخواه را دانلود کنید. اما اگر فونت شما تجاری هست حتما باید آن را خریداری کنید.

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

حال بعد از اینکه فونت را با فرمت ttf و سایر فرمت‌ها تهیه کردید نوبت به نصب فونت در وردپرس می رسد. اگر فونت شما به گونه‌ای است که فرمت‌های دیگر برای آن ساخته نشده مشکلی نیست و می توانید به راحتی با استفاده از ابزار آنلاین اقدام به تبدیل فرمت کنید! برای اینکار کافیست تا عباراتی مثل convert ttf to eot و convert ttf to woff را جستجو کرده و از این سایت‌ها برای تبدیل فرمت فونت به فرمت های woff و eot استفاده کنید.

روش اول: نصب فونت در قالب وردپرس با کدنویسی

حالا برای نصب فونت در قالب وردپرس ابتدا وارد هاست خود شده و سپس بر روی File Manager کلیک کنید تا به محیط فایل منیجر هاست هدایت شوید. سپس به پوشه قالب وردپرس مراجعه کنید. یعنی به مسیر /public_html/wp-content/themes/ مراجعه کرده و در نهایت وارد پوشه قالب شوید. حال در این مرحله لازم است فونتی که تهیه کرده اید را در پوشه fonts آپلود کنید. اگر پوشه‌ای با این نام در پوشه قالب ندارید می توانید یک پوشه بسازید و سپس فایل‌های فونت که با سه فرمت ttf، eot و woff هستند را در این پوشه آپلود کنید.

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

در اینجا من قصد دارم از فونت ایران سنس دست نویس برای سایت خودم استفاده کنم که مشابه تصویر، فونت‌ها با نام iransansdn خریداری و در پوشه fonts قالب آپلود شده است. حال بعد از اینکه فونت خودتون را آپلود کردید به پوشه قبل یعنی مسیر اصلی پوشه قالب خودتان برگردید و به دنبال فایل style.css قالب بگردید. بعد از اینکه فایل استایل را پیدا کردید روی اون راست کلیک کرده و گزینه Edit را انتخاب کنید تا به صفحه ویرایشگر این فایل مراجعه کنید. بعد از مراجعه به صفحه ویرایشگر فایل خواهید دید که در خطوط ابتدایی این فایل مشابه تصویر زیر کدهای css برای افزودن فونت در قالب وردپرس وجود دارند که لازم است آنها را شخصی سازی کنید.

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

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


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

123456@fontface { fontfamily: ‘iransansdn’; src: url(‘fonts/iransansdn.eot?#’) format(‘eot’), url(‘fonts/iransansdn.woff’) format(‘woff’), url(‘fonts/iransansdn.ttf’) format(‘truetype’);}

همانطور که در خط دوم کد می بینید ابتدا باید برای فونت خودمان یک اسم انتخاب کنیم. چون من از فونت ایران سنس دست نویس استفاده می‌کنم از اسم iransansdn استفاده می‌کنم و خانواده فونت خودم را در قالب با این اسم قرار می‌دهم تا در هر بخش از کلاس قالب که گفته شده بود فونت آن بخش با این نام باشد، این فونت‌ها برای آن بخش لود شوند. سپس در خطوط سوم تا پنجم مسیری که فونت‌ها در اون قرار دارد به همراه نام و فرمت فونت‌ها مشابه نمونه وارد کنید. در اینجا fonts نام پوشه است که بعد از یک / iransansdn قرار دارد که عبارت است از نام فونت به همراه فرمت فونت. در نهایت نام خانواده فونت خودمان را که با iransansdn قرار دادیم را در بخش‌های مختلف کلاس قالب استفاده کنید.

برای این منظور کل فایل استایل را بررسی کنید و هر کجا که کد font-family مشاهده کردید بررسی کنید، اگر از فونت دیگری در مقابل نام آن به غیر از iransansdn استفاده شده بود به این معنی است که باید نام آن را تغییر دهید. به عنوان نمونه تمامی کلاسی که در فایل استایل شما قرار دارد باید بصورت زیر باشد.


font-family: iransansdn;

1fontfamily: iransansdn;

اگر هم احیانا در جایی دیدید که به شکلی هست که چندین نام در مقابل آن قرار دارد برای اینکه اولویت با فونت سفارشی شما باشد باید اولین نام را با iransansdn وارد کنید.


font-family: ‘iransansdn’, ‘Helvetica Neue’, sans-serif;

1fontfamily: ‘iransansdn’, ‘Helvetica Neue’, sansserif;

در نهایت بعد از ذخیره فایل فونت سایت شما تغییر خواهد کرد. دقت داشته باشید که فایل RTL.css را هم بررسی کنید که اگر فونت‌ها در این فایل با فرمت و نام جداگانه بودند به همین ترتیب آنها را هم باید در این فایل تغییر بدهید. برای تغییر فونت وردپرس در فایل rtl.css لازم است تا به همین ترتیب عمل کنید و اگر که فونت‌ها در این فایل به صورت جداگانه لود می شوند هم اصلاح شده و نام خانواده فونت را هم برای کلیه کلاس‌های فونت قالب تغییر دهید.


روش دوم: استفاده از افزونه فونت دلخواه وردپرس

یک راه ساده دیگر، استفاده از افزونه فونت دلخواه وردپرس است که در این روش با نصب یک افزونه می توانید فونت دلخواه خودتان را به قالب وردپرس اضافه کنید. در این روش کافیست فایل فونت و نام خانواده فونت رو انتخاب کنید و بعد از اضافه کردن داخل افزونه کاری کنید که قالب سایت با این فونت نمایش داده شود. افزونه فونت دلخواه وردپرس که قصد دارم معرفی کنم با نام Use Any Font در مخزن وردپرس به ثبت رسیده و تا به امروز توانسته بیش از 100.000 نصب فعال را به خودش اختصاص داده و از این تعداد نصب امتیاز 4.7 را دریافت کند. برای استفاده از این افزونه روی دکمه زیر کلیک کنید تا به صفحه افزونه هدایت شوید و بعد با استفاده از آموزش نحوه نصب و کار کردن با افزونه ها در وردپرس اقدام به نصب و فعال کردن افزونه کنید.

افزونه فونت دلخواه وردپرس Use Any Font

بعد از نصب و فعال سازی افزونه مشابه تصویر زیر منویی با نام Use Any Font اضافه می شود که با رفتن به این منو می توانید فونت دلخواه خودتان را در وردپرس اضافه کنید.افزودن فونت فارسی به قالب وردپرس و افزودن فونت دلخواه به قالب وردپرس

همانطور که در تصویر می بینید ابتدا لازم است یک API Key از سایت سازنده افزونه برای استفاده از فونت دلخواه در وردپرس تهیه کنید. بنابراین روی لینکی که در کادر قرمر می بینید و با نام HERE قرار دارد کلیک کنید تا به سایت سازنده هدایت شوید.

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

مشابه تصویر بالا در فرم با استفاده از نوار کشیدنی ابتدا آن را به سمت چپ بکشید تا به حالت رایگان برای افزودن فونت در وردپرس برسید. سپس اطلاعات شخصی خودتان که شامل نام، نام خانوادگی و ایمیل می شود را در فرم پر کنید و در نهایت روی دکمه سبز رنگ SUBMIT کلیک کنید.

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

حال همانطور که می بینید کد API KEY مختص برای شما ساخته شده و می توانید با استفاده از این کلید API قابلیت استفاده از این افزونه برای افزودن فونت دلخواه در وردپرس را داشته باشید. کد را کپی کرده و در صفحه تنظیمات افزونه وارد کنید.

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

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

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

حال روی دکمه Add Fonts کلیک کنید تا فونت دلخواه برای استفاده در وردپرس را اضافه نمایید. با کلیک روی این دکمه فرم زیر نمایش داده می شود که باید اسم خانواده فونت را در فیلد Font Name وارد کنید و سپس فایل فونت را هم با یکی از فرمت‌های ttf، otf، woff و با حداکثر حجم 15 مگابایت انتخاب کنید. در نهایت روی دکمه Upload کلیک کنید تا فایل فونت آپلود شده و به لیست فونت‌های قابل استفاده در افزونه اضافه شود.

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

حال بعد از اینکه فونت آپلود شد مشابه تصویر زیر روی دکمه Assign Font کلیک کنید تا فرم زیر نمایش داده شود تا بتوانید برای انواع مختلفی از تگ‌های HTML و کلاس دلخواه که در سایت استفاده می‌کنید تعریف کنید که برای نمایش آنها از این فونت استفاده شود.

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

Select Font: ابتدا از این قسمت فونتی که در مرحله قبل با نام دلخواه ساختید را انتخاب کنید.

Select elements to assign: از این بخش انواع تگ‌های HTML که قادر به استفاده از این فونت هستید را انتخاب کنید. در اینجا من قصد دارم روی همه برچسب‌های html که توسط این افزونه مشخص شده از فونت ایران‌سنس استفاده کنم. پس تیک همه این گزینه‌ها را فعال می‌کنم.

Custom Elements: از این کادر هم می توانید نام کلاس دلخواه قالب که می خواهید فونت این کلاس‌ها هم با این فونت نمایش داده شود را انتخاب کنید. این گزینه زمانی کاربرد دارد که اگر در برخی از جاهای سایت فونت نمایش داده نشد، بتوانید با قرار دادن کلاس CSS آن بخش داخل این فیلد نمایش فونت دلخواه را فراهم کنید. در نهایت روی دکمه Assign Form کلیک کنید تا تنظیمات ذخیره شود.

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

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


روش سوم: استفاده از افزونه فونت ماندگار

یکی دیگه از افزونه‌های پرطرفدار که امکان استفاده از فونت دلخواه در وردپرس را می دهد یک افزونه فارسی است که داخل این افزونه فونت‌های پرطرفدار فارسی مثل ایران سنس، بی یکان، وزیر و… قرار داده شده‌اند که این افزونه هم امکان استفاده از فونت‌های مشخص شده را به شما می دهد. برای استفاده از این افزونه هم می توانید به آموزش تغییر فونت در قالب وردپرس رفته و راهنمای استفاده از افزونه فونت ماندگار را مشاهده کنید.

آموزش های پیشنهادی ما به شما:

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



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


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


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


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


افزودن بیش از 30 فونت مختلف فارسی به وردپرس - درمجموعه
داستان آموزش افزودن بیش از 30 فونت مختلف فارسی به وردپرس قبلا درباره اضافه کردن تغییر فونت در وردپرس با افزونه Custom Font صحبت کردیم.می توانید برای تغییر فونت وبسایتتان از این مقاله نیز استفاده نمایید.


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


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


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


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


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

برچسب ها

دیدگاهتان را بنویسید

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

4 + دو =

دکمه بازگشت به بالا
بستن