تصاویر وردپرس نمایش داده نمی شود و این یکی از آزاردهنده‌ترین خطاهایی است که هم تجربه‌ی کاربر را تخریب می‌کند و هم به‌طور مستقیم روی سئو و نرخ تبدیل اثر می‌گذارد. سال‌هاست روی سایت‌های وردپرسی با این مشکل مواجه می‌شوم و در تجربه‌ام، تصاویر در سه مرحله‌ی کاملاً متفاوت می‌توانند از کار بیفتند: بارگذاری (آپلود)، نمایش (رندر در مرورگر) و رندر پس از بهینه‌سازی. تفکیک این سه مرحله، اولین گام در پیدا کردن ریشه است.

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

بارگذاری تصویر در وردپرس دقیقاً چه چرخه‌ای دارد؟

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

  1. آپلود از پیشخوان: کاربر فایل را انتخاب می‌کند و مرورگر آن را با درخواست POST به سرور می‌فرستد.
  2. پردازش PHP: وردپرس فایل را در حافظه‌ی موقت ذخیره می‌کند و با کتابخانه‌ی GD یا Imagick ابعاد و نسخه‌های مختلف (تامنیل، medium، large) را می‌سازد.
  3. ذخیره در دیسک: فایل اصلی و نسخه‌های مختلف در پوشه‌ی wp-content/uploads ذخیره می‌شوند.
  4. ثبت در دیتابیس: وردپرس یک رکورد در جدول wp_posts با نوع attachment ثبت می‌کند و متادیتای ابعاد و مسیر را در wp_postmeta نگه می‌دارد.
  5. رندر در HTML: وقتی نوشته‌ای حاوی تصویر نمایش داده می‌شود، وردپرس تگ <img> با مسیر درست تولید می‌کند.
  6. درخواست مرورگر: مرورگر به مسیر تصویر درخواست می‌فرستد و فایل را دریافت و رندر می‌کند.

هر اختلال در این شش گام، به یک پیام و یک رفتار خاص منجر می‌شود. آپلود موفق ولی نمایش ناموفق یعنی خطا در گام ۵ یا ۶. آپلود ناموفق با پیام خطا، یعنی خطا در گام ۲ یا ۳. تصویر روی دسکتاپ نمایش داده می‌شود ولی روی موبایل نه، یعنی خطا در گام ۵ در رابطه با srcset. مباحث پایه‌ای این ساختار در وردپرس چیست و چگونه شروع کنیم باز شده است.

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

تصویر در وردپرس، فقط یک فایل نیست؛ ترکیبی از فایل دیسک، رکورد دیتابیس، و تگ HTML است. برای پیدا کردن ریشه، باید هر سه را جدا بررسی کنید.

انواع خطای تصویر در وردپرس و معنای هرکدام

خطاهای تصویر در وردپرس، پیام‌ها و نشانه‌های متنوعی دارند که هرکدام به ریشه‌ی متفاوتی اشاره می‌کنند:

پیام یا نشانهریشه‌ی احتمالیاقدام اولیه
آیکون شکسته در مرورگرمسیر فایل نادرست یا فایل حذف‌شدهبررسی مسیر فایل در پوشه‌ی uploads
کادر خالی به‌جای تصویرمشکل در رندر یا srcsetبررسی تگ img در View Source
پیام «فرمت پشتیبانی نمی‌شود»فرمت فایل ناشناختهتبدیل به فرمت استاندارد
پیام «خطای حافظه» در آپلودمحدودیت PHP یا ابعاد بزرگکاهش ابعاد یا افزایش memory_limit
تصویر روی دسکتاپ اما نه در موبایلمشکل در srcset یا media queryغیرفعال‌سازی بهینه‌سازی موبایل
تصویر در شبکه‌های اجتماعی نیستOpen Graph یا تصویر شاخصبررسی افزونه‌ی سئو و تصویر شاخص
تصویر فقط برای کاربران ناشناس نیستمسدودسازی بر اساس refererبررسی هات‌لینک پروتکشن
تصویر بعد از CDN نیستکش CDN یا مسیر ناسازگارپاک‌سازی کش CDN و بررسی URL

در تجربه‌ی چندساله‌ام، پنج نشانه‌ی اول شایع‌تر هستند و در ۸۰ درصد موارد، با پاک‌سازی کش و بررسی مجوز پوشه‌ی uploads حل می‌شوند. بقیه‌ی موارد، نیازمند عیب‌یابی دقیق‌تر در لایه‌های دیگر است.

ده ریشه‌ی اصلی نمایش داده نشدن تصاویر

در عیب‌یابی نمایش داده نشدن تصاویر روی سایت‌های وردپرسی، این ده ریشه بیش از بقیه تکرار می‌شوند:

ریشه‌ی اول: مجوز نامناسب پوشه‌ی uploads

شایع‌ترین دلیل. اگر مجوز پوشه‌ی wp-content/uploads روی 700 یا مجوز فایل‌ها روی 600 باشد، وب‌سرور نمی‌تواند آن‌ها را بخواند و تصویر نمایش داده نمی‌شود. این سناریو معمولاً بعد از مهاجرت سرور یا تغییر مجوزهای پوشه رخ می‌دهد. مباحث مرتبط در رفع خطای مجوز فایل در وردپرس باز شده است.

ریشه‌ی دوم: فایل حذف‌شده از دیسک

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

ریشه‌ی سوم: مشکل در افزونه‌ی بهینه‌سازی تصویر

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

ریشه‌ی چهارم: فرمت پشتیبانی‌نشده

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

ریشه‌ی پنجم: محدودیت حافظه در پردازش تصویر

در آپلود تصاویر بزرگ، وردپرس نیاز به حافظه‌ی زیاد برای ساخت نسخه‌های مختلف دارد. اگر memory_limit کافی نباشد، پردازش تصویر نیمه‌کاره متوقف می‌شود و فقط بخشی از نسخه‌ها ساخته می‌شوند. مباحث مرتبط در راه‌حل خطای Memory Limit در PHP باز شده است.

ریشه‌ی ششم: مسدودسازی هات‌لینک

اگر سرور شما قواعد ضد هات‌لینک دارد، تصاویر سایت شما در دامنه‌های دیگر نمایش داده نمی‌شوند. اما اگر این قواعد بیش از حد سختگیرانه تنظیم شده باشند، ممکن است تصاویر در سایت خودتان هم (وقتی referer درست نیست) نمایش داده نشوند.

ریشه‌ی هفتم: مشکل در کش CDN

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

ریشه‌ی هشتم: محتوی ترکیبی (Mixed Content)

اگر سایت شما روی HTTPS باشد ولی URL تصویر با http:// باشد، مرورگر تصویر را مسدود می‌کند. این سناریو بعد از انتقال از HTTP به HTTPS رخ می‌دهد، چون URLهای قدیمی در دیتابیس باقی می‌مانند. مباحث مرتبط در ریدایرکت HTTP به HTTPS باز شده است.

ریشه‌ی نهم: مشکل در تصویر شاخص

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

ریشه‌ی دهم: مشکل در قالب یا کد سفارشی

اگر قالب یا کد سفارشی، تگ <img> را با ساختار اشتباه تولید کند، ممکن است تصویر نمایش داده نشود. این سناریو در قالب‌های سفارشی یا در هنگام استفاده از صفحه‌سازهای پیچیده، شایع‌تر است.

پروتکل واکنش سریع در بحران

اگر سایت شما همین حالا تصاویر را نمایش نمی‌دهد و مشتریان یا کاربران شکایت دارند، این پنج حرکت را به همین ترتیب اجرا کنید:

  1. تعیین دامنه‌ی خطا: سریع تست کنید که آیا همه‌ی تصاویر نمایش داده نمی‌شوند یا فقط بعضی. اگر همه، ریشه در مجوز پوشه یا مسدودسازی است. اگر فقط بعضی، ریشه در افزونه‌ی بهینه‌سازی یا فرمت است.
  2. پاک‌سازی کش: کش مرورگر، کش افزونه و کش سرور را پاک کنید. اگر از CDN استفاده می‌کنید، کش CDN را هم پاک کنید.
  3. بررسی مسیر فایل: با مرورگر، روی تصویر نمایش داده نشده راست‌کلیک کنید و Open Image in New Tab را بزنید. اگر آدرس باز شد و پیام خطای سرور داد، ریشه در سرور است. اگر آدرس باز شد و تصویر سالم بود، ریشه در رندر HTML است.
  4. غیرفعال‌سازی افزونه‌ی بهینه‌سازی: اگر افزونه‌ی بهینه‌سازی تصویر فعال است، موقتاً آن را غیرفعال کنید و سایت را تست کنید.
  5. بررسی مجوز پوشه: از طریق FTP، مجوز پوشه‌ی wp-content/uploads را بررسی کنید. باید 755 باشد.

نکته‌ی میدانی: در بحران، اول مسیر یک تصویر را در مرورگر باز کنید. تجربه‌ی من نشان داده که این کار ساده، در چند ثانیه ریشه را از هم جدا می‌کند: اگر مسیر باز شد ولی تصویر سفید بود، ریشه در سرور است؛ اگر مسیر باز شد و تصویر سالم بود، ریشه در HTML یا افزونه است.

تشخیص دقیق با DevTools و لاگ‌ها

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

DevTools مرورگر

در مرورگر، ابزار DevTools را باز کنید (کلید F12) و به تب Network بروید. صفحه را ریلود کنید و فیلتر Img را فعال کنید. برای هر تصویر، سه چیز را بررسی کنید:

  1. کد وضعیت پاسخ: اگر ۲۰۰ باشد ولی تصویر نمایش داده نشود، ریشه در کد HTML یا CSS است. اگر ۴۰۴ باشد، فایل وجود ندارد. اگر ۴۰۳ باشد، مجوز مشکل دارد. اگر ۵۰۰ باشد، خطای سرور است.
  2. حجم پاسخ: اگر ۰ بایت باشد، سرور پاسخ خالی داده است. این سناریو در تداخل با افزونه‌ی بهینه‌سازی شایع است.
  3. زمان پاسخ: اگر زمان پاسخ بسیار بالا باشد، مسئله‌ی سرعت مطرح است که ممکن است منجر به timeout شود.

در تب Elements، تگ <img> تصویر مشکل‌دار را بررسی کنید. اگر آدرس در src نادرست بود، ریشه در قالب یا افزونه است. اگر srcset به فایل‌های نادرست اشاره می‌کند، ریشه در بهینه‌سازی تصویر است. مباحث مرتبط در پیدا کردن خطاهای جاوااسکریپت در کنسول مرورگر باز شده است.

لاگ سرور

لاگ وب‌سرور، دقیق‌ترین منبع برای تشخیص خطای تصویر است. اگر فایل تصویر را درخواست کنید و ۴۰۴ یا ۴۰۳ بگیرید، این خطا در لاگ ثبت می‌شود. با دستور زیر می‌توانید خطاهای مربوط به تصاویر را ببینید:

grep -E "\.(jpg|jpeg|png|gif|webp|avif)" /var/log/nginx/access.log | tail -50

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

ابزارهای آنلاین بررسی تصویر

ابزارهایی مثل HTTP Status Checker یا ابزارهای مشابه، می‌توانند وضعیت هر تصویر را از نقطه‌ی خارجی بررسی کنند. این ابزارها برای تشخیص مشکلات مربوط به CDN یا فایروال مفید هستند.

مجوز پوشه‌ی uploads و مالکیت فایل‌ها

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

مجوزهای استاندارد

مجوزهای استاندارد برای پوشه‌ی uploads و فایل‌های داخل آن:

  • پوشه‌های داخل wp-content/uploads: مجوز 755
  • فایل‌های تصویر: مجوز 644

اگر پوشه‌ای مجوز 700 داشته باشد، وب‌سرور نمی‌تواند آن را بخواند و تصاویر داخل آن نمایش داده نمی‌شوند.

بازنشانی مجوزها با SSH

از طریق SSH، می‌توانید مجوزها را در چند ثانیه بازنشانی کنید:

cd /path/to/wordpress/wp-content/uploads
find . -type d -exec chmod 755 {} \;
find . -type f -exec chmod 644 {} \;

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

مالکیت فایل‌ها

علاوه بر مجوز، مالکیت فایل‌ها هم مهم است. در سرورهای معمولی cPanel، مالک باید همان کاربر هاست باشد. در سرورهای اختصاصی، مالک معمولاً www-data است. بررسی و اصلاح:

ls -la /path/to/wordpress/wp-content/uploads/
chown -R username:username /path/to/wordpress/wp-content/uploads

مشکل خاص: پوشه‌های ساخته‌شده توسط PHP

وقتی وردپرس یک تصویر جدید آپلود می‌کند، پوشه‌ی ماهانه (مثل uploads/2026/10/) به‌طور خودکار ساخته می‌شود. اگر کاربر PHP-FPM مجوز ساخت پوشه را نداشته باشد، این پوشه با مالکیت اشتباه ساخته می‌شود و بعداً نمی‌تواند فایل‌ها را بخواند. راه‌حل: بررسی مالکیت پوشه‌های جدید و اصلاح آن‌ها. مباحث مرتبط در رفع خطای آپلود فایل در وردپرس باز شده است.

فرمت‌های پشتیبانی‌نشده و فایل‌های WebP

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

پشتیبانی مرورگرها از فرمت‌های مختلف

فرمت‌های اصلی تصویر در وب:

  • JPEG: پشتیبانی جهانی، مناسب عکس
  • PNG: پشتیبانی جهانی، مناسب گرافیک با شفافیت
  • GIF: پشتیبانی جهانی، مناسب انیمیشن‌های ساده
  • WebP: پشتیبانی در مرورگرهای مدرن، حجم کمتر
  • AVIF: پشتیبانی در مرورگرهای جدیدتر، حجم بسیار کمتر

اگر سایت شما از افزونه‌ی بهینه‌سازی استفاده می‌کند که تصاویر را به WebP تبدیل می‌کند، اما مرورگر کاربر از WebP پشتیبانی نمی‌کند، تصویر نمایش داده نمی‌شود. راه‌حل: استفاده از تگ <picture> با fallback یا استفاده از افزونه‌هایی که fallback درست را مدیریت می‌کنند. مباحث مرتبط در تصاویر ریسپانسیو چیست باز شده است.

مشکل خاص در سرورهای قدیمی

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

فایل‌های تصویر با پسوند اشتباه

گاهی فایلی با پسوند .jpg ذخیره شده ولی محتوایش در واقع WebP یا PNG است. در این حالت، بعضی مرورگرها فایل را رد می‌کنند. تشخیص: با ابزار file در خط فرمان بررسی کنید:

file /path/to/image.jpg

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

محدودیت حافظه و اندازه‌ی تصویر

در آپلود و پردازش تصاویر بزرگ، محدودیت‌های PHP می‌توانند باعث شکست شوند. سه محدودیت کلیدی:

memory_limit

وردپرس برای ساخت نسخه‌های مختلف یک تصویر (تامنیل، medium، large)، فایل را در حافظه بارگذاری می‌کند. یک تصویر ۱۰ مگاپیکسلی می‌تواند به ۵۰ تا ۱۰۰ مگابایت حافظه نیاز داشته باشد. اگر memory_limit پایین باشد، پردازش نیمه‌کاره متوقف می‌شود. راه‌حل: افزایش این مقدار به ۲۵۶ مگابایت یا بیشتر:

memory_limit = 256M

upload_max_filesize و post_max_size

این دو مقدار، حداکثر حجم فایل قابل آپلود را مشخص می‌کنند. اگر مقدار پایین باشد، آپلود تصاویر بزرگ با خطا مواجه می‌شود. راه‌حل: افزایش به ۶۴ مگابایت یا بیشتر:

upload_max_filesize = 64M
post_max_size = 64M

max_execution_time

پردازش تصویر بزرگ می‌تواند چند ثانیه طول بکشد. اگر مقدار max_execution_time پایین باشد، اسکریپت قبل از اتمام کار متوقف می‌شود. راه‌حل: افزایش این مقدار به ۳۰۰ ثانیه. مباحث مرتبط در رفع خطای Maximum execution time در PHP باز شده است.

مشکل خاص: تصاویر بزرگ با ابعاد بالا

اگر تصویری با ابعاد بسیار بالا (مثل ۸۰۰۰×۶۰۰۰ پیکسل) آپلود شود، حتی با حافظه‌ی کافی، ممکن است پردازش با خطا مواجه شود. راه‌حل: کاهش ابعاد قبل از آپلود یا استفاده از افزونه‌هایی که ابعاد را در حین آپلود محدود می‌کنند. مباحث مرتبط در فشرده‌سازی تصاویر سایت باز شده است.

تداخل افزونه‌های بهینه‌سازی و کش

افزونه‌های بهینه‌سازی تصویر و کش، شایع‌ترین مقصر در نمایش داده نشدن تصاویر بعد از پیکربندی هستند.

افزونه‌های بهینه‌سازی تصویر

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

افزونه‌های کش

افزونه‌های کش مثل WP Rocket یا LiteSpeed Cache، صفحات و تصاویر را کش می‌کنند. اگر کش به‌درستی پاک نشود، کاربران نسخه‌ی قدیمی تصویر را می‌بینند یا اگر تصویر جدید جایگزین شده باشد، همچنان نسخه‌ی قدیمی نمایش داده می‌شود. راه‌حل: پاک‌سازی کامل کش افزونه. مباحث مرتبط در بهترین افزونه‌های کش وردپرس باز شده است.

تداخل همزمان چند افزونه‌ی تصویر

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

روش تشخیص افزونه‌ی مقصر

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

هات‌لینک به معنای استفاده از تصاویر یک سایت در سایت دیگر است. برای جلوگیری از این کار، بعضی سرورها قواعد ضد هات‌لینک در فایل .htaccess یا در CDN تنظیم می‌کنند.

مشکل خاص: قواعد سختگیرانه

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

نمونه قاعده‌ی استاندارد در htaccess

RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^https?://(www\.)?yourdomain\.com [NC]
RewriteRule \.(jpg|jpeg|png|gif|webp)$ - [F,NC]

این قاعده، اگر referer خالی نباشد و به دامنه‌ی اصلی هم اشاره نکند، درخواست تصویر را با خطای ۴۰۳ رد می‌کند. اگر این قاعده با تنظیمات سایت شما ناسازگار باشد، ممکن است تصاویر خودتان هم مسدود شوند.

مشکل در CDN

در بعضی CDNها مثل Cloudflare، گزینه‌ی Hotlink Protection وجود دارد. اگر این گزینه فعال باشد و تنظیمات آن اشتباه، ممکن است تصاویر سایت شما در دامنه‌های دیگر (مثل شبکه‌های اجتماعی یا موتورهای جستجو) نمایش داده نشوند. راه‌حل: در پنل CDN، دامنه‌های مجاز را گسترش دهید.

روش تشخیص

سریع‌ترین تست: مرورگر را در حالت Incognito باز کنید و آدرس تصویر را مستقیماً تایپ کنید. اگر تصویر نمایش داده شد، ریشه در referer یا قاعده‌ی ضد هات‌لینک است. اگر نمایش داده نشد، ریشه در مجوز یا وجود فایل است.

محتوی ترکیبی و انتقال HTTPS

محتوی ترکیبی (Mixed Content) زمانی رخ می‌دهد که صفحه‌ی HTTPS شما شامل تصاویری باشد که با http:// لود می‌شوند. مرورگرهای مدرن این تصاویر را به‌طور کامل مسدود می‌کنند و فقط آیکون شکسته نمایش می‌دهند.

علت اصلی

وقتی سایت شما از HTTP به HTTPS منتقل می‌شود، URLهای داخلی در دیتابیس به http:// باقی می‌مانند. اگر این URLها به‌روزرسانی نشوند، تصاویر مسدود می‌شوند. راه‌حل: بازنویسی URLها در دیتابیس. مباحث مرتبط در ریدایرکت HTTP به HTTPS باز شده است.

روش تشخیص محتوی ترکیبی

در مرورگر، ابزار DevTools را باز کنید و به تب Console بروید. هشدارهای Mixed Content: The page at ... was loaded over HTTPS, but requested an insecure image ... را ببینید. هر هشدار، به یک تصویر مسدودشده اشاره می‌کند.

راه‌حل سریع

افزونه‌هایی مثل Really Simple SSL می‌توانند URLهای داخلی را در دیتابیس بازنویسی کنند. یا با کوئری مستقیم در دیتابیس:

UPDATE wp_posts SET post_content = REPLACE(post_content, 'http://yourdomain.com', 'https://yourdomain.com');

قبل از اجرای این کوئری، بکاپ کامل دیتابیس بگیرید. مباحث مرتبط با بکاپ در پشتیبان‌گیری از سایت وردپرس باز شده است.

بازگردانی تصاویر و اولویت‌بندی

بعد از پیدا کردن ریشه، نوبت به بازگردانی تصاویر می‌رسد. ترتیب اولویت‌بندی من در پروژه‌های واقعی:

  1. بازگردانی سریع تصاویر پرترافیک: ابتدا تصاویری که در صفحات پرترافیک یا محصولات اصلی سایت هستند را بررسی و اصلاح کنید.
  2. اصلاح مجوزها: اگر ریشه در مجوز است، با دستورات استاندارد مجوزها را بازنشانی کنید.
  3. غیرفعال‌سازی افزونه‌ی مقصر: اگر ریشه در افزونه‌ی بهینه‌سازی یا کش است، موقتاً آن را غیرفعال کنید.
  4. پاک‌سازی کش: کش مرورگر، کش افزونه و کش CDN را پاک کنید.
  5. بازنویسی URLها: اگر ریشه در محتوی ترکیبی است، URLهای HTTP را به HTTPS تغییر دهید.
  6. مستندسازی: ریشه، روش تشخیص و راه‌حل را ثبت کنید.

پایش مستمر و پیشگیری

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

سطح اول: پایش بصری دوره‌ای

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

سطح دوم: پایش خودکار با ابزارها

ابزارهایی مثل Visualping یا Uptime Robot می‌توانند نسخه‌ی اسکرین‌شات صفحه‌ی شما را در بازه‌های دوره‌ای بگیرند و تغییرات را نشان دهند. این ابزارها برای سایت‌های بزرگ با محتوای زیاد مفید هستند.

سطح سوم: پایش Core Web Vitals

ابزارهایی مثل PageSpeed Insights می‌توانند مشکلات مربوط به تصاویر را نشان دهند، حتی قبل از این‌که کاربران متوجه شوند. اگر LCP افت کرد، احتمالاً مشکل در تصاویر است. مباحث مرتبط در تأثیر تصاویر سنگین بر Core Web Vitals باز شده است.

سطح چهارم: پایش لاگ سرور

لاگ سرور می‌تواند خطاهای مربوط به تصاویر (۴۰۴، ۴۰۳) را نشان دهد. پایش هفتگی لاگ، از بروز مشکلات جدی جلوگیری می‌کند. مباحث مرتبط در بررسی خطاهای سرور در لاگ‌ها باز شده است.

سطح پنجم: بکاپ منظم قبل از تغییرات

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

پرسش‌های پرتکرار درباره نمایش داده نشدن تصاویر وردپرس

چرا تصویر در کتابخانه‌ی رسانه هست ولی در سایت نمایش داده نمی‌شود؟

این الگو معمولاً به یکی از سه دلیل برمی‌گردد: مشکل در تگ <img> و مسیر نادرست، مشکل در مجوز فایل در دیسک، یا مشکل در افزونه‌ی بهینه‌سازی که مسیر را به فایل غیرموجود تغییر داده است. بررسی DevTools و تب Network، سریع‌ترین راه تشخیص است.

آیا افزونه‌های کش می‌توانند باعث نمایش داده نشدن تصاویر شوند؟

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

چرا تصویر روی دسکتاپ نمایش داده می‌شود ولی روی موبایل نه؟

این الگو معمولاً به srcset برمی‌گردد. اگر قالب یا افزونه‌ی بهینه‌سازی، نسخه‌های موبایل تصویر را نادرست تعریف کند، مرورگر موبایل نمی‌تواند تصویر را دریافت کند. راه‌حل: بررسی srcset در DevTools. مباحث مرتبط در بهینه‌سازی تصاویر برای موبایل باز شده است.

چرا تصویر شاخص در شبکه‌های اجتماعی نمایش داده نمی‌شود؟

سه دلیل رایج: اول، تصویر شاخص به‌درستی به نوشته متصل نیست. دوم، متادیتای Open Graph به‌درستی تنظیم نشده. سوم، فایل تصویر از نظر ابعاد با استانداردهای شبکه‌های اجتماعی هماهنگ نیست. راه‌حل: بررسی افزونه‌ی سئو و اطمینان از ابعاد مناسب تصویر. مباحث مرتبط در توابع تصویر شاخص در وردپرس باز شده است.

آیا خطای نمایش داده نشدن تصاویر می‌تواند ناشی از حمله باشد؟

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

چطور بفهمم ریشه در فرمت تصویر است؟

آدرس تصویر را در مرورگر باز کنید. اگر پیام خطای The image cannot be displayed because it contains errors یا مشابه دید، احتمالاً فرمت فایل ناسازگار است. با دستور file در خط فرمان، فرمت واقعی فایل را بررسی کنید.

آیا مشکل مجوز پوشه می‌تواند فقط روی تصاویر جدید اثر بگذارد؟

بله. اگر پوشه‌ی ماهانه‌ی جدید (مثل uploads/2026/10/) با مالکیت یا مجوز اشتباه ساخته شود، فقط تصاویر جدید نمایش داده نمی‌شوند و تصاویر قدیمی سالم می‌مانند. راه‌حل: بررسی مالکیت پوشه‌های جدید و اصلاح آن‌ها. مباحث مرتبط در رفع خطای مجوز فایل در وردپرس باز شده است.

آیا تصاویر WebP در همه‌ی مرورگرها نمایش داده می‌شوند؟

مرورگرهای مدرن (Chrome، Firefox، Safari نسخه‌های جدید) از WebP پشتیبانی می‌کنند. اما مرورگرهای قدیمی یا بعضی دستگاه‌های خاص ممکن است از آن پشتیبانی نکنند. راه‌حل: استفاده از تگ <picture> با fallback یا استفاده از افزونه‌هایی که fallback درست را مدیریت می‌کنند.

چطور بفهمم مشکل از CDN است یا سرور اصلی؟

سریع‌ترین تست، دور زدن CDN است. با دستور curl -I --resolve yourdomain.com:443:server_ip https://yourdomain.com/wp-content/uploads/image.jpg می‌توانید تصویر را مستقیم از سرور اصلی تست کنید. اگر مستقیم پاسخ داد ولی از دامنه خطا آمد، ریشه در لایه‌ی CDN است.

چه زمانی نیاز به بازسازی thumbnailها داریم؟

اگر بعد از تغییر قالب یا افزونه‌ی بهینه‌سازی، تصاویر با ابعاد اشتباه نمایش داده شوند، بازسازی thumbnailها لازم است. افزونه‌هایی مثل Regenerate Thumbnails این کار را انجام می‌دهند. توجه داشته باشید که این فرآیند روی سرورهای اشتراکی می‌تواند زمان‌بر و پرمنبع باشد.

نکته‌های میدانی از رفع خطای تصویر

در پایان این مقاله، چند نکته‌ای را می‌گویم که در مستندات رسمی کم‌تر به آن‌ها اشاره می‌شود ولی در پروژه‌های واقعی بارها به کارم آمده:

نخست: اولین قدم در عیب‌یابی، باز کردن آدرس تصویر در تب جدید مرورگر است. اگر تصویر در تب جدید سالم نمایش داده شد ولی در سایت نمایش داده نمی‌شود، ریشه در HTML، CSS یا افزونه است. اگر در تب جدید هم نمایش داده نشد، ریشه در سرور، مجوز یا فرمت است. این تست ساده، در چند ثانیه مسیر عیب‌یابی را از هم جدا می‌کند.

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

سوم: پوشه‌ی wp-content/uploads را هفتگی با دستور du -sh بررسی کنید. اگر حجم پوشه به‌طور ناگهانی کم شده بود، احتمالاً فایل‌هایی حذف شده‌اند که باید فوری بررسی شوند. مباحث مرتبط در رفع خطای پرشدن هارد سرور باز شده است.

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

اگر روی سایت خود با نوعی از مشکل نمایش داده نشدن تصاویر مواجه شده‌اید که در این مقاله پوشش داده نشده، یا اگر راه‌حل متفاوتی پیدا کرده‌اید که به کارتان آمده، برای من جالب است آن را بشنوم. مشخصاً اگر خروجی DevTools یا لاگ سرور که ریشه‌ی واقعی را نشان داد، با خوانندگان دیگر به اشتراک بگذارید؛ این یادداشت‌های دقیق، برای صاحب سایت بعدی ساعت‌ها زمان صرفه‌جویی می‌کنند. 🖼️