Jangan Biarkan Nginx Merusak Tampilan 404 Kamu!

Jika kamu menggunakan Nginx sebagai web server untuk WordPress, mungkin pernah menemui situasi ini:

Saat gambar di folder /wp-content/uploads/ tidak ditemukan, Nginx langsung menampilkan halaman error 404 bawaan server (biasanya hanya teks “404 Not Found” polos), bukan halaman 404 dari WordPress atau dari theme yang kamu gunakan.

Ini tentu kurang estetis, terutama jika kamu ingin semua halaman error ditangani oleh WordPress secara konsisten.

Penyebabnya

Secara default, konfigurasi Nginx akan menangani file statis seperti gambar, CSS, atau JS di luar eksekusi WordPress. Jika file tidak ditemukan, maka error ditangani langsung oleh Nginx, melewati WordPress sepenuhnya.

Ditambah lagi, jika ada konfigurasi seperti ini di dalam blok server:

error_page 404 = /index.php;

maka semua error diarahkan paksa ke index.php, tapi bisa bentrok dengan pengaturan lain dan bahkan bikin gambar yang benar malah ikut error.

Solusi yang Tepat

1. Hapus konfigurasi global error_page 404 = /index.php; dari blok server

Contoh:

# Jangan dipakai:
# error_page 404 = /index.php;

2. Tambahkan blok khusus untuk menangani gambar yang tidak ditemukan

Tambahkan ini ke bagian rewrite rules di file konfigurasi domain kamu (misalnya di aaPanel di /www/server/panel/vhost/rewrite/namadomain.conf):

location ~* ^/wp-content/uploads/.*\.(jpg|jpeg|png|gif)$ {
try_files $uri =404;
error_page 404 /404.php;
}

Penjelasan:

• try_files $uri =404; ➜ Coba cari file, jika tidak ada, lempar error 404.
• error_page 404 /404.php; ➜ Tangani error dengan memanggil 404.php (biasanya ada di theme WordPress).

Hasil Akhir

Setelah konfigurasi di atas diaktifkan dan Nginx direload, maka:

• Jika gambar ada ➜ ditampilkan seperti biasa.
• Jika gambar hilang ➜ diarahkan ke halaman 404.php dari theme WordPress, bukan halaman polos bawaan Nginx.

Catatan Tambahan

• Pastikan file 404.php ada di folder theme aktif WordPress.
• Jangan lupa reload Nginx setelah perubahan konfigurasi:
  nginx -t && systemctl reload nginx
• Jika menggunakan cache plugin seperti LiteSpeed Cache, WP Super Cache, atau lainnya, pastikan clear cache setelah konfigurasi ini.

Kesimpulan

Dengan solusi ini, kamu tetap menjaga tampilan profesional dan konsisten di seluruh bagian website WordPress kamu — bahkan ketika pengunjung membuka link gambar yang tidak ada.

Kalau kamu pakai Nginx dan WordPress, ini adalah salah satu tweak wajib demi kenyamanan user dan SEO!