Dalam artikel ini, kita akan membahas cara mudah upload webp di WordPress sehingga ketika websitemu menggunakan banyak gambar, loadingnya tetap cepat.
Ketika menggunakan gambar dengan format WEBP, kamu bisa menggunakan gambar dengan kualitas yang sama dengan format PNG, JPG, dan JPEG, namun dengan ukuran yang lebih kecil.
Dengan format WEBP kamu bisa mengurangi ukuran file hingga 1.42x lebih rendah dibandingkan JPEG, 1.70x lebih rendah dibandingkan PNG, dan 1.75x lebih rendah dibandingkan AVIF. Berikut adalah contoh gambar dengan format PNG dan setelah di kompress menjadi WEBP.
Pada gambar ini, saya menggunakan sebuah gambar JPG dengan ukuran 1.34MB dengan dimensi 3840×2400, resolusi 96 DPI.
Seperti yang terlihat, kedua gambar diatas tidak memiliki perbedaan. Namun dari segi ukuran, kedua gambar diatas memiliki perbedaan yang sangat signifikan, dimana gambar JPG memiliki ukuran 1.34 MB. sedangkan gambar WEBP memiliki ukuran 777KB.
Sejak Versi 5.8, WordPress sudah default mengizinkan upload file .webp. Apabila kamu menggunakan versi ini atau lebih tinggi, maka kamu tidak perlu menambahkan kode tertentu untuk bisa upload file webp.
Secara default, wordpress akan mencegah website kamu untuk upload gambar dengan format webp, sehingga untuk upload WEBP, kamu perlu menggunakan plugin, atau menambahkan baris kode tambahan supaya kamu bisa mengupload gambar dengan format WEBP.
Cara pertama yang perlu kamu lakukan adalah menambahkan kode supaya WordPress dapat menerima file WEBP dan menampilkan preview dari gambar tersebut.
/* Mengizinkan Upload File WEBP */function wg_upload_webp( $existing_mimes ) { // Menambahkan webp ke daftar mime $existing_mimes['webp'] = 'image/webp'; // Mengirimnkan array kembali ke fungsi yang sudah ditambahkan mime webp return $existing_mimes;}add_filter( 'mime_types', 'wg_upload_webp' );
//** * Menambahkan preview untuk gambar dengan format WEBP.*/function wg_show_webp($result, $path) { if ($result === false) { $displayable_image_types = array( IMAGETYPE_WEBP ); $info = @getimagesize( $path ); if (empty($info)) { $result = false; } elseif (!in_array($info[2], $displayable_image_types)) { $result = false; } else { $result = true; } } return $result;}add_filter('file_is_displayable_image', 'wg_show_webp', 10, 2);Untuk mengubah gambar menjadi WEBP, kamu bisa menggunakan beragam tools yang saat ini sudah tersedia secara online. Berikut adalah daftar layanan yang dapat membantu kamu mengubah gambar menjadi WEBP sebelum gambar tersebut di upload ke WordPress.
KOMENTAR
Memuat...