چگونه قالب وردپرس را برای زبان فارسی آماده کنیم
راهنمای فنی فارسی‌سازی قالب؛ از فایل RTL مستقل و فونت وب بهینه تا آینه‌سازی چیدمان.
فارسی‌سازی قالب، یکی از آن کارهایی است که در نگاه اول ساده به نظر می‌رسد و در عمل، سه هفته بعد از انتشار سایت، هفت جای مختلف خودش را نشان می‌دهد. در این سال‌ها روشی پیدا کرده‌ام که ترتیب مراحلش اهمیت زیادی دارد: اگر از فونت شروع کنید و RTL را آخر بگذارید، دوباره‌کاری می‌کنید. اگر RTL را درست بچینید ولی چیدمان را دست نزنید، رابط «فارسی وارونه» می‌شود. این مقاله دقیقاً همان ترتیبی است که در پروژه‌های واقعی اجرا می‌کنم. پیش از هر چیز، اگر با مفهوم پایه آشنا نیستید، قالب وردپرس چیست و برای تفاوت‌های بنیادین، قالب فارسی و انگلیسی چه تفاوتی دارند را یک بار مرور کنید.
ترتیب درست کار
ترتیبی که در همهٔ پروژه‌ها اجرا می‌کنم، چهار مرحله دارد: ابتدا فایل RTL مستقل، سپس فونت بهینه، سپس آینه‌سازی چیدمان، و در آخر سفارشی‌سازی‌های ظریف. اگر ترتیب را رعایت کنید، هر مرحله روی نتیجهٔ قبلی سوار می‌شود؛ اگر نه، هر مرحله بخشی از کار قبلی را باطل می‌کند. تجربه‌ام: همان چهار مرحله را بی‌ترتیب انجام دادن، حداقل ۳۰٪ به زمانِ پروژه اضافه می‌کند. نکتهٔ مهم اینکه فارسی‌سازی باید در چایلد تم اتفاق بیفتد نه در والد. جزئیات چایلد تم چیست را قبلاً باز کرده‌ام؛ اینجا فقط به‌عنوان قاعده یادآوری می‌کنم.
فایل RTL مستقل
قالب استاندارد وردپرس، در پوشهٔ خود فایل rtl.css دارد و وردپرس به‌طور خودکار وقتی locale را روی فارسی می‌گذارید، این فایل را بار می‌کند — به شرطی که قالب به‌درستی declare شده باشد. اگر قالب فایل RTL ندارد، سه راه دارید و فقط یکی از آن‌ها حرفه‌ای است:
- استفاده از
@importدرstyle.css— این راه را منفی پیشنهاد می‌کنم، چون صف CSS را قاطی می‌کند و LCP را عقب می‌اندازد. - نوشتن استایل RTL به‌صورت inline در
functions.php— این هم مشکل بارگذاری و کش را حل نمی‌کند. - ساخت فایل
rtl.cssمستقل در چایلد تم و enqueue پس از استایل والد باwp_enqueue_style— این راه حرفه‌ای است و من همیشه آن را انتخاب می‌کنم.
در این فایل، به سه دسته استایل می‌پردازید: بازنویسی جهت‌ها (direction، text-align، float)، معکوس‌سازی فاصله‌ها (margin-left ↔ margin-right)، و آینه‌کردن عناصر مخصوص (منو، آیکون، اسلایدر). پیشنهاد عملی: از ابتدا ساختار فایل را با کامنت‌های بخش‌بندی‌شده نگه دارید؛ در آپدیت‌های بعدی، این کار معجزه می‌کند. بحث تکمیلی دربارهٔ تعارض با سایر افزونه‌ها را در بررسی سازگاری قالب و افزونه دنبال کنید.
RTL واقعی، بازنویسیِ درست و مستندِ لایه‌های CSS است؛ نه یک !important سراسری که برای همه چیز استفاده شود.
فونت وب بهینه برای فارسی
فونت فارسی در وب، سه معیار دارد که هر سه را باید جدی بگیرید: یک — تعداد وزن‌های به‌کار‌رفته؛ سه وزن برای اکثر سایت‌ها کافی است (regular، medium، bold). اگر فونتتان هفت وزن دارد، شش وزن را از دست بدهید و فقط همان‌ها را load کنید. دو — subset زبانی؛ فونت فارسی معمولاً چند هزار گلیف دارد و حذف گلیف‌های بی‌استفادهٔ عربی/سیریلیک، حجم را نصف می‌کند. سه — font-display: swap؛ بدون آن، متن تا لود کامل فونت نامرئی می‌ماند و LCP خراب می‌شود. ترفندِ تکمیلی: ابعاد fallback را نزدیک فونت اصلی تنظیم کنید تا CLS از پرشِ فونت جلوگیری کند. معیارهای این بهینه‌سازی را در Core Web Vitals چیست کامل باز کرده‌ام. اگر تردید دارید که فونت مسئول کندی است یا قالب، مقایسهٔ عددی را در چرا قالب‌ها سایت را کند می‌کنند ببینید. و اگر با انتخاب فونت فارسی درگیرید، الگوهای پربازده را در همان بخشِ مقالهٔ «قالب فارسی و انگلیسی» دنبال کنید.
آینه‌سازی چیدمان
پس از RTL و فونت، نوبت به آینه‌سازیِ چیدمان می‌رسد. اینجا سه سطح دارید: سطح کلی — جابه‌جایی کلی بلوک‌ها در گرید؛ سطح اجزا — معکوس‌سازی فلکس‌باکس‌ها، جای‌گذاری آیکون‌ها، و جهتِ انیمیشن‌ها؛ سطح تعامل — جهتِ لمس، جهش فوکوس کیبورد، و ترتیب تب در فرم‌ها. تجربه‌ام: بیشتر باگ‌های فارسی در سطح تعامل رخ می‌دهند، نه در سطح کلی. کلیدواژه‌ای که کمک می‌کند: در CSS از margin-inline-start و padding-inline استفاده کنید تا کد از ابتدا دو-طرفه باشد. اگر از ابتدا این‌طور بنویسید، نیمی از درد RTL حذف می‌شود. تست سه‌گانه: منو، فرم، و اسلایدر — این سه، آینهٔ کاملی از تمام باگ‌های RTL هستند.
سفارشی‌سازی در چایلد تم، نه والد
همهٔ این چهار مرحله باید در چایلد تم اتفاق بیفتد. اگر در فایل‌های والد تغییر دهید، هر آپدیت قالب، کارِ فارسی‌سازی را می‌شوید. الگوی فنی‌اش را در مقالهٔ چایلد تم آورده‌ام و مسیر امن اتصال چایلد به والد را هم همان‌جا توضیح داده‌ام. نکته‌ای که در پروژه‌های خودم زیاد به‌کار می‌برم: حتی وقتی فقط دو خط CSS دستی می‌نویسم، این دو خط را در چایلد نگه می‌دارم. همین دو خط، بعد از پنج آپدیت، اگر در والد نوشته شده باشند، پنج بار از دست می‌روند. اگر بعداً می‌خواهید قالب را عوض کنید، مراحل امن در تغییر قالب بدون آسیب راهنمای شماست.
تست روی دستگاه واقعی
Emulator مرورگر دسکتاپ، دروغِ مؤدبانه می‌گوید. تست RTL باید روی گوشیِ واقعی، با دستِ خودتان، با اینترنت اپراتور انجام شود. سه آزمون: یک — منو را با شستِ یک‌دست باز و بسته کنید؛ اگر پرش داشت، آینه‌سازی تعامل ناقص است. دو — یک فرم بلند را پر کنید؛ اگر جهتِ فیلدها یا پیام خطا چپ‌چین بود، سطح چیدمانی ناقص است. سه — یک صفحهٔ پُرتصویر را اسکرول کنید؛ اگر تصویر از سمت اشتباه لود شد یا جهت کشیدنِ گالری معکوس بود، لایهٔ RTL به سطح بصری نرسیده. پروتکل کاملِ تست را در بهترین روش تست قالب وردپرس مرحله‌به‌مرحله آورده‌ام. و اگر بعد از فارسی‌سازی سرعت افت کرد، ترتیبِ درمان را در افزایش سرعت سایت وردپرسی و نقش لایهٔ بهینه‌سازی را در افزونه‌های کش وردپرس دنبال کنید.
اشتباهات رایج
- استفادهٔ سراسری از
!important: جنگ با specificity، همان بازی‌ای است که در آپدیت بعدی می‌بازید. - RTL کردن با افزونه: افزونه‌های RTL خودکار، سطح اول را حل می‌کنند و سطوح دو و سه را رها می‌کنند. برای دیدن سقفشان، قالب ریسپانسیو چیست را مرور کنید.
- ویرایش مستقیم فایل والد: همان قاتل خاموش همیشگی — راه‌حل در چایلد تم.
- فونت فارسی از CDN نامطمئن: هم مسئلهٔ حریم خصوصی، هم مسئلهٔ سرعت و در بعضی موارد، مسئلهٔ مالکیت فونت.
- تست فقط روی دسکتاپ: موبایل، جایی است که باگ‌های RTL واقعاً خودشان را نشان می‌دهند.
جمع‌بندی
فارسی‌سازی قالب وردپرس، یک کار چهار مرحله‌ای است: فایل RTL مستقل، فونت بهینه، آینه‌سازی چیدمان، و سفارشی‌سازی در چایلد تم. اگر ترتیب را رعایت کنید، با یک بار کارِ درست، سه سال راحت می‌خوابید. اگر هم قصد خرید قالب دارید، چک‌لیست پیش از خرید قالب و فهرست امکانات یک قالب حرفه‌ای را در دست داشته باشید. تجربه‌ای که بیشترین زمان را از شما در فارسی‌سازی گرفت، در دیدگاه‌ها بنویسید؛ همین گزارش‌های واقعی، این راهنما را دقیق‌تر می‌کند. 🧩
نویسنده در وردپرس کار.