پیدا کردن فونت مناسب و جذاب برای سایت، کار دوستداشتنی است. مگر این که بعد از بارگذاری فونت عزیزتان متوجه شوید که به کاربران نمایش داده نمیشود. اگر با صفحهساز المنتور کار میکنید و دچار این مشکل شدهاید، این صفحه برای شماست. در این مقاله ۸ دلیل رایج برای مشکل عدم نمایش فونت اختصاصی در المنتور را بررسی خواهیم کرد. سپس برای هریک از این مشکلات راهحل ارائه میکنیم.
۸ دلیل احتمالی برای عدم نمایش درست فونتها در المنتور + راهحل
مشکل عدم نمایش فونتهای اختصاصی در المنتور کمی گسترده است و به یکی دو دلیل رایج محدود نمیشود. در واقع ۸ دلیل احتمالی برای بروز این مشکل وجود دارد که هریک راهحل به خصوص خود را دارد. اجازه بدهید این مشکلات را به تفکیک بررسی کنیم و راهحل هریک را ارائه کنیم:
۱) مشکل حافظه کش
اگر در زمانی که به مشکل لود فونت برخوردهاید از افزونهٔ کش استفاده میکردید، بهتر است این افزونه را موقتاً حذف کنید. علاوهبر این کش سایت و مرورگر خود را نیز پاک کنید. چرا که ممکن است نسخهای از سایت در حافظه پنهان شما ذخیره شده باشد که فونت جدید را ندارد.
برای پاکسازی کش میتوانید از پشتیبانی هاست کمک بگیرید. همچنین میتوانید به مقالهٔ «آموزش حذف کش» در مجلهٔ لیموهاست سری بزنید.
۲) مشکل عدم تطابق HTTP / HTTPS
اگر به تازگی گواهی SSL سایت خود را فعال کردهاید، البته که کار پسندیدهای کردهاید. اما لازم است برخی موارد مثل فونتها را در نسخهٔ HTTPS سایت هم آپلود کنید. برای این کار:
۱. وارد پیشخوان وردپرس شوید و به مسیر Elementor > Custom Fonts بروید.
اگر URL های لیست شده با https شروع نمیشوند، روی دکمه DELETE در کنار هر کدام کلیک کنید و سپس روی دکمههای UPLOAD کلیک کنید تا فایلها دوباره آپلود شوند.
۲. به Elementor > Tools بروید و روی دکمه Regenerate CSS کلیک کنید.
حالا باید URLها با https شروع شوند و فونتهای شما به درستی نمایش داده شوند.
۳) خطای CORS در کنسول
اگر فونت سفارشی شما نمایش داده نمیشود و همزمان خطای CORS را در کنسول مرورگر خود دریافت میکنید، راهحل از دست شما خارج است. با پشتیبانی هاست تماس بگیرید و ادامهٔ کار را به آنها بسپرید. چرا که برای حل این مشکل بایستی قوانین CORS از سمت سرور تغییر پیدا کند. دسترسی کامل مدیریت سرور هم در دست هاستینگ است (البته اگر سرور اختصاصی خریداری کرده باشید این دسترسی به شما نیز داده میشود).
۴) نصب قالب جدید
اگر به تازگی قالب جدیدی را نصب کردهاید که فونتهای سفارشی آن با فونتهای شما متفاوت است، باید تغییری ایجاد کنید. یعنی باید فونت خود را جایگزین فونت قالب کنید. هر قالبی مسیر تنظیمات خاص خود را دارد. اما بهطور کلی بایستی از منوی پیشخوان وارد تب قالب شوید. در تنظیمات استایل (یا هر عنوان مشابه دیگری) وارد بخش فونت شوید. نسخهٔ woff فونت خود را بهعنوان فونت اولیه جایگذاری کنید.
اگر تنظیمات قالب شما گیجکننده است، میتوانید از افزونهٔ MW Font Changer کمک بگیرید و با چند کلیک ساده فونتها را جایگزین کنید.
۵) در دسترس نبودن وزن فونت انتخابی
ممکن است فونت انتخابی شما در وزنی که انتخاب کردهاید، موجود نباشد. مثلاً در حین آپلود فونت یکان Bold را انتخاب کرده باشید اما نیاز به وزن semi-bold داشته باشید. بهتر است خرید فونت را از سایتهای معتبری که پکیج کامل وب فونت ارائه میکنند، انجام بدهید. به این ترتیب به تمام وزنها دسترسی دارید. یا این که همان وزنی را که در اختیار دارید انتخاب کنید.
۶) کد سفارشی نامعتبر
اگر بعد از جایگذاری یک CSS سفارشی یا اسکریپت دیگر در سایت با مشکل لود فونت المنتور مواجه شدید، بهتر است این کد را حذف کنید. اگر بعد از حذف کد، فونت اختصاصی شما نمایش داده میشود، مشکل را در کد و اسکریپت سفارشی جستجو کنید. اگر Auto GPT را در اختیار دارید، میتوانید کد را به این ابزار هوشمند بدهید تا اشکالات را برایتان پیدا کند.
با نسخهٔ جدید Elementor AI دیگر مشکلی با کدهای سفارشی CSS نخواهید داشت. کافی است چیزی که میخواهید را با این هوش مصنوعی سایتساز در میان بگذارید. سپس کد تر و تمیز و بهینه و سازگار را تحویل بگیرید!
۷) آپلود فرمتهای مختلف فونت
فونتی که برای سایت خود انتخاب میکنید باید فرمت وبفونت را داشته باشد. بهطور کلی فرمتهای زیر معمولاً در وب خوب کار میکنند:
- OTF – OpenType Font
- TTF – TrueType Font
- EOT – Embedded Open Type
- WOFF – Web Open Font Format
- WOFF2 – Web Open Font Format (Version 2)
- SVG – Scalable Vector Graphics
گرچه نسخهٔ TTF معمولاً محدودیتهایی برای برخی وبسایتها دارد. مطمئنترین فرمت برای بهکارگیری در المنتور OTF و WOFF هستند. بنابراین اگر فونت را با فرمت دیگری بارگذاری کردهاید و به این مشکل برخوردهاید بهتر است آن را با نسخههای بالا جایگزین کنید.
۸) بههمریختگی فونتها بعد از نصب SSL
پس از نصب گواهی SSL، احتمال دارد URLهای جدید شما روی HTTPS فعال نباشند و همین باعث به هم ریختگی فونت در المنتور شود. برای حل این مشکل میتوانید بهجای تنظیم دستی URLها از افزونههایی مثل افزونه Really Simple SSL استفاده کنید. در صورت تمایل میتوانید به صورت دستی اقدامات زیر را طی کنید:
- در پیشخوان وردپرس به Elementor > Tools > Replace URL بروید.
- در قسمت “Old URL” آدرس سایت را با HTTP و در URL جدید آدرس سایت را با HTTPS قرار دهید.
- روی دکمه Replace URL کلیک کنید.
- روی دکمه Save Changes کلیک کنید.
سوالات پرتکرار شما
۱. چرا فونت سفارشی در المنتور نمایش داده نمیشود؟
دلایل زیادی برای این مشکل وجود دارند. اما اگر css سفارشی جدیدی به سایت اضافه کردهاید یا به تازگی گواهی SSL را فعال کردهاید؛ احتمالاً مشکل به این موارد مربوط میشود.
۲. چه فونتهایی با المنتور سازگاری ندارند؟
درواقع فونتها اگر در نسخهٔ وبفونت با فرمت WOFF آپلود شوند، هیچ مشکلی با المنتور نخواهند داشت. مگر این که فونتهای قالب در تنظیمات نسبت به فونت اختصاصی شما در اولویت قرارداده شده باشند.
۳. چطور مشکل CSS سفارشی عامل عدم نمایش فونت را بفهمیم؟
میتوانید این کد را به یک متخصص نشان بدهید، یا در ابزار Auto GPT تست کنید. اگر به Elementor AI دسترسی دارید، میتوانید درخواست خود را ارائه کنید و کد صحیح CSS را دریافت کنید.
آیا توانستید مشکل عدم نمایش درست فونتها در المنتور را حل کنید؟
در این مطلب به ۸ روش رایج برای برطرف کردن مشکل لود فونت در المنتور اشاره کردیم. اگر مسئله با امتحان کردن تمام این روشها حل نشده است، بد نیست سازگاری افزونهها و قالبها با المنتور را نیز بررسی کنید. یعنی یک بار به صورت موقت تمام افزونهها به جز المنتور را غیرفعال کنید. اگر مشکل حل شد بایستی پس از فعالسازی مجدد افزونهها، سازگاری آنها با المنتور را یکبهیک بررسی کنید. اگر قالبی را انتخاب کردهاید که با المنتور سازگاری ندارد، تعجبی ندارد که به مشکلاتی از این قبیل بربخورید.
پیشنهاد میکنم برای آشنایی با دیگر خطاهای وردپرس، به لینک مذکور مراجعه کنید.
اگر هنوز سوالی در ذهن دارید، میتوانید از بخش نظرات زیر همین پست از ما بپرسید و پاسخ بگیرید. اگر تجربهای دارید که حدس میزنید خواندنش برای سایر کاربران خالی از لطف نیست هم از همین بخش پیام خود را برای ما ارسال کنید.
عالی بود
مرسی
اوکی شد
مشکل من از ssl بود و با روش ۸ حل شد
سلام محمد عزیز
خیلی خوشحالیم که مشکلتون حل شد. 🍋🙏🏻
سلام دستتون دردنکنه با مورد هشتم من مشکلم حل شد، مرسی از مقال کاملتون🙏🏻
سلام پیام عزیز
خوشحالیم که مشکلت حل شده. 🍋
عالی بود . از همه سایتای دیگه بیشتر میفهمی و کار بلدی . ایول دارییییییییییی
سلام مهدی جان
خوشحالیم که مقاله رو دوست داشتید.
ممنون از همراهیتون 🍋🙏🏻
دستتون درد نکنه چن ماه درگیرش بودم مشکلم حل شد
سلام قادر جان، خوشحالیم که این مقاله براتون مفید بوده 🍋😊
مرسی از شما، با مورد دوم مشکلم حل شد.
خدا راه زندگیتون رو هموار کنه الهی
سلام شیده عزیز
خیلی خوشحالیم که این مقاله براتون مفید بوده 🍋
خیلی عالیی بودد
من مشکلم درست شد .ممنون
سلام محمد عزیز
خیلی خوشحالیم مشکلتون حل شده، بازم بهمون سر بزنید🍋
با روش دوم کارم حل شد 🙂
یک دنیا سپاس
سلام پویان عزیز
خیلی خوشحالیم این مقاله براتون مفید بوده، بازم بهمون سر بزنید:)🍋
با سلام واقعا از صمیم قلب از مطالب بسیار ارزشمند شما مچکرم. بنده مشکلم حل شد.
سلام و درود ابوالفضل عزیز
خیلی خوشحالیم که مقاله براتون مفید بوده و مشکلتون حل شده
و ممنون که بهمون فیدبک دادین.
سلام خسته نباشید
من چندین سایت راه اندازی کردم تو هشچ کدوم شون تا حالا به مشکل بر نخورده بودم، اما الان به وبسایت دستمه و فونت تو قالب وودمارت ایمپورت کردم ولی نمایش داده نمیشه بصورت خودکار و چک کردم مشکل تو این چند موردی که شما گفتی هم نبود
سلام وقت بخیر
وبسایت من مثل مورد دوم url ها با http هستند اما بعد از انجام کار هایی که گفتید تغییر نکرد
ممنون میشم راهنماییم کنید
سلام روزتون بخیر من روی لوکال هاست Xampp در حال طراحی سایت هستم ولی وقتی به قسمت custom fonts در المنتور میرم میگه اجازه دسترسی به این برگه رو ندارم. سطح دسترسی مدیریت هم چک کردم مشکلی نداشت. اگر ممکنه راهنمایی بفرمایید ممنونم