Apa itu hook wp_prepare_attachment_for_js?

Hook wp_prepare_attachment_for_js adalah sebuah filter yang memungkinkan kita untuk mengubah data attachment yang disiapkan untuk JavaScript. Data attachment ini biasanya digunakan untuk menampilkan informasi dan opsi attachment di media library, media modal, atau customizer.

Hook ini memiliki tiga parameter: $response, $attachment, dan $meta. Parameter $response adalah array yang berisi data attachment yang akan dikirim ke JavaScript. Parameter $attachment adalah objek WP_Post yang merepresentasikan attachment itu sendiri. Parameter $meta adalah array yang berisi metadata attachment, atau false jika tidak ada.

Mengapa kita perlu menggunakan hook wp_prepare_attachment_for_js?

Hook wp_prepare_attachment_for_js berguna jika kita ingin menambahkan, menghapus, atau mengubah data attachment yang ditampilkan di JavaScript. Misalnya, kita bisa menambahkan custom field, custom size, atau custom action untuk attachment kita. Kita juga bisa menghapus data yang tidak perlu atau mengubah format data yang ada.

Bagaimana cara menggunakan hook wp_prepare_attachment_for_js?

Untuk menggunakan hook wp_prepare_attachment_for_js, kita perlu menambahkan fungsi callback kita ke filter tersebut dengan menggunakan fungsi add_filter(). Fungsi callback kita harus menerima tiga parameter: $response, $attachment, dan $meta. Fungsi callback kita harus mengembalikan array $response yang sudah dimodifikasi.

Berikut adalah contoh penggunaan hook wp_prepare_attachment_for_js untuk menambahkan custom field ke data attachment:

// Menambahkan custom field ke data attachment
function my_custom_field_attachment_data( $response, $attachment, $meta ) {
    // Mendapatkan nilai custom field dari post meta
    $custom_field = get_post_meta( $attachment->ID, '_my_custom_field', true );

    // Menambahkan custom field ke array response
    $response['customField'] = $custom_field;

    // Mengembalikan array response yang sudah dimodifikasi
    return $response;
}

// Menambahkan fungsi callback ke filter wp_prepare_attachment_for_js
add_filter( 'wp_prepare_attachment_for_js', 'my_custom_field_attachment_data', 10, 3 );

Dengan kode di atas, kita bisa mengakses nilai custom field di JavaScript dengan menggunakan properti customField dari objek attachment. Misalnya, kita bisa menampilkan nilai custom field di media modal dengan menggunakan kode berikut:

// Menampilkan nilai custom field di media modal
wp.media.view.Attachment.Details.prototype.render = function() {
    // Memanggil fungsi render asli
    wp.media.view.Attachment.prototype.render.apply( this, arguments );

    // Mendapatkan objek attachment
    var attachment = this.model.toJSON();

    // Mendapatkan elemen container
    var container = this.$el;

    // Menambahkan elemen untuk menampilkan custom field
    container.append( '<div class="custom-field">Custom Field: ' + attachment.customField + '</div>' );
};