Berapa Ukuran Ideal Featured Image WordPress?

Angka yang dicari kebanyakan orang adalah 1200 x 630 piksel. Itu rasio yang dipakai Facebook, LinkedIn, dan X untuk preview link (1.91:1), dan itulah ukuran yang seharusnya untuk gambar Open Graph. Kalau Anda memasang featured image wordpress terutama supaya link yang dibagikan terlihat rapi, pakai 1200 x 630 dan cukup sampai di situ.

Tapi angka itu bukan yang benar-benar ditampilkan tema Anda di postingan. WordPress jarang menampilkan gambar unggulan wordpress Anda pada ukuran aslinya. Tema meminta ukuran gambar tertentu yang sudah terdaftar, lalu WordPress menyajikan hasil crop yang sudah dibuat sebelumnya yang cocok. Itu sebabnya gambar yang terlihat sempurna di Facebook bisa terlihat kurang tajam, melar, atau ter-crop salah di dalam template single-post Anda. Ukuran yang “benar” tergantung pada tema, bukan pada aturan universal.

Kenapa tema menimpa angka tersebut

Saat Anda meng-upload gambar, WordPress tidak menyimpan satu file saja. WordPress menjalankan wp_generate_attachment_metadata() dan membuat turunan untuk setiap ukuran gambar yang terdaftar: tiga default (thumbnail, medium, large), medium_large milik block editor (lebar 768px), plus ukuran apa pun yang didaftarkan tema atau plugin dengan add_image_size().

Tema yang ingin hero lebar 16:9 akan menulis sesuatu seperti ini di functions.php:

add_theme_support( 'post-thumbnails' );
add_image_size( 'hero-featured', 1200, 675, true );

Argumen keempat, true, berarti hard crop. WordPress akan meng-crop gambar Anda tepat menjadi 1200 x 675, membuang apa pun yang tidak muat di kotak 16:9. Kalau subjek gambar Anda berada di dekat bagian atas atau bawah frame, bagian itu terpotong. Kalau di-set false (atau dihilangkan), gambar diskalakan secara proporsional dan dimensi akhirnya bisa berbeda dari yang Anda minta.

Lalu template menentukan ukuran mana yang diambil:

the_post_thumbnail( 'hero-featured' );

Nama apa pun yang dikirim ke the_post_thumbnail() itulah crop yang dirender. Jadi ukuran featured image yang sebenarnya di situs Anda ditentukan di dua tempat yang bukan Anda yang menulisnya: pemanggilan add_image_size() dan pemanggilan the_post_thumbnail() di tema. Meng-upload file yang lebih besar tidak mengubah keduanya.

Ada satu lapisan lagi. WordPress menyajikan srcset, jadi di layar yang lebih kecil browser bisa saja memuat turunan medium atau large alih-alih crop penuh. Dimensi yang Anda lihat di DevTools sering kali bukan yang Anda upload.

Cara memperbaikinya, secara berurutan

1. Cari tahu apa yang sebenarnya diminta tema Anda. Sebelum menebak-nebak, lihat setiap ukuran yang WordPress hasilkan dari gambar Anda dan mana yang jadi hero yang ter-crop. Masukkan gambar Anda ke tool ukuran gambar WordPress — tool ini menampilkan setiap turunan yang akan dibuat WP, pada dimensi piksel yang persis, sehingga Anda bisa menyesuaikan file sumber dengan target sebenarnya, bukan mitos 1200x630.

2. Upload cukup besar untuk menutupi crop terbesar. Kalau hero tema adalah 1200 x 675, upload minimal segitu, dan idealnya 2x untuk retina (2400 x 1350). WordPress menurunkan skala dengan mulus; ia tidak pernah menaikkan skala. Sumber yang terlalu kecil adalah penyebab paling umum featured image jadi gambar pecah.

3. Sesuaikan rasio aspek Anda dengan crop tema. Kalau tema melakukan hard crop ke 16:9, beri dia gambar 16:9. Susun komposisi dengan subjek di tengah supaya hard crop tidak memenggal kepala siapa pun.

4. Kalau ukuran yang terdaftar salah, ubah lalu regenerate. Edit nilai add_image_size() di child theme, lalu bangun ulang thumbnail yang sudah ada — dimensi baru hanya berlaku untuk upload berikutnya sampai Anda melakukan ini:

wp media regenerate --yes

Tidak punya WP-CLI? Plugin Regenerate Thumbnails melakukan hal yang sama dari dashboard.

Yang tidak boleh dilakukan

Jangan cuma upload gambar 1200x630 lalu berasumsi semuanya beres. Kalau ukuran yang terdaftar di tema adalah 16:9, WordPress melakukan hard crop pada gambar 1.91:1 Anda dan Anda kehilangan bagian atas dan bawahnya. Angka Open Graph dan angka tampilan adalah dua pekerjaan yang berbeda.

Jangan menonaktifkan ukuran gambar WordPress untuk “mempertahankan yang asli”. Ada saja saran untuk men-set ukuran menengah ke 0 atau melepas hook the_post_thumbnail. Akibatnya tema jatuh kembali menyajikan file ukuran penuh yang diskalakan turun di browser — JPEG 4000px dikirim ke ponsel. Itu menghancurkan waktu muat dan Core Web Vitals Anda. Turunan-turunan itu ada karena suatu alasan.

Jangan percaya “ukuran yang direkomendasikan” sebuah plugin di atas ukuran yang sebenarnya terdaftar di tema Anda. Plugin SEO merekomendasikan 1200x630 untuk tag OG, yang memang benar untuk tag itu. Itu sama sekali tidak berbicara soal ke ukuran apa template single-post Anda meng-crop.

Jangan lewatkan wp media regenerate setelah mengubah ukuran. Mengedit add_image_size() tidak berpengaruh apa-apa pada gambar yang sudah di-upload. Ini langkah yang sering dilupakan orang, lalu mereka menyimpulkan kodenya tidak bekerja.

Masih buntu?

Kalau gambar masih salah setelah menyesuaikan dimensi dan melakukan regenerate, masalahnya biasanya mode crop (true vs false) atau srcset yang menyajikan turunan lebih kecil dari yang Anda kira. Masukkan file ke tool ukuran gambar untuk melihat persis crop apa saja yang dihasilkan setup Anda, lalu bandingkan dengan apa yang dimuat browser di DevTools. Cocokkan keduanya dan tebak-tebakan pun berakhir.