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

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

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

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

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

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

تغییر فونت وردپرس

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

1- نصب فونت در قالب وردپرس با کدنویسی

حال برای نصب فونت و اضافه کردن فونت به وردپرس ابتدا وارد هاست خود شده و سپس بر روی 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');
}

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

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

font-family: iransansdn;

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

font-family: 'iransansdn', 'Helvetica Neue', sans-serif;

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

2- افزونه فونت فارسی وردپرس برای اضافه کردن فونت به وردپرس

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

💡 بیشتر بدانبد: افزونه وردپرس چیست و چه کاربردی دارد؟

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

همانطور که در تصویر می بینید ابتدا لازم است یک API Key از سایت سازنده افزونه برای استفاده از فونت دلخواه در وردپرس تهیه کنید. بنابراین روی لینکی که در کادر قرمر می بینید و با نام HERE قرار دارد کلیک کنید تا به سایت سازنده هدایت شوید. این در حالتی است که شما قصد استفاده از این افزونه در حالت Premium را داته باشید و برای اتسفاده در حالت free تنها کافی است که بر روی گزینه Generate free lite/test API key کلیک کنید تا کد شما ساخته شود و بر روی verify کلیک کنید. پس از پیام تایید تنها کافی است که بر روی Upload font در منو های همین بخش کلیک کنید تا بتوانید فونت دلخواهتان را نصب و Upload کنید.

حال روی دکمه 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 کلیک کنید تا تنظیمات ذخیره شود.

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

3- تغییر فونت پیشخوان وردپرس با افزونه فونت ماندگار

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

یکی دیگه از افزونه های پرطرفدار که امکان استفاده از فونت دلخواه در وردپرس را می دهد یک افزونه فارسی است که داخل این افزونه فونت های پرطرفدار فارسی مثل ایران سنس، بی یکان، وزیر و… قرار داده شده اند که این افزونه هم امکان استفاده از فونت های مشخص شده را به شما می دهد. برای استفاده از این افزونه کافی است که آن را با نام افزونه MWFont changer وردپرس که در در مخزن وردپرس ارائه شده، نصب و فعال کنید و یا از طریق لینک مستقیم دانلود را انجام دهید.

بعد از نصب و فعال سازی افزونه مشابه تصویر دو منو با نام های فونت ماندگار – پوسته و فونت ماندگار – پیشخوان در بخش تنظیمات پیشخوان سایت وردپرسی شما اضافه میشه که با کلیک روی منوی پوسته میتوانید فونت سایت را بر روی فونت پیشخوان و پوسته اعمال کنید.

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

• فونت: با استفاده از این بخش میتونید فونت دلخواه رو برای تگ های H1 تا H6 انتخاب کرده و از این فونت استفاده کنید.
• فونت بدنه: با استفاده از این گزینه میتونید فونت دلخواه برای بدنه اصلی قالب وردپرس را انتخاب کرده و از فونت فارسی در وردپرس برای نمایش مطالب و صفحات گوناگون استفاده کنید.
• فونت ادمین بار در صفحه اصلی سایت: با استفاده از این گزینه هم میتونید فونت دلخواه برای نوار ابزار منوی وردپرس که در بالای صفحه در هنگام مشاهده سایت نشون داده میشه را انتخاب کنید.

با اسکرول به سمت پایین در بخش عناصر دلخواه هم میتوانید از فونت دلخواه برای کلاس وردپرس استفاده کنید تا آی دی استایلی که از آن استفاده می‌کنید با فونت دیگری لود و بارگزاری شود. برای این منظور ابتدا آی دی خودتان را وارد کنید، اگر بیش از یک ID دارید آنها را با کاراکتر کاما انگلیسی از هم جدا کنید. سپس با استفاده از گزینه فونت، یکی از فونت های موجود را به دلخواه خودتان انتخاب کرده و در نهایت از بخش اندازه فونت هم هرسایزی که قصد دارید برای این فونت در نظر گرفته شود را بر حسب پیکسل انتخاب کنید. به همین ترتیب میتوانید مشابه این بخش در گزینه های عناصر دلخواه 2 و عناصر دلخواه 3 هم به این شکل عمل کرده و از فونت فارسی دلخواه در وردپرس برای کلاس خاص استفاده کنید. در نهایت تنظیمات را ذخیره کنید تا فونت دلخواه شما برای بخش‌های مختلف سایت انتخاب شود.

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

سوالات متداول درباره تغییر فونت در وردپرس

نتیجه گیری

چگونه به وردپرس فونت اضافه کنیم ؟در این آموزش تلاش ما بر این بود تا شما با افزودن فونت به وردپرس ،اضافه کردن فونت فارسی به وردپرس آشنا شوید. و با استفاده از آن فونت دلخواه خود را به پیشخوان وردپرس خود اضافه کنید برای آموزش های بیشتر وردپرس مارا در رسانه نکست میزبان فا دنبال کنید.