You are currently viewing Cara Menambahkan Caption Gambar Otomatis di WordPress

Cara Menambahkan Caption Gambar Otomatis di WordPress

Caption gambar bisa sangat membantu dalam memberikan konteks dan meningkatkan SEO situs Anda. Dalam artikel ini, kita akan membahas bagaimana cara menambahkan caption gambar otomatis di WordPress berdasarkan judul file gambar.

Ada beberapa kasus di mana Anda mungkin ingin caption gambar di WordPress dibuat secara otomatis dari judul file gambar. Misalnya, jika Anda sering meng-upload banyak gambar sekaligus dan ingin mempercepat proses penambahan caption.

Anda dapat melakukannya dengan menambahkan kode kecil ini ke file functions.php di tema WordPress Anda. Disini, kami sudah membuatkan 2 jenis kode, yang memiliki manfaat berbeda. Silahkan pilih salah satu sesuai kebutuhan.

 

Script Caption Gambar Otomatis

Caption Otomatis Umum

Ini adalah kode umum, dimana semua teks judul gambar, akan diubah menjadi teks caption.

function add_image_title_as_caption($attachment_Id) {
$attachment = get_post($attachment_Id);
$my_image_title = $attachment->post_title;

// Update caption
$attachment->post_excerpt = $my_image_title;
wp_update_post($attachment);
}

add_action('add_attachment', 'add_image_title_as_caption');

Hasilnya akan jadi seperti ini:

01. Kolom caption akan langsung terisi dengan judul gambar
Kolom caption akan langsung terisi dengan judul gambar

Jadi, ketika gambar di upload di post atau melalui media library, kolom caption nya akan langsung terisi sesuai judul file gambar yang di upload tersebut.

Status: Berhasil di Tes pada WordPress versi 6.2.2, oleh Tim DEVanoda.

Caption dengan memangkas 4 karakter depan

Namun, Anda mungkin memiliki skenario di mana judul file gambar Anda mengandung beberapa karakter awal yang tidak Anda inginkan di caption, seperti nomor dan titik.

Dalam hal ini, Anda dapat memodifikasi kode di atas untuk memotong beberapa karakter pertama dari judul. Berikut adalah contohnya:

/*** Caption Gambar Otomatis mengurangi 4 karakter- By DEVanoda ***/
function add_image_title_as_caption($metadata, $attachment_id) {
// Check jika metadata ada
if(!isset($metadata)) return $metadata;

$attachment = get_post($attachment_id);
$my_image_title = $attachment->post_title;

// Jika judul tidak kosong dan metadata 'image_meta' ada
if($my_image_title && isset($metadata['image_meta'])) {
// Memotong empat karakter pertama dari judul
$my_image_title = substr($my_image_title, 4);
$metadata['image_meta']['caption'] = $my_image_title;
}

return $metadata;
}
add_filter('wp_generate_attachment_metadata', 'add_image_title_as_caption', 10, 2);

Dengan kode di atas, judul seperti “01. Pikachu” akan diubah menjadi “Pikachu” sebelum disimpan sebagai caption gambar.

Hasil nya akan menjadi seperti ini:

02. Empat karakter depan akan langsung terhapus
Empat karakter depan akan langsung terhapus
03. Hasil caption gambar di text editor
Hasil caption gambar di text editor
04. Hasil caption gambar ketika post di publish
Hasil caption gambar ketika post di publish

 

Catatan

Caption Gambar yang sebelum nya ada tidak terpengaruh

Perlu diperhatikan bahwa penambahan kode ini tidak akan mempengaruhi gambar dan caption yang sudah ada. Ini hanya akan berlaku untuk gambar yang di-upload setelah kode ini ditambahkan.

Jika Anda ingin merubah caption gambar yang telah ada sebelumnya, Anda harus melakukannya secara manual melalui library media di WordPress.

Caption bisa di override manual

Jika ada kesalahan dalam judul gambar, Anda tetap bisa merubah caption secara manual setelah gambar di-upload. Perubahan manual tersebut akan dipertahankan dan tidak akan diganti oleh judul file gambar kembali.

Caption Pada Gambar Fitur Tetap Muncul

Kode diatas juga akan menambahkan caption pada Gambar Fitur juga, yang kadang ada beberapa orang yang tidak menyukainya.

07. Caption muncul pada gambar fitur juga
Caption muncul pada gambar fitur juga

Jika Anda tidak ingin caption tersebut tidak muncul di Gambar Fitur, ada dua cara yang bisa Anda lakukan.

  1. Menghapusnya secara manual. Ini pilihan termudah yang bisa Anda lakukan.
  2. Menyembunyikan caption pada gambar fitur. Caranya, dengan menerapkan kode CSS ini ke dalam tema Anda.
.figcaption-class {
display: none;
}

Ganti .figcaption-class dengan kelas CSS yang sesuai untuk caption gambar fitur di tema Anda. Anda mungkin perlu menggunakan alat inspeksi elemen di browser Anda untuk mengetahui kelas CSS ini.

Jika Anda memakai tema oceanWP, .figcaption-class bisa diganti langsung dengan .thumbnail-caption. Hasil kode nya seperti gambar dibawah ini.

08. Kode untuk menyembunyikan caption di gambar fitur
Kode untuk menyembunyikan caption di gambar fitur

Kode CSS tersebut, sudah kami test, dan berhasil. Berikut adalah tampilan Gambar Fitur tanpa caption.

09. Tampilan gambar fitur tanpa caption
Tampilan gambar fitur tanpa caption

 

Tips: Gunakan Penomoran Saat Memasukan Gambar

Ada beberapa alasan mengapa Anda perlu menambahkan nomor di depan nama file gambar. Ini juga yang menjadi alasan, mengapa Script Caption dengan memangkas 4 karakter depan (jenis kedua) kami sediakan juga.

  1. Pengurutan: Menambahkan nomor di depan nama file gambar dapat membantu dalam pengurutan dan organisasi. Misalnya, jika Anda memiliki serangkaian gambar yang perlu ditampilkan dalam urutan tertentu, penambahan nomor di depan dapat memastikan bahwa gambar tersebut muncul dalam urutan yang benar saat diurutkan secara alfanumerik.
  2. Pembedaan Versi: Dalam beberapa kasus, nomor di depan nama file dapat digunakan untuk membedakan antara versi yang berbeda dari gambar yang sama. Misalnya, Anda mungkin memiliki gambar asli dan versi yang diedit dari gambar yang sama. Dalam hal ini, penambahan nomor dapat membantu Anda membedakan antara dua versi tersebut.
  3. Mencegah Duplikasi: Kadang-kadang, ketika file gambar di-upload dengan nama yang sama dengan gambar yang sudah ada, sistem akan secara otomatis merename file tersebut dengan menambahkan nomor di belakang. Untuk mencegah hal ini, Anda bisa menambahkan nomor di depan nama file untuk memastikan bahwa setiap gambar memiliki nama yang unik.

Adapun kami juga menggunakan metode penomoran ini, untuk mempersingkat waktu dan mencegah kebingungan ketika memasukan gambar.

Ini adalah beberapa gambar di post ini, dengan penomoran.

05. File gambar kami untuk post ini
File gambar kami untuk post ini

Kemudian, di bagian post editor, kami memberikan tanda semacam “XXX1” atau “XXX2” untuk menandai lokasi dimana nomor gambar tersebut perlu dimasukan.

06. Penandaan lokasi gambar di bagian text editor
Penandaan lokasi gambar di bagian text editor

Sehingga, selanjutnya kami tinggal mengupload semua gambar nya. Kemudian memasukan nya sesuai penandaan yang sebelumnya telah kami berikan.

 

Penutup

Ingatlah bahwa ketika Anda menambahkan nomor di depan nama file, ini juga menambah jumlah karakter dalam nama file. Untuk alasan ini, jika Anda memutuskan untuk menggunakan metode ini, pastikan bahwa Anda masih menjaga nama file gambar tetap singkat dan jelas.

Terlalu banyak karakter dalam nama file dapat membuatnya sulit dibaca dan dipahami oleh pengguna dan mesin pencari.

Leave a Reply