Panduan Pemula untuk Ukuran Gambar WordPress (+ Praktik Terbaik)

Temukan dasar-dasar ukuran gambar WordPress dalam panduan pemula yang mudah diikuti ini. Pelajari bagaimana WordPress secara otomatis membuat versi gambar mini, sedang, dan besar, mengapa ukuran tersebut penting untuk tampilan dan kinerja situs Anda, dan bagaimana WP Media Folder dapat membantu Anda tetap terorganisir.

 Panduan ini menjelaskan ukuran gambar default WordPress (thumbnail, sedang, besar), mengapa mereka ada, dan bagaimana menyesuaikan mereka untuk tema Anda. Kami juga akan dapat melihat bagaimana plugin WP Media Folder dapat membantu mengelola gambar Anda. Jika Anda tidak teknis, ini masih akan mudah diikuti. Tapi Anda akan belajar persis bagaimana WordPress menangani ukuran gambar dan bagaimana menyesuaikannya.

Tinjauan Ukuran Gambar Default WordPress

Saat Anda mengunggah gambar ke WordPress, secara otomatis membuat beberapa versi gambar tersebut untuk disajikan di berbagai tempat di situs Anda. Secara default, WordPress menghasilkan:

• Thumbnail: versi persegi 150 × 150 piksel. Sering digunakan dalam daftar pratinjau blog, widget, dan galeri.
• Menengah: versi yang diskalakan sehingga sisi terpanjang adalah 300 piksel. Jika gambar Anda lebih tinggi daripada lebarnya, mungkin 300 tinggi dan lebar lebih kecil, atau sebaliknya.
• Besar: versi di mana sisi terpanjang adalah 1024 piksel. Baik untuk gambar unggulan lebar penuh atau tajuk postingan blog.
• Lengkap: file yang tepat yang Anda unggah, tidak diubah.

WordPress memilih ukuran optimal untuk dikirimkan tergantung pada di mana gambar ditampilkan. Thumbnail kecil dalam daftar postingan dikirimkan pada ukuran 150 × 150; banner gambar unggulan mungkin menggunakan ukuran maksimum 1024px. Sistem ini mengoptimalkan kecepatan pemuatan, penggunaan bandwidth, dan tampilan di seluruh perangkat dan ukuran layar.

Mengapa WordPress menghasilkan ukuran-ukuran ini secara otomatis

• Untuk memastikan gambar sesuai dengan area desain dengan tepat (misalnya, tidak diskalakan atau kabur).
• Untuk mengurangi ukuran file dan meningkatkan kinerja pemuatan halaman, terutama pada perangkat seluler
• Untuk menyederhanakan alur kerja bagi pembuat konten—tidak perlu mengubah ukuran secara manual.

Jika gambar yang Anda unggah lebih kecil dari ukuran yang dihasilkan WordPress (misalnya, foto 800 px lebar), WordPress hanya akan membuat ukuran hingga dimensi yang didukung gambar—sehingga ukuran besar tidak akan melebihi ukuran aslinya.

Praktik Terbaik untuk Menggunakan Ukuran Gambar Default

Berikut beberapa kasus penggunaan umum untuk setiap ukuran default:

Gambar Mini

Gunakan untuk kisi-kisi galeri, pratinjau postingan blog, widget, atau daftar sidebar. Jangan gunakan ukuran thumbnail untuk area tampilan besar; itu akan terlihat berpiksel.

Untuk contoh ini, kami menggunakan galeri yang dibuat dengan WP Media folder.

Sedang

Ideal untuk gambar inline dalam postingan blog atau spanduk yang lebih kecil. Ini mencapai keseimbangan yang baik antara kejelasan dan ukuran file.

Ukuran Besar

Gunakan untuk gambar berlebar penuh, tajuk unggulan, penggeser, atau bagian layar penuh. Hindari menggunakan ukuran asli penuh kecuali benar-benar diperlukan (misalnya, foto berkualitas tinggi) karena dapat membengkak dan memperlambat pemuatan halaman.

Mengunggah file asli yang sangat besar (misalnya ribuan piksel dalam lebar atau gambar TIFF atau PNG beresolusi tinggi) tidak disarankan. Mereka membutuhkan lebih banyak ruang penyimpanan dan dapat memperlambat situs atau server pemrosesan media Anda. Idealnya, unggah gambar yang telah diubah ukurannya agar kira-kira sesuai dengan lebar tampilan maksimum tema Anda (misalnya 1200px lebar jika area konten Anda adalah 1200px).

Cara Menyesuaikan Dimensi Gambar untuk Tema Anda

Secara default WordPress menggunakan ukuran di Pengaturan > Media, tapi Anda mungkin ingin menyesuaikan ukuran tersebut atau menambahkan yang baru untuk kebutuhan tema Anda.

Mengubah dimensi default melalui layar admin

Buka dasbor WordPress Anda > Pengaturan > Media. Di sini Anda dapat mengubah dimensi piksel untuk Thumbnail, Sedang, dan Besar. Setelah melakukan perubahan, simpan. Unggahan masa depan akan menggunakan pengaturan baru.

Namun, gambar yang sudah diunggah tidak akan dibuat ulang secara otomatis, Anda perlu menggunakan plugin regenerasi thumbnail jika Anda mengubah ukuran nanti.

Menambahkan ukuran gambar kustom dalam kode tema Anda

CATATAN PENTING: Anda tidak boleh menerapkan kode khusus apa pun tanpa membuat cadangan terlebih dahulu.

Untuk mendaftarkan ukuran gambar baru di luar thumbnail/sedang/besar, Anda dapat menambahkan kode di file functions.php tema Anda atau di plugin kustom. Contoh:

add_image_size( 'custom-feature', 800, 600, true ); 

Ini mendaftarkan ukuran baru bernama 'custom-feature', dengan lebar 800px, tinggi 600px, dan pemangkasan diaktifkan.

Kemudian Anda dapat memanggilnya di file tema Anda:

the_post_thumbnail( 'custom-feature' ); 

Atau di Gutenberg Anda mungkin melihat ukuran baru di dropdown blok gambar jika tema Anda mendukungnya.

Anda dapat menambahkan beberapa ukuran kustom. Setelah mendaftarkan mereka, regenerasi thumbnail untuk gambar yang ada sehingga WordPress membuat versi baru.

Praktik terbaik saat memilih ukuran kustom Anda

• Cocokkan dimensi dengan tata letak tema Anda. Contohnya ukuran banner header, ukuran unggulan posting blog, atau lebar gambar dalam artikel.
• Hindari mengubah ukuran gambar menjadi ukuran yang jauh lebih besar dari kontainer—membuang ruang disk dan memperlambat pemuatan.
• Gunakan pemotongan saat Anda menginginkan gambar dengan rasio aspek yang konsisten, misalnya 16:9 atau 4:3. Atur pemotongan ke true atau false tergantung pada apakah pemotongan atau penskalaan proporsional lebih disukai.
• Uji gambar yang disisipkan setelah menambahkan ukuran kustom untuk memastikan mereka ditampilkan dengan benar di desktop dan mobile.

Menghasilkan ulang thumbnail

Jika Anda mengubah ukuran default atau menambahkan ukuran baru, gambar lama tidak akan secara otomatis memiliki ukuran baru yang dibuat. Gunakan plugin seperti "Regenerate Thumbnails" atau yang serupa untuk membuat ulang semua ukuran gambar untuk unggahan sebelumnya. Ini memastikan perpustakaan media Anda memiliki ukuran yang tepat yang dapat disajikan WordPress dalam berbagai konteks.

Ringkasan Praktik Terbaik

• Unggah gambar yang ukurannya mendekati lebar tampilan maksimum tema Anda (misalnya, lebar 1200px). Biarkan WordPress membuat ukuran yang lebih kecil.
• Pertahankan ukuran default pada 150px (thumbnail), 300px (sedang), dan 1024px (besar), kecuali tema Anda membutuhkan nilai yang berbeda. Ubah di bawah Pengaturan > Media.
• Tambahkan ukuran kustom melalui add_image_size() dalam kode tema atau plugin Anda untuk area tampilan unik (misalnya, banner hero, blok unggulan).
• Setelah menyesuaikan ukuran atau menambahkan yang baru, regenerasi thumbnail sehingga WordPress membuat ukuran tersebut untuk unggahan lama.
• Gunakan pemotongan saat rasio aspek yang konsisten diperlukan, atau penskalaan proporsional saat Anda lebih suka mempertahankan proporsi asli.

Petunjuk tambahan: perlu diingat WP Media Folder jika Anda membutuhkan organisasi berbasis folder, pencarian/filter media yang lebih baik, pembuatan galeri yang lebih mudah, penggantian media, dan peningkatan alur kerja lainnya. Ini bekerja dengan mulus dengan pengaturan ukuran gambar Anda.

Membungkus: Menguasai Ukuran Gambar WordPress untuk Situs yang Cepat dan Indah

Memahami ukuran gambar WordPress membantu Anda menyajikan gambar yang tepat di tempat yang tepat. Thumbnail, medium, dan besar dirancang untuk menyeimbangkan kualitas dan kinerja. Anda dapat menyesuaikan ukuran-ukuran ini atau menambahkan yang baru untuk mencocokkan tata letak tema Anda.WP Media Folder membawa struktur folder, manajemen lanjutan, alat penggantian, watermarking, dan alat galeri di atas sistem media default WordPress.

Bahkan jika Anda tidak menganggap diri Anda teknis, langkah-langkah ini mudah: sesuaikan pengaturan di bawah Media, instal plugin regenerasi setelah perubahan, secara opsional daftarkan ukuran kustom di tema Anda, dan gunakan WP Media Folder untuk mengatur perpustakaan media Anda dengan lebih efisien. Dengan begitu, gambar Anda terlihat bagus, memuat dengan cepat, dan mudah dikelola.