سبد خریدتان در حال حاضر خالی است!
برخورد با CSS خراب در ناحیه مدیریت وردپرس میتواند واقعاً دردسرساز باشد. دلیل این موضوع این است که به جای داشبورد مدیریت، صفحهای به هم ریخته و بدون استایل خواهید دید.
CSS خراب در ناحیه مدیریت همچنین باعث میشود نتوانید روی وبسایت خود کار کنید که این مسئله را به یک مشکل جدی تبدیل میکند. از آنجا که دلایل زیادی ممکن است منجر به ایجاد این مشکل شوند، بسیاری از تازهکاران نمیدانند چگونه باید این مسئله را برطرف کنند.
ما پیشتر در وبسایتهای خود با این مشکل مواجه شدهایم، بنابراین تمام مراحل رفع عیب را بررسی کرده و سادهترین راهحلها را پیدا کردیم. در این آموزش، به شما کمک خواهیم کرد تا CSS خراب در داشبورد مدیریت وردپرس را برطرف کنید.
در این مقاله، مرور سریعی از موضوعات و مراحل رفع عیب که بررسی خواهیم کرد ارائه میشود:
- دلایل ایجاد CSS خراب در ناحیه مدیریت وردپرس
- بررسی تداخل پلاگینها
- بارگذاری فایلهای ناامن بر روی HTTPS
- بررسی تداخل با قالب (Theme)
- رفع مشکلات کش (Caching)
- رفع مشکلات CDN
- رفع مجوزهای نادرست فایلها
- ترمیم فایلهای آسیبدیده
- بررسی افزونههای مرورگر
- راهنمای رفع مشکلات
دلایل ایجاد CSS خراب در ناحیه مدیریت وردپرس
دلایل متعددی وجود دارد که ممکن است باعث خراب شدن CSS در ناحیه مدیریت وردپرس شوند. با این حال، مانند بسیاری از خطاهای رایج وردپرس، ممکن است برای تازهکاران شناسایی علت اصلی مشکل و راهحل مناسب کمی گیجکننده باشد.
براساس تجربیات ما، دلایل زیر از اصلیترین عوامل ایجاد CSS خراب در ناحیه مدیریت وردپرس هستند:
- تداخل پلاگینها: پلاگینهای ضعیف کدنویسی شده که CSS خاص خود را دارند، میتوانند با استایلهای پیشفرض وردپرس تداخل ایجاد کرده و باعث ایجاد مشکل در ناحیه مدیریت شوند.
- تفاوت بین HTTP و HTTPS: مشکلات محتوای ترکیبی (Mixed Content)، که در آن برخی از فایلها از طریق HTTP بارگذای میشوند به جای HTTPS، میتوانند باعث مسدود شدن فایلهای CSS توسط مرورگر شوند.
- تداخل قالب (Theme): برخی از قالبها در ناحیه مدیریت CSS خود را بارگذاری میکنند که ممکن است با استایلهای پیشفرض وردپرس تداخل ایجاد کند. اگر از یک قالب مدیریتی سفارشی استفاده میکنید، این مسئله نیز میتواند باعث ایجاد مشکلات ظاهری شود.
- مشکلات کش (Cache): کش مرورگر ممکن است نسخههای قدیمی فایلهای CSS را ذخیره کرده باشد. همچنین، پلاگینهای کش ممکن است نسخههای قدیمی فایلهای CSS را ارائه دهند که باعث بروز مشکلات ظاهری شوند.
- مشکلات CDN: شبکههای توزیع محتوا (CDNs) که به درستی پیکربندی نشده باشند ممکن است نسخههای قدیمی فایلهای CSS را ارائه دهند و در نتیجه باعث از بین رفتن یا خراب شدن استایلها شوند.
- مجوزهای نادرست فایلها: فایلهای CSS که مجوزهای نادرستی دارند ممکن است توسط سرور قابل خواندن نباشند و در نتیجه باعث بروز مشکلات شوند.
- فایلهای آسیبدیده: فایلهای CSS ممکن است در طول بهروزرسانیها یا بارگذاریها آسیب ببینند یا ناقص شوند.
- افزونههای مرورگر: افزونههای مرورگر، بهخصوص افزونههای مسدودکننده محتوا (Content Blockers)، ممکن است در نمایش صحیح CSS اختلال ایجاد کنند.
مرحله ۱: بررسی تداخل پلاگینها
براساس تجربیات ما، پلاگینهای ضعیف کدنویسی شده در وردپرس معمولاً عامل اصلی ایجاد CSS خراب در ناحیه مدیریت هستند. با این حال، گاهی اوقات پلاگینهای به خوبی کدنویسیشده نیز ممکن است با نحوه تنظیم وبسایت یا سرور وردپرس شما دچار مشکلاتی شوند.
نحوه شناسایی و رفع تداخل پلاگینها
غیرفعال کردن تمام پلاگینها
ابتدا باید وارد داشبورد مدیریت وردپرس خود شده و به مسیر Plugins » Installed Plugins بروید.
سپس: همه پلاگینها را انتخاب کنید. از منوی Bulk actions گزینه Deactivate را انتخاب کرده و روی Apply کلیک کنید.
بعد از آن، کافیست ناحیه مدیریت وردپرس خود را بازنشانی کرده یا صفحه را دوباره بارگذاری کنید تا ببینید آیا مشکل CSS برطرف شده است یا خیر. اگر CSS درست شده باشد، یعنی مشکل مربوط به یکی از پلاگینهاست.
پلاگینها را به صورت تکتک فعال کنید
برای شناسایی پلاگینی که باعث ایجاد مشکل شده است، باید هر کدام را به صورت جداگانه دوباره فعال کنید. برای این کار، کافیست روی لینک Activate زیر نام هر پلاگین کلیک کنید.
بعد از فعال کردن هر پلاگین، باید ناحیه مدیریت وردپرس را بازنشانی کرده یا صفحه را دوباره بارگذاری کنید تا ببینید آیا دوباره مشکل CSS ایجاد میشود یا خیر.
این کار به شما کمک میکند تا پلاگینی که باعث ایجاد مشکل شده است را شناسایی کنید.
پلاگینی جایگزین پیدا کنید یا پلاگین را بهروزرسانی کنید
بعد از شناسایی پلاگینی که تداخل ایجاد میکند، بررسی کنید که آیا برای آن بهروزرسانی وجود دارد یا خیر. اگر بهروزرسانی مشکل را برطرف نکرد، به دنبال پلاگین جایگزینی بگردید یا با توسعهدهنده پلاگین تماس بگیرید تا از پشتیبانی لازم بهرهمند شوید.
مرحله ۲: بارگذاری فایلهای ناامن بر روی HTTPS
یکی دیگر از دلایل شایع ایجاد CSS خراب که کاربران ما با آن مواجه شدهاند، تنظیم نادرست URLهای امن است که منجر به بروز مشکلات محتوای ترکیبی (Mixed Content) میشود.
این مشکل زمانی رخ میدهد که وبسایت شما برای استفاده از پروتکل امنیتی HTTPS تنظیم شده باشد، اما فایلهای CSS از طریق HTTP یا پروتکل ناامن بارگذاری شوند.
وقتی این اتفاق میافتد، مرورگرهای محبوب مانند Google Chrome به طور خودکار منابع ناامن را مسدود میکنند که این مسدود شدن باعث خراب شدن CSS در ناحیه مدیریت وردپرس میشود.
برای اطمینان از این مسئله، میتوانید از ابزار Inspect در مرورگر خود استفاده کنید: به تب Console بروید.
خطای Mixed Content را مشاهده خواهید کرد.
برای رفع این مسئله، ابتدا باید مطمئن شوید که تنظیمات وردپرس شما دارای URLهای صحیح هستند.
به مسیر Settings » General بروید. اطمینان حاصل کنید که هر دو گزینه WordPress Address و Site Address از پروتکل HTTPS استفاده میکنند.
اگر هر دو URL شما از قبل از HTTPS استفاده میکنند، میتوانید به صورت دستی وردپرس را مجبور به استفاده از پروتکل HTTPS کنید.
برای این کار: فایل wp-config.php خود را ویرایش کنید. کد زیر را به فایل اضافه کنید:
define('FORCE_SSL_ADMIN', true);
if (strpos($_SERVER['HTTP_X_FORWARDED_PROTO'], 'https') !== false) {
$_SERVER['HTTPS'] = 'on';
}
همچنین میتوانید از پلاگینهایی مانند Really Simple SSL استفاده کنید تا HTTPS برای تمام URLها اجباری شود.
برای جزئیات بیشتر، آموزش ما در مورد رفع خطای محتوای ترکیبی (Mixed Content) در وردپرس را مطالعه کنید.
مرحله ۳: بررسی تداخل قالب
براساس تجربیات ما، تداخل غیرضروری قالبها نیز یکی از دلایل رایج ایجاد CSS خراب در ناحیه مدیریت وردپرس است.
نحوه شناسایی و رفع مشکلات مربوط به قالب
تعویض به یک قالب پیشفرض
برای بررسی اینکه آیا قالب وردپرس شما باعث ایجاد مشکل CSS شده است یا خیر، ابتدا باید به یک قالب پیشفرض وردپرس سوئیچ کنید.
به داشبورد وردپرس بروید. به مسیر Appearance » Themes بروید. یک قالب پیشفرض وردپرس، مانند Twenty Twenty-Four، را فعال کنید.
توجه: اگر هیچ قالب پیشفرضی در وردپرس نصب نشده باشد، میتوانید با کلیک بر روی دکمه ‘Add New Theme’ در بالای صفحه، یک قالب پیشفرض نصب کنید. قالبهای پیشفرض وردپرس معمولاً بر اساس سال نامگذاری شدهاند.
بعد از تعویض به یک قالب پیشفرض، ناحیه مدیریت خود را بازنشانی کرده یا صفحه را دوباره بارگذاری کنید تا بررسی کنید آیا مشکل CSS برطرف شده است یا خیر.
اگر اکنون CSS به درستی بارگذاری میشود، پس مشکل مربوط به قالب قبلی شماست.
رفع تداخل قالب
برای رفع این مشکل، ابتدا باید بررسی کنید که آیا بهروزرسانی برای قالب شما موجود است یا خیر.
به مسیر Appearance » Themes بروید. قالب خود را انتخاب کرده و بر روی ‘Update now’ کلیک کنید.
در صورتی که مشکل برطرف نشد، باید تغییراتی که در قالب خود ایجاد کردهاید را بررسی کنید. تمام تغییرات و سفارشیسازیهایی که ممکن است باعث ایجاد مشکل CSS خراب شده باشند را بررسی کنید.
بهطور خاص، بررسی کدهای CSS اضافی یا کدهای سفارشی در فایل functions.php بسیار مهم است تا خطایی در آنها وجود نداشته باشد.
اقدام نهایی: در صورتی که نتوانستید مشکل را حل کنید، با توسعهدهنده قالب تماس بگیرید یا به یک قالب دیگر سوئیچ کنید.
توصیه ما برای جلوگیری از بروز این نوع اشتباهات در آینده، استفاده از WPCode را پیشنهاد میکنیم. این ابزار بهترین پلاگین برای مدیریت کدهای سفارشی در وردپرس است که به شما امکان میدهد تمام CSSهای سفارشی خود را در یک مکان مدیریت کنید و بدون نیاز به ویرایش فایل functions.php این کار را انجام دهید.
مزایای WPCode:
- میتوانید کدهای CSS سفارشی خود را به سادگی ذخیره و مدیریت کنید.
- WPCode شامل بررسیهای داخلی برای شناسایی خطاهاست.
- با تعویض قالب، کدهای CSS سفارشی شما از بین نمیروند.
نسخه رایگان WPCode با قابلیتهای محدود نیز در دسترس است.
ما از WPCode در وبسایتهای خود برای مدیریت کدهای سفارشی، از جمله CSS سفارشی، استفاده میکنیم. برای جزئیات بیشتر، بررسی WPCode ما را ببینید.
مرحله ۴: رفع مشکلات کش
به طور معمول، پلاگینهای کش وردپرس ناحیه مدیریت وردپرس را کش نمیکنند.
با این حال، گاهی اوقات تنظیمات نادرست کش میتواند با کش مرورگر تداخل ایجاد کرده و منجر به بروز مشکلات CSS خراب شود.
برای رفع این مشکل، ابتدا کش مرورگر خود را پاک کنید.
بعد از این، ناحیه مدیریت وردپرس را دوباره بارگذاری کنید تا بررسی کنید آیا مشکل برطرف شده است یا خیر. اگر مشکل برطرف نشد، باید کش وردپرس را نیز پاک کنید.
این کش توسط پلاگین کش وردپرس شما ایجاد شده است. ما یک آموزش جامع در مورد نحوه پاک کردن کش در پلاگینهای مختلف کش وردپرس داریم.
مرحله ۵: رفع مشکلات CDN
اگر از سرویس شبکه تحویل محتوا (CDN) استفاده میکنید، پیکربندی نادرست گاهی اوقات میتواند باعث بروز مشکلات CSS خراب در ناحیه مدیریت وردپرس شود.
نحوه شناسایی و رفع این مشکلات
ابتدا ابزار Inspect را در مرورگر خود باز کرده و به تب ‘Console’ بروید. در این بخش، اگر فایلهای CSS مسدود شده باشند یا پیدا نشوند، خطاهایی نمایش داده خواهد شد.
بعد از این، به وبسایت سرویس CDN خود بروید و وارد حساب کاربری خود شوید.
سپس به بخش Caching » Configuration بروید و بر روی دکمه ‘Purge Everything’ در قسمت Purge Cache کلیک کنید.
توجه: ما نمونه تصویر مربوط به CDN کلودفلر (Cloudflare) را به شما نمایش میدهیم. با این حال، گزینه مربوط به پاک کردن کش در تمام ارائهدهندگان CDN به سادگی قابل یافتن است.
بعد از این، به وبسایت خود بازگشته و ناحیه مدیریت را دوباره بارگذاری کنید تا بررسی کنید آیا مشکل برطرف شده است یا خیر.
اگر مشکل برطرف نشد، به مرحله بعدی بروید.
مرحله ۶: رفع مشکلات مجوز فایل نادرست
ما متوجه شدهایم که مجوزهای نادرست فایل میتواند مانع از خواندن فایلهای CSS توسط سرور شده و منجر به بروز مشکلات CSS خراب در ناحیه مدیریت وردپرس شود.
نحوه بررسی و رفع مشکلات مجوز فایل
ابتدا باید از طریق FTP به وبسایت وردپرس خود متصل شوید.
بعد از اتصال، به دایرکتوری ریشه وردپرس (Root Directory) بروید. این دایرکتوری شامل پوشههای wp-admin، wp-includes و wp-content است.
حالا بر روی پوشه wp-admin کلیک راست کرده و گزینه ‘File permissions’ یا ‘Properties’ را انتخاب کنید.
ابتدا باید مطمئن شوید که تمام دایرکتوریها بر روی ۷۵۵ تنظیم شدهاند.
اگر اینطور نباشد، مجوزها را تغییر داده و تغییرات را به صورت بازگشتی (recursive) برای تمام زیرپوشهها اعمال کنید.
حالا میتوانید این فرآیند را تکرار کرده و مجوز فایلها را بر روی ۶۴۴ تنظیم کرده و تغییرات را به صورت بازگشتی (recursive) فقط برای فایلها اعمال کنید.
برای جزئیات بیشتر، آموزش ما در مورد تنظیم مجوز فایلها در وردپرس را بررسی کنید.
بعد از این، به ناحیه مدیریت بروید تا بررسی کنید آیا مشکل CSS خراب برطرف شده است یا خیر. اگر هنوز مشکل وجود دارد، به مرحله بعدی بروید.
مرحله ۷: تعمیر فایلهای خراب
فایلهای خراب میتوانند باعث بروز مشکلات CSS خراب در ناحیه مدیریت وردپرس شوند.
فایلهای وردپرس میتوانند حتی بدون دخالت شما خراب شوند. این مسئله ممکن است به دلیل بهروزرسانی ناقص وردپرس، حذف تصادفی فایلها یا پیکربندی نادرست از سوی میزبان وردپرس شما ایجاد شود.
نحوه تعمیر یا جایگزینی فایلهای خراب
ابتدا باید نسخهای تازه از وردپرس را از وبسایت WordPress.org دانلود کنید.
سپس فایل فشرده ZIP دانلود شده را بر روی کامپیوتر خود استخراج کنید.
بعد از این، از طریق FTP به وبسایت وردپرس خود متصل شده و فایلهای تازه وردپرس را از کامپیوتر خود به سرور آپلود کنید.
هنگام مشاهده درخواست، گزینه ‘Overwrite’ (بازنویسی) را انتخاب کنید تا فایلهای جدید به درستی در وبسایت شما آپلود شوند.
پس از اتمام، به ناحیه مدیریت وردپرس خود بروید و بررسی کنید آیا مشکل CSS خراب برطرف شده است یا خیر.
اگر این روش مشکل را حل نکرد، به مرحله بعدی بروید.
مرحله ۸: بررسی افزونههای مرورگر
افزونههای مرورگر، بهویژه افزونههای مرتبط با مسدودسازی محتوا و تبلیغات، میتوانند در نمایش CSS در ناحیه مدیریت وردپرس اختلال ایجاد کنند.
نحوه شناسایی و رفع مشکلات ناشی از افزونههای مرورگر
ابتدا مرورگر خود را باز کرده و به منوی Extensions/Add-ons (افزونهها/افزودنیها) بروید.
به صورت موقت همه افزونهها، بهویژه افزونههای مسدودکننده تبلیغات و افزودنیهای امنیتی را غیرفعال کنید.
میتوانید افزونهها را بهسادگی غیرفعال کرده یا آنها را به طور کامل حذف کنید.
پس از انجام این کار، به ناحیه مدیریت وردپرس بروید و بررسی کنید که آیا مشکل CSS برطرف شده است یا خیر.
اگر مشکل حل شد، باید بفهمید کدام افزونه باعث این مسئله شده است.
هر افزونه را به صورت جداگانه فعال کنید و پس از فعال کردن هر افزونه، ناحیه مدیریت را رفرش کنید تا افزونهای که مشکل ایجاد میکند شناسایی شود.
پس از شناسایی افزونههای مشکلساز، میتوانید تنظیمات آن افزونه را بررسی کنید تا از مسدود شدن CSS مدیریت وردپرس جلوگیری کنید.
اگر این روش کارساز نبود، سعی کنید یک افزونه جایگزین پیدا کنید.
نکات عیبیابی
امیدواریم مراحل بالا مشکل CSS در ناحیه مدیریت وردپرس را برطرف کرده باشد. با این حال، اگر هیچ یک از مراحل بالا مؤثر نبود، میتوانید این نکات اضافی را امتحان کنید:
بهروزرسانی پیوندهای یکتا:
پیوندهای یکتای وردپرس را رفرش کنید تا فایل .htaccess بهروزرسانی شود بدون اینکه خطایی ایجاد شود. گاهی اوقات قوانین بازنویسی وردپرس میتوانند مانع از بارگذاری صحیح فایلهای CSS شوند. این کار به پاکسازی و تنظیم مجدد قوانین بازنویسی URL کمک میکند.
اسکن برای بدافزار:
گاهی اوقات، یک تلاش هکری یا وجود بدافزار میتواند باعث خرابی ظاهر ناحیه مدیریت شود. سایت وردپرسی خود را برای شناسایی بدافزار احتمالی اسکن کرده و اقدام به پاکسازی سایت هکشده کنید.
امیدواریم این مقاله به شما کمک کرده باشد تا مشکل CSS خراب در ناحیه مدیریت وردپرس را برطرف کنید. همچنین، ممکن است بخواهید راهنمای عیبیابی وردپرس ما را برای روشهای اضافی جهت رفع مشکلات وردپرس بررسی کنید یا راهنمای ما در مورد نحوه درخواست پشتیبانی وردپرس بهصورت صحیح را مشاهده کنید.
اگر این مقاله را دوست داشتید، لطفاً در کانال یوتیوب ما برای آموزشهای ویدیویی وردپرس عضو شوید. همچنین، میتوانید ما را در توییتر و فیسبوک پیدا کنید.
دیدگاهتان را بنویسید