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

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

0

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

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

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

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

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

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

نصب فونت در قالب وردپرس

حالا برای نصب فونت در قالب وردپرس ابتدا وارد هاست خود شده و سپس روی 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 لازم است به همین ترتیب عمل کنید و اگر که فونت‌ها در این فایل به صورت جداگانه لود میشوند هم اصلاح شده و نام خانواده فونت را هم برای کلیه کلاس‌های فونت قالب تغییر دهید.

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

ارسال یک پاسخ

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

Captcha loading...