Family Encyclopedia >> Electronics

How to add additional fields to WordPress Media Uploader

While working on a project where we created a very cool gallery with WordPress attachments and a custom post type, we found the need to add additional fields to the WordPress media uploader. These additional fields allowed us to credit each photographer by adding the photographer's name and URL to each image page. WordPress stores images as posts in the attached post type, so adding metadata is like adding custom fields. Since WordPress attachments don't have a custom fields UI, we need to add custom fields to the media uploader to collect the metadata. In this article, we will show you how to add additional fields to WordPress Media Uploader.

We will use the following filters to make the change:implements_fields_to_edit and implements_fields_to_save

For a project like this, we recommend that you create a site-specific plugin and add the following code. However, you can still add the codes in your theme's functions.php file to make it work.

 / ** * Agregue el nombre del fotógrafo y los campos de URL al cargador de medios * * @param $ form_fields array, campos para incluir en el formulario de adjunto * @param $ post objeto, registro de adjunto en la base de datos * @return $ form_fields, campos de formulario modificados * / función be_attachment_field_credit ($ form_fields, $ post) $ form_fields ['be-photographer-name'] = array ('label' => 'Photographer Name', 'input' => 'text', 'value' => get_post_meta ($ post-> ID, 'be_photographer_name', verdadero), 'ayuda' => 'Si se proporciona, se mostrará el crédito de la foto',); $ form_fields ['be-photographer-url'] = array ('label' => 'Photographer URL', 'input' => 'text', 'value' => get_post_meta ($ post-> ID, 'be_photographer_url', verdadero), 'ayuda' => 'Agregar URL del fotógrafo',); devuelve $ form_fields; add_filter ('attachment_fields_to_edit', 'be_attachment_field_credit', 10, 2); / ** * Guardar los valores del nombre y la URL del fotógrafo en el cargador de medios * * @param $ post array, los datos de publicación para la base de datos * @param $ array, campos de datos adjuntos de $ _POST form * @return $ post array, datos de publicación modificados * / function be_attachment_field_credit_save ($ post, $ attachment) if (isset ($ attachment ['be-photographer-name'])) update_post_meta ($ post ['ID'], 'be_photographer_name', $ attachment ['be-photographer -nombre'] ); if (isset ($ attachment ['be-photographer-url'))) update_post_meta ($ post ['ID'], 'be_photographer_url', esc_url ($ attachment ['be-photographer-url'))); devuelve $ post; add_filter ('attachment_fields_to_save', 'be_attachment_field_credit_save', 10, 2); ?> 

The above code will add two text fields to the Media Uploader called Photographer Name and Photographer URL. You can see that in the screenshot below:

How to add additional fields to WordPress Media Uploader

Code explanation: In the first function, we are simply using an array to specify the field's label, input type, value, and help text. The second function is to check if a value has been set for those fields. If the value is set, then the post metadata is updated.

If you want to display the fields in your attachment template, just paste the following code inside the loop:

echo get_post_meta ($ post-> ID, 'be_photographer_url', true);

If you want to display your featured image fields in your archive template or any other template, just use:

echo get_post_meta (get_post_thumbnail_id (), 'be_photographer_url', true);

We hope you have enjoyed this article. For those who don't know how to create the template from an attachment, don't worry. In the next article, we will see how to create an attachment template in WordPress.

Hat tip to Bill Erickson for showing us how to do this.