post title

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

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

در این مطلب خواهید خواند

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

توییتر تلگرام

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

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

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

  • تغییر فونت از طریق کدنویسی
  • استفاده از افزونه‌ها

 هر کدام از این روش‌ها مزایا و محدودیت‌های خاص خود را دارند و انتخاب بین آن‌ها به نیازمندی، سطح دانش شما و امکانات سایت بستگی دارد.

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

روش ۱: نصب فونت فارسی در قالب وردپرس با کدنویسی (قدم‌به‌قدم)

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

گام ۱: انتخاب و آماده‌سازی فایل فونت

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

گام ٢: ایجاد چایلدتم (اگر ندارید)

از طریق مدیریت فایل کنترل پنل هاست وردپرس خود پوشه‌ای به‌نام your-theme-child در مسیر wp-content/themes بسازید. فایل style.css را با هدر استاندارد قالب فرزند ایجاد کنید و در functions.php چایلدتم، استایل‌های قالب اصلی را بارگذاری کنید.

تصویر توسط وبسایت پارس‌هاست، میزبان هاست و سرور مجازی پرقدرت، طراحی شده است

گام ٣: ساخت پوشه فونت‌ها

برای افزودن فونت به وردپرس در این روش داخل پوشه چایلدتم، پوشه‌ای به‌نام fonts یا با نام دلخواه بسازید:

wp-content/themes/your-theme-child/fonts

فایل‌های .woff2 و .woff را که قبلا برای فونت دانلود کرده بودید، همین‌جا آپلود کنید.

تصویر توسط وبسایت پارس‌هاست، میزبان هاست و سرور مجازی پرقدرت، طراحی شده است

نام فایل‌ها را ساده و بدون فاصله بگذارید؛ مثل IRANSansWeb_Medium.woff

گام ۴: تعریف فونت با @font-face

یک فایل به‌نام fonts.css داخل پوشه چایلدتم بسازید یا همان ابتدای style.css این بلوک را اضافه کنید.

تصویر توسط وبسایت پارس‌هاست، میزبان هاست و سرور مجازی پرقدرت، طراحی شده است

مسیرها باید نسبت به فایل CSS درست باشند. نمونه مینیمال:

css

CopyEdit

@font-face {

  font-family: IRANSans;

  src: url(‘fonts/IRANSans.woff2’) format(‘woff2’),

       url(‘fonts/IRANSans.woff’) format(‘woff’);

  font-weight: 400;

  font-style: normal;

  font-display: swap;

}

اگر وزن‌های دیگر دارید، هر کدام را با یک بلوک @font-face جدا تعریف کنید. دستور font-display: swap; باعث می‌شود متن حتی قبل از لود کامل فونت هم خوانا باشد.

گام ۵: اعمال فونت روی بدنه و تیترها

در این مرحله از اضافه کردن فونت به وردپرس، بعد از تعریف فونت، آن را روی عناصر اصلی سایت اعمال کنید:

css

CopyEdit

html, body {

  font-family: IRANSans, sans-serif;

  font-weight: 400;

  line-height: 1.9;

}

 

h1, h2, h3, h4 {

  font-family: ‘IRANSans’, sans-serif;

  font-weight: 700;

}

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

گام ۶: بارگذاری استاندارد فایل فونت در وردپرس

برای تمیز بودن کار، فایل fonts.css را از طریق functions.php چایلدتم بارگذاری کنید تا مدیریت آن در هسته وردپرس باشد:

php

CopyEdit

<?php

// functions.php در چایلدتم

add_action(‘wp_enqueue_scripts’, function () {

  wp_enqueue_style(

    ‘child-fonts’,

    get_stylesheet_directory_uri() . ‘/fonts.css’,

    [],

    null

  );

});

گام ٧: پیش‌بارگذاری (Preload) برای افزایش سرعت

برای نمایش سریع‌تر، فایل woff2 وزن معمولی متن را پیش‌بارگذاری کنید. این کار به بهبود CLS و تجربه کاربری کمک می‌کند:

php

CopyEdit

add_action(‘wp_head’, function () {

  $font_url = get_stylesheet_directory_uri() . ‘/fonts/IRANSans.woff2’;

  echo ‘<link rel=”preload” href=”‘ . esc_url($font_url) . ‘” as=”font” type=”font/woff2″ crossorigin>’;

}, ۱);

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

گام ٨: آزمون، کش و مسیرها

تغییرات را با یک رفرش بررسی کنید. اگر افزونه کش دارید، پاک‌سازی کش را انجام دهید. اگر CDN فعال است، مطمئن شوید هدرهای Access-Control-Allow-Origin برای فونت‌ها مشکل ایجاد نمی‌کند.  

تصویر توسط وبسایت پارس‌هاست، میزبان هاست و سرور مجازی پرقدرت، طراحی شده است

نکته: برای اضافه کردن فونت به وردپرس از ویرایش مستقیم قالب اصلی برای افزودن فونت فارسی وردپرس یا هر فونت دیگری پرهیز کنید. اگر در آینده خواستید اضافه کردن فونت سفارشی در وردپرس را امتحان کنید، فقط فایل‌های فونت و بلوک‌های @font-face جدید را اضافه کنید و وزن‌ها را دقیق تعریف کنید. 

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

این روش نصب فونت در وردپرس مناسب کسانی است که نمی‌خواهند مستقیما وارد امور کدنویسی شوند یا می‌خواهند این کار را سریع و بی‌دردسر انجام دهند. افزونه‌ها این کار را با رابط گرافیکی ساده ممکن می‌کنند. چند پلاگین شناخته‌شده برای این کار وجود دارد، اما ما یک نمونه محبوب و پایدار یعنی Custom Fonts (افزونه فونت‌های سفارشی) را بررسی می‌کنیم.

گام ۱: انتخاب و نصب افزونه مناسب

در پیشخوان وردپرس، به منوی افزونه‌ها > افزودن بروید. در کادر جستجو، نام افزونه‌ای مثل Custom Fonts یا فونت‌های سفارشی بنویسید. وقتی آن را پیدا کردید، روی هم‌اکنون نصب کن کلیک کنید و سپس آن را فعال‌سازی کنید.

تصویر توسط وبسایت پارس‌هاست، میزبان هاست و سرور مجازی پرقدرت، طراحی شده است

گام ۲: دسترسی به بخش مدیریت فونت‌ها

بعد از فعال‌سازی، به‌طور معمول، گزینه‌ای جدید با عنوان Fonts یا فونت‌ها در پیشخوان ظاهر می‌شود. وارد این بخش شوید.

تصویر توسط وبسایت پارس‌هاست، میزبان هاست و سرور مجازی پرقدرت، طراحی شده است

 در افزونه Custom Fonts، یک دکمه یا لینک با عنوان Add New Font یا ایجاد فونت جدید وجود دارد. روی آن کلیک کنید تا وارد فرم افزودن فونت شوید.

تصویر توسط وبسایت پارس‌هاست، میزبان هاست و سرور مجازی پرقدرت، طراحی شده است

گام ۳: بارگذاری فونت فارسی

یک نام برای فونت انتخاب کنید، برای مثال، وزیر یا ایرانسنس سپس فایل فونت را در فرمت‌های استاندارد (woff2، woff) بارگذاری کنید. این تنظیمات فونت در وردپرس بسیار مهم هستند و باید با دقت مراحل را پیش برد.

تصویر توسط وبسایت پارس‌هاست، میزبان هاست و سرور مجازی پرقدرت، طراحی شده است

بهتر است حداقل نسخه‌های Normal و Bold را اضافه کنید تا هم متن معمولی و هم تیترها درست نمایش داده شوند.

گام ۴: ذخیره و فعال‌سازی فونت

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

تصویر توسط وبسایت پارس‌هاست، میزبان هاست و سرور مجازی پرقدرت، طراحی شده است

اگر از قالب‌هایی مثل Astra، GeneratePress یا قالب‌های المنتوری استفاده می‌کنید، این فونت در بخش سفارشی‌سازی (Customizer) یا در تنظیمات تایپوگرافی المنتور هم قابل انتخاب خواهد بود.

گام ۵: اعمال فونت روی بخش‌های مختلف سایت

برای اعمال فونت، به نمایش > سفارشی‌سازی بروید. بخش Typography یا «تایپوگرافی یا نویسه‌نگاری و نام‌های مشابه» را باز کنید و فونت جدید را برای بخش‌های مختلف مثل بدنه، تیترها و منوها انتخاب کنید.

اگر از صفحه‌ساز المنتور استفاده می‌کنید، در هر ویجت متنی هم می‌توانید فونت را از لیست انتخاب کنید.

گام ۶: تست و بررسی نمایش فونت

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

اگر فونت روی همه بخش‌ها اعمال نشده باشد، امکان دارد قالب کلاس‌های CSS خاص خود را داشته باشد که باید جداگانه هدف‌گیری شوند. برخی افزونه‌ها مثل «WP Add Custom CSS» یا ابزار CSS داخلی وردپرس می‌توانند این بخش را تکمیل کنند.

 نکات مهم در اضافه کردن فونت به وردپرس:

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

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

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

روش ۳: نصب فونت در وبسایت المنتوری در وردپرس

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

گام ۱: ورود به بخش مدیریت فونت‌های المنتور

در پیشخوان وردپرس به مسیر زیر بروید:
المنتور > تنظیمات سایت > فونت‌های سفارشی (در نسخه انگلیسی)Elementor > Custom Fonts

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

تصویر توسط وبسایت پارس‌هاست، میزبان هاست و سرور مجازی پرقدرت، طراحی شده است

گام ۲: افزودن فونت جدید

روی دکمه Add New یا «اضافه کردن فونت» کلیک کنید. یک نام برای فونت انتخاب کنید (مثلا وزیر یا ایرانسنس ). این نام همان چیزی است که بعدا در منوی انتخاب فونت المنتور می‌بینید.

تصویر توسط وبسایت پارس‌هاست، میزبان هاست و سرور مجازی پرقدرت، طراحی شده است

گام ۳: بارگذاری فایل‌های فونت

با استفاده از المنتور نسخه‌های مختلف یک فونت را بارگذاری کنید، از جمله:

  • Regular (وزن معمولی متن)
  • Italic (حالت ایتالیک)
  • Bold (تیترها و متن‌های برجسته)

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

گام ۴: انتشار فونت و دسترسی در طراحی صفحات

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

تصویر توسط وبسایت پارس‌هاست، میزبان هاست و سرور مجازی پرقدرت، طراحی شده است

گام ۵: بررسی نمایش و بهینه‌سازی

پس از ذخیره تغییرات، سایت را در مرورگر و دستگاه‌های مختلف بررسی کنید تا مطمئن شوید فونت درست نمایش داده می‌شود. اگر فونت کمی دیر لود می‌شود، می‌توانید از قابلیت Font Preload در هاست یا افزونه‌های کش استفاده کنید تا سرعت نمایش بهتر شود.

فونت فارسی وردپرس؛ کنترل کامل یا سرعت و راحتی؟

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

سوالات متداول

۱. بهترین فونت‌های فارسی برای وردپرس کدام‌اند؟
فونت‌هایی مانند «ایران سنس»، «وزیر»، «شبنم»، «صمیم» و غیره به‌دلیل خوانایی بالا و زیبایی، انتخاب‌های محبوب برای وب‌سایت‌های فارسی هستند.

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

۳. برای اضافه کردن فونت به وردپرس حتما باید کدنویسی بلد باشم؟
خیر، افزونه‌های متعددی وجود دارند که امکان افزودن فونت را بدون نیاز به کدنویسی فراهم می‌کنند، مثل Custom Fonts یا افزونه‌های فونت فارسی.

۴. آیا تغییر فونت باعث بهبود سئو سایت می‌شود؟
به‌طور مستقیم خیر، اما فونت خوانا و استاندارد باعث افزایش ماندگاری کاربر و کاهش نرخ پرش می‌شود که اثر غیرمستقیم مثبتی بر سئو دارد.

مطالب پیشنهادی

ووکامرس یک افزونه رایگان وردپرس است که با استفاده از آن می‌توانید وب‌سایت وردپرسی خود را به یک فروشگاه اینترنی کامل تبدیل کنید. این افزونه توسط شرکت بزرگی مثل Automattic پشتیبانی می‌شود و روی بیش از ۶ میلیون فروشگاه فعال در سرتاسر جهان امتحان خود را پس داده است. این یعنی شما چرخ را از […]

۲۰۲۶/۰۶/۲۹
۰

گیت‌هاب (GitHub) یک پلتفرم آنلاین برای نگهداری، مدیریت و اشتراک‌گذاری کدهای برنامه‌نویسی است که به توسعه‌دهندگان کمک می‌کند به‌صورت تیمی روی پروژه‌ها کار کنند. همچنین با استفاده از Git امکان ثبت تغییرات، بازگشت به نسخه‌های قبلی و همکاری آسان بین اعضای تیم را فراهم می‌کند. جالب است بدانید مایکروسافت در سال ۲۰۱۸ مبلغ ۷.۵ میلیارد […]

۲۰۲۶/۰۶/۱۹
۱

راه انداختن فروشگاه اینترنتی شاید در نگاه اول پیچیده به‌نظر برسد؛ اما واقعیت این است که امروزه با ابزاری مثل وردپرس و ووکامرس، این کار از همیشه ساده‌تر شده‌است. در این مسیر نه با محدودیت تعداد محصول روبه‌رو می‌شوید، نه مجبورید هزینه‌های سنگین ماهانه بپردازید. برای یادگیری ساخت فروشگاه با WooCommerce کافی است قدم‌به‌قدم با […]

۲۰۲۶/۰۶/۱۴
۰

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

۲۰۲۶/۰۶/۱۲
۵

در این آموزش نحوه ورود به پنل ابری پارس هاست را به‌صورت مرحله‌به‌مرحله بررسی می‌کنیم. ورود از طریق منوی دامنه‌ها از منوی دامنه‌ها وارد «دامنه‌های» من شوید. دامنه مورد نظر خود را انتخاب کنید و روی دکمه «مدیریت» کلیک کنید تا وارد بخش تنظیمات دامنه خود شوید. روی دکمه «هنوز به CDN متصل نشده» کلیک […]

۲۰۲۶/۰۶/۰۶
۰
۰ نظر

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